CRITICALWCAG 1.1.1 A
Missing Alt on Functional Images
Icon-only controls are rendered without accessible names, so assistive technologies announce generic labels like 'button'.
Try It Yourself
Demo warning
These controls look obvious visually but expose no usable name to screen readers.
Activate screen reader simulation and tab through each icon button. Hear how each one sounds identical.
Manual Testing Protocol
Follow this sequence to reproduce the failure consistently and verify the fix with the same workflow.
1. Setup
- Enable the built-in screen reader simulation panel.
- Start focus before the icon-only action row.
2. Reproduction Steps
- Tab through each icon-only control in sequence.
- Listen to the announced names for each control.
- Attempt to identify the destructive action before activating it.
3. Expected Failure Signals
- Controls announce generic names like 'button' with no purpose.
- Critical actions cannot be distinguished safely from benign ones.
- Navigation confidence drops because action intent is hidden.
4. Fix Verification
- Each control exposes a unique, action-oriented accessible name.
- Destructive actions are explicitly identified in label text.
- Announcements remain stable across focus and activation events.
Evidence Capture Checklist
- Record the exact user goal that fails (for example: submit form, complete checkout, navigate menu).
- Capture screen recording + keyboard path from first interaction to failure state.
- Map failure to WCAG 1.1.1 (Level A) and affected user groups.
- Document business impact: conversion loss, support burden, legal/compliance risk, or trust damage.
The Impact
What Happens
- Users cannot identify which control performs which action
- Critical actions become dangerous guesswork
- Navigation confidence collapses immediately
Who Gets Hurt
Blind users
Low-vision users with screen reader support
Users needing explicit action labels
Automation and indexing tools
The Broken Code
<button>
<svg aria-hidden="true"><!-- home icon --></svg>
<!-- No text, no aria-label -->
</button>
<a href="/cart">
<img src="/cart.svg" />
<!-- Missing alt text -->
</a>WCAG 1.1.1: Reference
"All non-text content presented to the user has a text alternative that serves the equivalent purpose."
Level A - A control without an accessible name is functionally invisible to many users.
Related Critical Issues
Explore neighboring failures in the same severity band.
WCAG 2.1.2 A
CRITICAL
Keyboard Trap
Focus gets stuck with no way out
Open Demo + Test Steps
WCAG 2.1.2 A
CRITICAL
Focus Trap in Drawer
Focus is trapped inside a slide-over panel
Open Demo + Test Steps
WCAG 4.1.3 AA
CRITICAL
No Error Announcement
Form errors are never announced to assistive tech
Open Demo + Test Steps