Use of Color
Summary:
WCAG 1.4.1, titled "Use of Color," focuses on ensuring that color is not the sole method of conveying information, indicating an action, prompting a response, or distinguishing a visual element. This is especially important for users who are color blind or have difficulty distinguishing colors.
What:
This criterion requires that information conveyed with color is also available without color, either through text or other visual cues. It ensures that users who can't perceive color differences can still understand and interact with content effectively.
Why:
Relying solely on color can create barriers for many users. For instance, color blind users might miss critical information in charts or forms if it's only indicated through color changes. Ensuring information is accessible without color reliance makes content more inclusive.
Examples and Scenarios:
- Forms and Instructions: In a form, if required fields are only indicated by color, add a symbol or text label like an asterisk (*) along with a legend.
- Links Within Text: Instead of only changing the color of links in a text, also underline them or differentiate them with a different font style.
- Charts and Graphs: Use patterns, labels, or shapes in addition to color to differentiate segments in graphs or charts.
How to Comply:
- Websites: Use text labels or icons in addition to color coding. CSS can be used to add non-color indicators programmatically.
- Mobile Apps: Ensure interactive elements and information are distinguishable without relying solely on color.
- Software Applications: Implement additional visual cues like symbols, patterns, or text to supplement color-based information.
Exceptions:
- Decorative Use of Color: When color is used purely for aesthetic purposes and does not convey essential information, it does not need an alternative.
- Branding: Logos and brand elements that use specific colors are not required to have non-color alternatives.