Use of color
Do not use color as the only means to convey information. For example, required fields are red. Persons with a color deficiency may not be able to distinguish colors. You may mark required fields in red as long as another indicator, like an asterisks “*” is also present.
In a real world example, students are shown three beakers and told each beaker has a different chemical. Each chemical is a slightly different color: clear, pale yellow and pale pink. For someone with a color deficiency, they may all appear to be the same color. In some cases, picking wrong could have severe consequences. An acceptable alternative for this example would be to clearly label each beaker with a symbol or marker as an additional indicator.
Contrast ratios
An important aspect of color on the Web is sufficient contrast between foreground (text or graphics) and the background.
The visual presentation of text and images of text should have a contrast ratio of at least 4.5:1, except for the following: (Level AA)
- Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1.
- Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
- Logotypes: Text that is part of a logo or brand name has no minimum contrast requirement. Care should be taken, however, when designing logos for use on Texas A&M websites and when placing logos on various backgrounds.
Contrast analyzers and tools
To determine contrast ratios, you can use the follow testing tools: