homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Subscribe and Support WebmasterWorld
Home / Forums Index / WebmasterWorld / Accessibility and Usability
Forum Library, Charter, Moderators: ergophobe

Accessibility and Usability Forum

The significance of colour contrast for accessibility
What is best practice and what choices are available?
Receptional Andy

 9:57 pm on Apr 22, 2008 (gmt 0)

According to the WAI:

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. [Priority 2 for images, Priority 3 for text]
Checkpoint 2.2 [w3.org]

They also suggest an algorithm to determine appropriate colour contrast [w3.org]. There are various implementations of this around the web and within accessibility software. Indeed, most discussion I've found about correct colour contrast seems to stem entirely from those two documents.

Now, if I have a design that does not currently meet these criteria, I can only think of two workable choices:

  • Adjust the colours so they meet the criteria (may be difficult to maintain the integrity of the design)
  • Provide an alternative version with higher colour contrast (The W3C suggest this. I'm somewhat against this on principle, since I prefer one version that is workable for as many people as possible)

Unlike text size where there seem to be a whole host of methods to improve viewing, colour seems to be only easily adjustable to those with user stylesheets. Perhaps there are other mechanisms I'm not aware of.

There are a few other aspects such as text that passes the algo as long as text size is large enough, but I assume that it would be unwise to rely on users resizing fonts for legibility. or is it?

Aside from acccessibility, contrast and legibility are clearly usability concerns too. I've disabled CSS or page colours on many sites in my time ;)

Any comments/thoughts/pointers?



 1:30 pm on Apr 24, 2008 (gmt 0)

I use a stylesheet switcher to address color schemes. Just like the font sizing functionality, you can present different color schemes to your users.


 11:24 pm on Apr 25, 2008 (gmt 0)

This is a thoughtful topic, one few pay a lot of attention to.

If I were in your shoes - now, this is ME - I would tell myself what I thought was great needs improving, my choice of color and contrast is not as good as I thought.

This comes from a background of art throughout my life, which is mostly subjective. One viewer's interpretation is completely different than another's, and often for very different reasons ("I just hate GREEN!")

When I encountered color theory, it allowed me to apply objective rules to my subjective interpretation. It changed everything. Instead of just "knowing" a complimentary scheme works, color theory gave me real numbers to work out mathematically. So when I encountered an image that just didn't work, and I couldn't nail down why, color theory made it as obvious as 2 + 2 = 4.

What's this got to do with WAI? Their data and recommendations are based in real data and research. These numbers are not arbitrary, they give mathematic meaning to your creations.

But they are recommendations, not rules. If a contrast value for a minor aspect of a page is recommended at 500 and I'm coming in at 475, I call it good enough. :-)

So like anything else you learn, listen with a tempered ear. You'll probably find you'll come up with something just as good with a slight tweak for usability.

I assume that it would be unwise to rely on users resizing fonts for legibility. or is it?

Although it's argued ad nauseum, I try to design pages that can be resized to either end of the spectrum without completely blowing up. Sure it looks horrid with body text at ~+24 point, but the layout holds together. IMO allowing users to size fonts is part of the whole idea of accessibility.

Receptional Andy

 9:28 am on Apr 26, 2008 (gmt 0)

Thanks for the replies :)

now, this is ME - I would tell myself what I thought was great needs improving, my choice of color and contrast is not as good as I thought

While I posed a generalised question, I did have a specific design in mind when I wrote it. I think I arrived at the same conclusion as you. Perhaps I was hoping for a compelling alternative when I posted (damn, back to the drawing board!) ;)

Colour theory helped me a lot too, as choosing colours and aesthetic design is really not my forte, so having rules to apply is a good thing. I take the good advice that the W3C's contrast algo is probably another rule that I should factor in by default.

On text-size, my general approach is to avoid changing from browser default sizes unless absolutely necessary. Similarly, underlined links in the default blue genuinely seems to help usability. I'm aware these are not always popular choices with designers!

One relevant point about text-size vs colour contrast I mentioned in the original post was that changing text-size is something built into every modern browser, whereas changing colours and contrast is not. So I guess that puts the responsibility on us to make sure our sites are accomodating.

I sometimes wonder if people with, for example, reasonably bad short-sightedness or a form of colour blindness are in a bit of a 'dead zone' - they are unlikely to want a specific high-contrast version, and they are a large group that is easy to overlook (no pun intended!).

Global Options:
 top home search open messages active posts  

Home / Forums Index / WebmasterWorld / Accessibility and Usability
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved