Graphic Button Alt Text Check

Description

The “Graphic Button Alt Text Check” evaluates whether all <input type="image"> elements on the page have a non-empty, descriptive alt attribute, which serves as the accessible label for users relying on screen readers or keyboard navigation.

Example outcome

I noticed that all the graphic buttons on the page make use of the alt attribute.

Impact

• Visual Impairments: Screen reader will announce the image as “button” without meaning.
• Motor Impairments: Button cannot be located or targeted via assistive tools.
• Cognitive Disabilities: Users may not understand button function due to lack of clarity.

Fixes

To address graphic buttons missing alternative text:

1. Locate the <input type="image"> element missing an alternative text.
2. Add a descriptive alt text, providing information about the action performed by a click.

Resources

• WCAG 2.2: Understanding Success Criteria 1.1.1
• WCAG 2.2: Understanding Success Criteria 4.1.2
• WCAG 2.2 Techniques: Technique H36: Using alt attributes on images used as submit buttons
• WebAIM: Alternative Text