How I Learned to Stop Worrying and Ignore WCAG
Success Criteria with Contrast Exceptions
Summary of Contrast Success Criteria
The contrast of text, including text in images, and its background needs to meet a certain contrast ratio
Key Terms in Contrast Success Criteria
- contrast ratio
- Color theory stuff; just use a tool to calculate it.
- large scale (text)
- Complicated font stuff; just use a tool that also considers size.
Contrast Exceptions
- Large Text
- Larger text can have a slightly lower contrast ratio
- Incidental
- inactive interactive control text
- decorative element text
- invisible element text
- text in images, where the text isn't important
- Logotypes
- Logos and brand names
Examples
- Random words used to create a background and not for their meaning
- Person's name on a nametag in a photograph
- Inactive links, inputs, or controls
- Greyed out inputs or controls
- Previous link in pagination section where the link is inactive
- Logos for a business, product, etc.