When information is conveyed by color, the color can be programmatically determined or the information is also conveyed through another means that does not depend on the user's ability to differentiate colors. [I] How to make information presented in color available through context or markup. (Informative)
programmatically determined means that the specific value can be determined in a standard, machine or software readable form.
Task:
When color is used to convey information, the same information should be available in a form that does not depend on the ability to perceive color.
Color is an important asset in Web design, enhancing usability and aesthetic appeal. However, some users have difficulty perceiving color. People with partial sight often experience limited color vision, and many older users do not see color well. In addition, people using text-only and monochrome displays will be unable to access information that is presented only in color. The solution is to include the information in the source document while setting presentation properties in a style sheet.
Example 1. A form has both required and optional fields. Required items are marked with an asterisk and shown in red. The asterisk is included in the label text and the color is specified in the style sheet.
Example 2. An examination. Students view an SVG image of a chemical compound and identify the chemical elements present based on the colors used in the diagram. The text alternatives associated with each element name the color of the element and indicate the element's position in the diagram. Students who cannot perceive color have the same information about the compound as their classmates. (This technique also satisfies Guideline 1.1 Level 1.)
CSS Techniques