- Success Criterion 1.1.1
- Conformance level A
1.1.1 · Non-text Content
Lesson overview · Non-text Content
In plain language
Every meaningful image, icon, chart, or other non-text object needs a text alternative that serves the same purpose, while purely decorative images must be hidden from assistive technology.
Who it affects
Blind and low-vision people using screen readers, and anyone who browses with images disabled, when icons or photos carry meaning.
How to check
Turn on a screen reader (NVDA/VoiceOver) or inspect the code: every meaningful image should announce a sensible description; decorative ones should be skipped silently.
Common misconception
Adding some alt text isn't the goal. Wrong or lazy alt text (“image123”, keyword-stuffed SEO text) fails just as badly as no alt text, and marking a real photo as decorative hides real content.
Learn more
Scenarios in this lesson
- Product Photo Added as a CSS Background With No Alt Text
- Chart Alt Text That Never Explains What Each Color Means
- Outdated Alt Text That No Longer Matches the Image
- Alt Text Left as a Filename Instead of a Real Description
- Decorative Image Not Hidden From Screen Reader Users
- Decorative Image Given Alt Text Instead of Being Marked Silent
- Images Published With No Alt Attribute at All
- Long Image Description That Skips the Image’s Actual Content
- Fancy Unicode Letters Used Instead of Real, Readable Text
- ASCII Art With No Text Description for Screen Readers
- Informative Icon or Logo SVG With No Accessible Name
- Inline SVG Whose Title Text Doesn’t Match What It Shows
- Icon Font Used to Convey Meaning With No Text Backup
- Chart Drawn in Canvas With No Fallback Description
- Clickable Image Map Regions With No Individual Names
- CAPTCHA Challenge With No Text-Based Way to Solve It
- Meaningful Emoji With No Text Explaining Its Intent
- Alt Text That Describes a Completely Different Image
- Image Alt Text That Repeats a Caption Word for Word
- Complex Infographic With No Long-Form Text Description
- Decorative Image Wrongly Made Keyboard-Focusable
- Logo Image Alt Text That Just Says ‘Logo’
- Silent Background Video That Actually Shows Product Info
- Figure Caption That Doesn’t Describe Its Own Image
- QR Code With No Text Stating Where It Leads
- JavaScript Chart With No Accessible Data Table Behind It
- Star Rating Shown Only as Images, Never as Text
- Audio Clip Published With No Label Identifying It
- Meaningful Image Hidden From Screen Readers by Mistake
- Scanned PDF Images With No OCR Text Underneath
- Lazy-Loaded Image Whose Alt Text Never Finishes Loading
- Mood-Only Hero Image Given an Overly Detailed Alt Description
- Decorative Bullet Symbols Read Aloud by Screen Readers
- Alt Text So Long It Buries the Image’s Real Purpose