H36Sufficient technique WCAG 1.1.1 Level A Partly scanner-detectable

Add alt text to image submit buttons

An image submit button shows a picture where an ordinary button shows words, so its alt attribute has to carry the button's job rather than the picture's description. Search, not magnifying glass. Sign up, not blue arrow. W3C lists H36 as sufficient for 1.1.1 Non-text Content on its own, with no partner technique needed. The case where it matters most is the form carrying more than one image button, because there a vague alt does not merely fail to help, it sends people to the wrong outcome. Controls that already have a name, a button with text or an image that carries one some other way, sit outside this technique.

How we find it in an audit

Image inputs with no alt are a fast automated find. The slow half is quality. Values like go button and arrow.png satisfy a scanner and tell a person nothing about what pressing the thing will do, so every one of them gets read by a human.

How affected users experience it

Somebody types a search term, tabs forward, and hears button, submit dash final dash v2 dot png. Now they press it on faith. On a search box that is irritating. On a payment form, where the two image buttons are Save card and Pay now, pressing on faith is not something anybody should have to do.

Passes vs. fails

Passes: alt text names the product. Fails: the file name is all there is.

Passes

<input type="image" src="btn-go.png" alt="Search">

Fails

<input type="image" src="btn-go.png">

How this gets tested

The W3C publishes test rules that define what a checker looks for here.

Element marked as decorative is not exposedA tool can check this
Image accessible name is descriptiveA tool finds candidates, you decide
Image button has non-empty accessible nameA tool can check this
Image has non-empty accessible nameA tool can check this
Link has non-empty accessible nameA tool can check this
Object element rendering non-text content has non-empty accessible nameA tool can check this
SVG element with explicit role has non-empty accessible nameA tool can check this
Image not in the accessibility tree is decorativeA tool can check this

Other ways to satisfy this rule

39 guides on this site are filed under 1.1.1 Non-text Content. W3C lists this one as sufficient for that rule on its own. Implement it correctly, in a way your readers' software actually supports, and the rule is met.

This guide is our interpretation of W3C technique H36: Using alt attributes on images used as submit buttons. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.