WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Color Contrast Formula

for

From: Terence de Giere
Date: Mar 17, 2005 9:40AM

Tim Harshbarger wrote:

Would someone be willing to explain the color contrast formulae
mentioned in this document?

http://www.w3.org/TR/AERT#color-contra

Tim --

For the not so greatly mathematically inclined there is a nifty tool
that performs these calculations with visual output that might be more
useful for graphic designers. This tool, the Colour Contrast Analyser,
also incorporates the implementation of the Brettel algorithm used in
the Vischeck color blindness simulation software so it can check for
color contrast differences with Protanopia, Deuteranopia, and
Tritanopia, with a visual output of the results. I found the results
rather surprising, as what works for a normal vision user may fail with
color blindness. Many designers might find the resulting color palette
too narrow to suit their sensibilities.

The tool may be found at
http://www.nils.org.au/ais/web/resources/contrast_analyser/index.html

There was some research done at a Texas university in 1997 that tested
various fonts of various styles, with various colors and backgrounds,
and the results (with normal users I presume) indicated that readability
of fonts was not always what was expected when just considering
contrast. The conclusion of the research was: "In general these results
suggest that there is no one foreground/background combination, font, or
word style which leads to the fastest RT (i.e. best readability), but
rather a designer must consider how each variable affects the other(s).

http://hubel.sfasu.edu/research/AHNCUR.html
http://hubel.sfasu.edu/research/reslvs.html

This interaction might explain why a font and background combination
that passes the contrast test might still be difficult to read. The
Colour Contrast Analyser also allows you to change the font. A very
useful tool for scoping out an accessible design.

Another factor in readability might be the difference in display between
a Cathode Ray Tube (CRT) video monitor and the new Liquid Crystal
Display (LCD) monitors. The flaring effect from the electron guns in
CRTs makes smaller text rather fuzzy. LCDs now have very hight contrast
and provide very clear text when used at their design resolution. But
many users I note often set LCDs to a lower than optimum resolution to
get type to show larger (for example, 800x600 pixels on a 1280x1024
pixel display), and when this is done, the text is far less crisp, in
some ways the opposite of what happens when the display resolution is
lowered on a CRT.

Terence de Giere
<EMAIL REMOVED>