Standard 2 Examples
To see the code for these examples, click on your browser's "View" menu and select "Page Source."
Incorrect
In this example, two mistakes are made. First, the colors chosen are red and green, and represent the colors most commonly confused among those affected by colorblindness. Second, no cue other than color is offered to help the screen reader user discern which flights are cancelled.
Flight Schedule
The flights listed below in red have been cancelled. The flights green are departing on time.
Delta 1342
United 320
American Airlines 787
Southwest 2390
Correct: Use something other than color
In the example below, an asterisk has been added. A screen reader will speak the word "asterisk", and because the introductory paragraph has alerted the user that the asterisk is used to indicate cancelled flights, the meaning is immediately apparent.
Flight Schedule
The flights listed below that have been cancelled are indicated with an asterisk (*) and in RED. The flights green are departing on time.
Delta 1342*
United 320
American Airlines 787*
Southwest 2390
Using Styles to change colors:
-
To change the text color of one paragraph only:
The text in this paragraph will appear in a different color from the rest of the page.
-
To change the background color of a phrase within a paragraph:
For this example, let's assume that your text color has been set to navy blue in the page's governing style sheet. There's an instructional sentence that you want to set in bold text, and you also want to give that sentence a yellow background so that it will really stand out: SEND YOUR PAYMENT IN TODAY! The rest of the paragraph will revert to its original format.