W3C Checkpoint 2.2 - 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.
Two colors provide good color visibility if the brightness difference and the color difference between the two colors are greater than a set range.
The range for color brightness difference is 125. The range for color difference is 500.
Examples:
Usability and Accessibility should come before validation.
Don't do it!
Individuals using screen readers can look at a list of all the links on a page out of context. So if they keep hearing “click here” over and over again it makes no sense to them.
Another good reason is that your not getting added Google juice as they say by making the link text relevant to the link.
Poor example
Click here to review the Acme TNT companies annual report.
Good example
Please review the Acme TNT companies annual report.
Use headers - H1, H2, H3, H4, H5, and H6.
This will allow people using screen readers to skip around to the important parts of the page using key combinations.
Where ever you have “hover” (a:hover) you should also have “focus” (a:focus).
#nav a {
background: #ACC7FF;
text-decoration: none;
}
#nav a:hover, #nav a:focus {
background: #BEFF9E;
text-decoration: underline;
}
Free screen reader extension for Firefox that acts like a screen reader and was created by Charles L. Chen.
When running accessibility tests make sure to use more than one validator, since not all errors or issues will be found by all of them.
Usability and Accessibility should come before validation.
Presentation
Accessibility Resources