3. Web pages shall be designed to that all information conveyed with color is also available without color. Ensure that foreground and background color combinations provide sufficient contrast when viewed by someone having color deficits or when viewed on a black and white screen. (508:C. W3C: 2.1 Priority 1 & 2.2 Priority 2)
The first
example uses color to highlight the preferred choice for those who can perceive it, and an
ordered list to identify the preferred choice for people who cannot see colors.
Example 1: There are two ways to get things done around here. The second method, also shown in red, is preferred.
- Your way.
- My way.
Don't use color
to convey information unless the information is also clear from the markup and/or text. Without
color, the following example is meaningless. (This example is intentionally colorless to show
the author that if the person visiting their page cannot see color, they will miss the point the
author is trying to make.)
Example 2: There are two ways to get things done around here. The preferred method is shown in red.
- Your way.
- My way.
The first example shows a bit-mapped image containing dark text on a light background, which is good contrast for viewing in almost any circumstance. The second example shows an image with poor choices for foreground and background color. Some people or some devices might not easily interpret the content.
