Documentation/Image inputs need alt

Image inputs need alt

ZMD014

ZemDomu reports a supported <input type="image"> with a missing or empty alt attribute. Use concise alternative text that communicates the control's action.

What this rule catches

  • Static image input controls without an alt attribute.
  • Static alt values on image inputs that are empty or contain only whitespace.

What static analysis cannot prove

  • Static analysis cannot judge whether the alternative text describes the control's action clearly in context.
  • It cannot validate the image itself, visual focus indication, or the complete form workflow.

Standards classification and detection confidence

Classification
normativeThe rule checks the text alternative used as the accessible name for an image input.
Detection confidence
highA missing or empty static alt is deterministic. The rule cannot judge whether the supplied alternative accurately describes the control's action.

Applicable WCAG 2.2 criteria

Criterion 1.1.1 specifically requires a text alternative that describes the purpose of an input used as a control.

Normative means the rule checks a machine-testable part of a cited standards requirement. Advisory means it enforces a documented authoring convention or supporting technique. Neither classification makes a ZemDomu result proof of WCAG conformance.

Examples

✅ Good

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

❌ Bad

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

Quick summary

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").

Why it matters

Accessibility: Unlabeled image inputs are announced as “image” or skipped, confusing screen-reader users.

SEO: Missing alt text prevents image controls from being indexed as meaningful content.

Rule details

In brief

  • 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.

Intent

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

Benefits

  • Screen-reader users understand button function via alt text.
  • 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.

Techniques

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

HTML Semantics

The alt attribute on an <input type="image"> serves as the control’s accessible name per the HTML spec.

Tips & edge cases

  • Don’t rely on title attributes—screen readers may not announce them.
  • Keep alt text concise, focusing on the button’s action (e.g., “Upload file”).