Did I provide a text alternative for color-coded elements?


Ensure that nothing is identified by color alone

Why this matters

People with Low Vision or Color Vision Deficiency (Colorblindness) may not be able to differentiate between colors. People with Blindness or Deafblindness can’t see the colors at all.

The page must provide these users the ability to identify elements using text. To ensure understanding for all, the text must be programmatically related to the colored element.

How to implement

UX Designer

Review Using color.


Ensure that the text alternative is programmatically tied to the colored value. This may be done by putting the text in the same element or container. There may be other techniques as well.

How to test

Use a screen reader to listen to the page. Ensure all values and information using color on the page can be identified by the screen reader in text.