Search code examples
htmlaccessibilitysubmit-buttonwcag

WCAG submit button as image

In my form I have a submit button that is an image (button+text). It has an empty value="" so it doesn't intrude on the button image.

How can I make this button understandable to the user who requires accessibility?

<input type="submit" name="submit" id="submit" value="" class="button" style="background: url(img/enter-now-button.png) no-repeat;" />

Would a (hidden) label be appropriate?

<label class="hideForm" for="submit">Submit Form:</label> 
<input type="submit" name="submit" id="submit" value="" class="button" style="background: url(img/enter-now-button.png) no-repeat;" />
Solution

  • Providing the button’s content with CSS is a bad idea. CSS is for presentation, not content.

    Instead you could use