- Success Criterion 1.4.5
- Conformance level AA
Screenshot of Text Used as the Page’s Primary Content
1.4.5 — Images of Text
Scenario
Setting
A grocery delivery app's shopping cart
What’s wrong
Screenshots of text used as the primary content (release notes, quotes, error messages) — not the "essential" exception.
Example
Picture a grocery delivery app's shopping cart: screenshots of text used as the primary content (release notes, quotes, error messages) — not the "essential" exception.
Why it matters
Low-vision users who need scalable text, and people who customize fonts or colors. Here, on a grocery delivery app's shopping cart, the result is they can't read the text against its background.
How to test
Try to select the content of a 'screenshot' (release notes, quotes, error messages): if it's used as the primary content instead of real text, it fails.
How to fix
Real text must be used instead of an image of text (except logos or where the exact rendering is essential).
Outcome
After the fix, the same visitor to a grocery delivery app's shopping cart can now read the text clearly against its background.
Who is affected
Low-vision users who need scalable text, and people who customize fonts or colors.
Learn more
- Understanding Understanding document (opens in a new tab)
Related scenarios
- Text-Heavy Content Rendered as an Image Instead of Real Text
- Page Heading or Banner Exported as an Image File
- Button or Navigation Label Rendered as an Image
- Marketing Text Baked Directly Into a Composite Image
- Restaurant Menu or Price List Uploaded as a Photo
- Email-Style Hero Image With All Its Copy Baked In