Never Depend on Color Alone

Contact Us or call 1-877-932-8228
Never Depend on Color Alone

Never Depend on Color Alone

If you present information using only color, a person who cannot distinguish color will not have access to that information.

The Section 508 standard concerning this problem states:

Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup.

Color is useful in conveying important information. But when you use only color, by saying for example, "Please click the green button," you are excluding those people in your audience who cannot decipher color alone. Instead, you should put text (e.g., "OK") on the button and say, "Please click the green OK button."

An article on how color blindness affects vision included this example. Imagine that you were faced with this image and the instructions that follow it: Three buttons, green, yellow, red

Click the Green button to continue, the Yellow button if you need help, or the Red button if you want to quit.

Looks easy, right? But what if you instead saw one of the following: All three buttons appear shades of yellow All three buttons appear shades of pink The first button is blue; the others are shades of pink

These are actual examples of how various forms of color blindness affect vision.

Here is an example of a fairly common mistake; an actual customer survey form modified from one on a major commercial site that indicates required fields in red. A form using color only

The form is easily modified to be accessible by adding a second indication of a required field. In this case, asterisks are used. The same form with additional indication

Also see: Screen shot of with red required fields

When we requested permission to use the screen shot, made a simple change so that the information is conveyed both in color and with text. corrected

When color is used to convey important information, also use context and markup to convey the same information. For example, "Books that are available appear in green and in bold font."

  • Revised 508 standards (under consideration) will require "presentation of text (and images of text) in electronic documents must have a default contrast ratio of at least 5:1, except if the text is pure decoration. Large-scale text (or images of large-scale text) can allow a contrast ratio of at least 3:1
  • Choose highly contrasting colors for foreground and background