LOWWCAG 1.1.1 A
Decorative Image Alt Noise
Images that convey no information are announced with file-like descriptions, adding auditory clutter.
Try It Yourself
Demo warning
Decorative visuals should usually be silent for assistive tech, but noisy alt text pollutes reading flow.
Tab through the demo card and observe how decorative image announcements interrupt meaningful content.
Visual page section
SR announcements:
- image, blue-divider-line-shadow
- image, starburst-left-edge
- image, abstract-swoosh-background
Manual Testing Protocol
Follow this sequence to reproduce the failure consistently and verify the fix with the same workflow.
1. Setup
- Enable SR simulation and navigate through decorative section.
- Keep focus traversal linear to capture every announcement.
2. Reproduction Steps
- Tab through content containing decorative graphics.
- Record announcements produced for non-informational images.
- Assess interruption frequency relative to meaningful content.
3. Expected Failure Signals
- Decorative assets are announced with irrelevant descriptive text.
- Reading flow becomes noisy and slower to parse.
- Users expend attention on non-essential announcements.
4. Fix Verification
- Purely decorative images use empty alt (`alt=""`) or CSS backgrounds.
- Informational images retain concise purpose-based alternatives.
- Announcement stream focuses on actionable content only.
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
- Screen reader output becomes noisy
- Important content is harder to find
- Reading flow slows due to irrelevant announcements
Who Gets Hurt
Screen reader users
Users sensitive to cognitive load
The Broken Code
<img src="/divider-wave.png" alt="blue decorative divider wave shadow top" />
<img src="/sparkle.svg" alt="small sparkle shape icon" />
<!-- Decorative images should generally use alt="" -->WCAG 1.1.1: Reference
"All non-text content presented to the user has a text alternative that serves the equivalent purpose."
Level A - Good alternatives reduce noise as much as they provide meaning.
Related Low Issues
Explore neighboring failures in the same severity band.