Accessibility Tools for Quality Assurance: Color Contrast

Accessibility testing tools are great for quality assurance (QA), even when the website doesn’t have to be accessible. For example, color contrast is a very subjective thing. It depends on technical factors like the quality and settings of the screen, environmental factors like glaring sunlight, and the physical abilities of the person viewing it. It’s literally subjective in the eye of the designer.

In contrast, color contrast analyzers use algorithms from the Web Content Accessibility Guidelines (WCAG) to obtain verifiable, objective results for luminosity, brightness and contrast. Those results give us an impression how fore- and background colors are perceivable by other people.

An example

Visiting the iTunes store we can say subjectively that the light gray text on a dark gray background is somehow hard to read. It’s straining, and possibly that’s not only due to the small font size:

Screenshot iTunes Store Top Movies Section

If we check it with a color contrast analyzer, we get results like these:

Screenshot Colour Contrast Analyser

The luminosity contrast ratio is sufficient with 5.37, the difference in brightness only just fails with 116 (125 being the lower limit), and the difference in color is insufficient with a result of 348 (the lower limit is 500).

So it’s not us getting old — the color values are indeed poorly chosen!

Downloads and links

There are various tools to test color contrast:

As web application:

One Response to ‘Accessibility Tools for Quality Assurance: Color Contrast’

  1. Robyn

    I think that using colour contrast for quality assurance is a great idea. As an accessibility specialist I use the vision Australia tool. I have low vision which is very colour contrast sensitive. I can therefore vouch for the value of such tools, which generally coincide with my personal judgement about what works and what doesn’t, and also for the benefits of paying attention to good colour contrast. My often frustrating experience with poor colour contrast is recorded on my accessibility blog.