WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: What is good contrast? How do you know?

for

Number of posts in this thread: 3 (In chronological order)

From: Mark Magennis
Date: Wed, Jun 05 2002 7:33AM
Subject: What is good contrast? How do you know?
No previous message | Next message →

I know that it's important to have good contrast between text and background
or between colours in an image. But how can you tell whether contrast is
go

From: philip steven lanier
Date: Wed, Jun 05 2002 8:30AM
Subject: Re: What is good contrast? How do you know?
← Previous message | Next message →


For individuals who have normal 20/20 vision, the general rule of thumb is
that the two shades should differ by 70% to have good readability. 70%
difference means the difference in absolute percentages. So you could put
100% black on 30% gray. Or 10% gray (near white) on 80% gray.

With regard to color, it is best to differentiate based on luminance
rather than hue or saturation, as the human perceptual system can only
differentiate between about 200 colors (hues), 20 saturations, but can
distinguish around 500 different shades (lightnesses).

Also, keep in mind that users may have varying degrees of colorblindness,
and some may have limited or no sight. So always provide a text
equivalent of every non-text element! If you must differentiate based on
color in an image, there are schemes that work well for readers who are
colorblind. A very gross generalization to remember that for the majority
of people who are colorblind, reds and greens will appear yellowish. Like
I said, this is a very gross generalizatoin... for a much more in-depth
discussion, check out www.vischeck.com.

Hope this helps!

Philip Lanier,
University of Washington

P.S. Much of the info here was taken from Colin Ware's book "Information
Visualization: Perception for Design"




On Wed, 5 Jun 2002, Mark Magennis wrote:

> I know that it's important to have good contrast between text and background
> or between colours in an image. But how can you tell whether contrast is
> good and what is good enough?
>
> Are there any tools that can be used and that do a decent job?
> Are there any calculations you can make with the colour values?
>
> Thanks, Mark
>


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/


From: Holly Marie
Date: Wed, Jun 05 2002 9:23AM
Subject: Re: What is good contrast? How do you know?
← Previous message | No next message


----- Original Message -----
From: "Mark Magennis" < = EMAIL ADDRESS REMOVED = >

| I know that it's important to have good contrast between text and
background
| or between colours in an image. But how can you tell whether contrast
is
| good and what is good enough?
|
| Are there any tools that can be used and that do a decent job?
| Are there any calculations you can make with the colour values?


I have heard that in a very general way, you can load the web page up
for view with images etc... and go to your own monitor settings and
reset these for Grayscale or non color view.

If you find that neighboring text or colors are very close or hard to
read, chances are it may be a problem with people who have visual
difficulty or color viewing differences.

This is only a quick and not a very scientific check but it will help
eliminate colors like red and green, colors next to grays, browns and
grays that are close, etc... that may be so close in saturation or
intensity, that when viewing they look very close or even identical and
you may not be able to read the text on a page, etc.

Other than that, a download from vischeck or viewing pages or images in
vischeck online is another option. Though its support for CSS based
pages may not be accurate or display the color checks correctly. A way
around that one of course would be to grab a screenshot of such a page
in question and save it as a bmp, jpg, or gif image file, then upload it
into the vischeck from your browse upload feature at that site and view
it in the test online.
The tool to download is java based and that means it should run on any
OS. It also supports a wider variety of color tests, though they online
version may have updated to include some of these. Tools for getting
screenshots can be found on the web by searching for Screen Capture, or
go to http://www.snagit.com which is a very nice tool that can be
modified to capture even a full scrolling page, or areas, windows,
etc... Trial demo is free, and I have used this tool for a long time.
Works well.

holly



----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/