Element relies on color alone to convey meaning
What is the problem?
If someone has Color Vision Deficiency (CVD), commonly called “Color Blind”, they may not be able to distinguish between colors. Most screen readers do not announce colors, resulting in blind or low vision users being unable to detect the use of color. To insure your content is understandable, don’t rely on color alone.
Status indicators uses color alone
In this example a table explains what the air quality colors mean. Those that cannot see the colors don’t know what index each meaning is associate with.
See the Pen 1.4.4 - meaning through color - negative example by Thomas Logan (@EqualEntry) on CodePen.
Add text
By adding additional textual based information to name the air quality index levels, explain what color is being used for each, and providing a numerical range, the table becomes more understandable.
See the Pen 1.4.4 - meaning through color - positive example by Thomas Logan (@EqualEntry) on CodePen.
G14: Ensuring that information conveyed by color differences is also available in text
Required fields are only identified using color
Add the text “(required)” to the control labels
G205: Including a text cue for colored form control labels
Link text color is used as the only means to explain intranet vs extranet destinations
Add a icon with a text alternative to explain intranet vs extranet
Graphical legend only shows color
Add shapes to line chart
