Image buttons must have alternate text

Log in (Premium content) Request a demo

Rule Description

When an image is being used as an <input> button, it must have alternate text to allow screen reader users to know its purpose.

The Algorithm, in Simple Terms

Ensures that every <input type="image"> has an accessible name.

Why this is Important

An <input type="image"> button must have alternate text, otherwise screen reader users will not know the button's purpose. Even if the image contains only text, it still requires alternate text, since a screen reader cannot translate images of words into output.

How to Fix the Problem

Check that the <input type="image"> has a non-empty alt, aria-label or aria-labelledby attribute.

Compliance Data & User Impact

User Impact: Critical
Disabilities Affected:
  • Blindness
  • Deafblindness
  • Mobility/Dexterity
Issue Type:
  • WCAG 2.0 (A): MUST
  • Section 508: MUST
WCAG Success Criteria:
  • 1.1.1 Non-text Content
Section 508 Guidelines:
  • 1194.22 (a) Text equivalent for non-text elements

Related Deque University Course Pages

Other Related Resources

Additional Information

Relevant Technologies:
  • HTML 4
  • HTML5
  • ARIA
Test Reliability: Automated testing is possible, with high accuracy
Rule ID: input-image-alt