Does the image input have alt text?

Goal

Ensure that image inputs are programmatically identifiable for people using assistive technology (AT).

Why this matters

The <input type="image"> behaves as a button, and the alt text on that input behaves as the button’s label. If a user doesn’t know what the label for a button is, they’re not likely to use it.

How to implement

Writer

Read Image alt text and SVG titles for instructions on writing quality alt text.

Developer

See <input type=”image”> on MDN’s site for instructions on how to implement.

How to test

Manual testing

  1. Right-click the input and inspect the code.
  2. Confirm that the <input type="image"> also includes a populated alt="..." attribute.
    1. An empty alt string is a failure.
    2. No alt attribute is a failure.
    3. Alt text that tells the user what the button looks like, not what it does, is a failure.

Automated testing

Warning!
The alt attribute is not required according to the HTML spec, so confirm that your HTML validator flags this as an error, not a warning!

HTML validation may identify that the alt attribute is missing or empty.

Because the content of the attribute is contextual, automated testing cannot identify whether the alt text makes sense in the context of the page.