Image inputs need alt

ZMD014

All <input type="image"> elements must include a non-empty alt attribute to label the control.

<input type="image" src="submit.png" alt="Submit form">

<input type="image" src="submit.png">

When: An <input type="image"> lacks a non-empty alt attribute

Warning: <input type="image"> missing alt attribute

Solution: Provide alt text for the input image (e.g., alt="Search site").

Accessibility: Unlabeled image inputs are announced as “image” or skipped, confusing screen-reader users :contentReference[oaicite:17]{index=17}.

SEO: Missing alt text prevents image controls from being indexed as meaningful content :contentReference[oaicite:18]{index=18}.

Goal: Make image buttons accessible by supplying alternate text.
What to do: Add an alt attribute with a brief description (e.g., alt="Submit form").
Why: Screen readers announce the alt text instead of leaving users guessing.

Prevent unlabeled image inputs from being skipped or misidentified by assistive technologies.

Screen-reader users understand button function via alt text :contentReference[oaicite:15]{index=15}.
Keyboard-only users can see the button’s purpose when focus lands on it.
Search engines index the control by its alt text, improving accessibility and SEO.

G94: Providing text alternatives for non-text content (applies to image inputs under SC 1.1.1).

The alt attribute on an <input type="image"> serves as the control’s accessible name per the HTML spec :contentReference[oaicite:16]{index=16}.

Don’t rely on title attributes—screen readers may not announce them :contentReference[oaicite:19]{index=19}.
Keep alt text concise, focusing on the button’s action (e.g., “Upload file”).