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
normative — The rule checks the text alternative used as the accessible name for an image input.
Detection confidence
high — A 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.

Semantic context: Image-input alt text describes the action represented by the image.

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.
  • The alt text names the image-based action when the image cannot be seen.

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