48 lines
2.1 KiB
Markdown
48 lines
2.1 KiB
Markdown
[Back to 1 Perceivable index](index.html)
|
|
|
|
# 1.4.1 Use of Color
|
|
|
|
- Level: A
|
|
- Guideline: 1.4 Distinguishable
|
|
- Principle: 1 Perceivable
|
|
|
|
## What it is
|
|
|
|
Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
|
|
|
|
## How to test
|
|
|
|
- Check: Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
|
|
- Use the sufficient techniques below as acceptable methods when applicable.
|
|
- Confirm none of the common failures apply.
|
|
|
|
## Sufficient techniques (W3C)
|
|
|
|
- G14: Ensuring that information conveyed by color differences is also available in text
|
|
- G205: Including a text cue for colored form control labels
|
|
- G182: Ensuring that additional visual cues are available when text color differences are used to convey information
|
|
- G183: Using a contrast ratio of 3:1 with surrounding text and providing additional visual cues on hover for links or controls where color alone is used to identify them
|
|
- G111: Using color and pattern
|
|
|
|
## Advisory techniques (W3C)
|
|
|
|
- C15: Using CSS to change the presentation of a user interface component when it receives focus
|
|
|
|
## Common failures (W3C)
|
|
|
|
- F13: Failure of Success Criterion 1.1.1 and 1.4.1 due to having a text alternative that does not include information that is conveyed by color differences in the image
|
|
- F73: Failure of Success Criterion 1.4.1 due to creating links that are not visually evident without color vision
|
|
- F81: Failure of Success Criterion 1.4.1 due to identifying required or error fields using color differences only
|
|
|
|
## Notes
|
|
|
|
- Note: This success criterion addresses color perception specifically. Other forms of perception are covered in Guideline 1.3 including programmatic access to color and other visual presentation coding.
|
|
|
|
## Resources
|
|
|
|
- WCAG 2.2 SC: https://www.w3.org/TR/WCAG22/#use-of-color
|
|
- Understanding: https://www.w3.org/WAI/WCAG22/Understanding/use-of-color.html
|
|
- Quick reference: https://www.w3.org/WAI/WCAG22/quickref/?versions=2.2#use-of-color
|
|
|
|
[Back to 1 Perceivable index](index.html)
|