Accessibility - Part 6
Article ID: KB101569
The second W3C Web Content Accessibility Guideline says:
Guideline 2. Don't rely on color alone.
In other words, "Ensure that text and graphics are understandable
when viewed without color."
There are two checkpoints for this guideline:
Checkpoint 2.1: Ensure that all information
conveyed with color is also available without color, for example
from context or markup. [Priority 1]
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. [Priority 2 for images, Priority 3 for text]
For most people, this may affect how you use your fonts and colors -- in
particular, when you use color to highlight a word or phrase. Most
FrontPage users, when highlighting a word or
phrase, will use the font toolbar to change the color... >>
Well, here's a surprising fact: Checkpoint 2.1 tells you NOT to do this!
Why? Here's one reason - if someone is colorblind, he will
have no idea that there is anything special about that word or
phrase. However, many text-to-speech readers won't know that the
word or phrase is important, either, if color is used visually to
highlight a word or phrase. (This means that changing the text size
won't work, either!)
So, how do you make your web site accessible -- yet get your
point across -- AND be visually pleasing as well? We've put together
the "ABC's" of color and accessibility to help you out:
- AVOID using the font toolbar to change the color of
font. If you're using color merely for visual purposes, define
your colors using Cascading Style Sheets. (See
webmonkey.com for some nice starting tutorials.)
- Learn some BASIC HTML CONCEPTS about structure vs.
layout. Learn how to make your web pages "meaningful" within the
code instead of with external font colors and font sizes. We'll
cover this more next month, but if you're ready to get going,
here's a brief summary of
structure vs. presentation. To learn more HTML, we have a
series of tutorials
that you may learn from, and you may also want
to check out
webmonkey.com,
lissaexplains.com, or
w3schools.com.
- CONSIDER text-to-speech readers and people who may be
color blind. Avoid putting a font color over a background color,
or worse, a background image, that may be difficult to read (even
people with perfect vision will thank you for that one!), or that
may not have enough contrast.
Meeting this accessibility guideline may be challenging to most.
After all, when we are designing a web page, we usually think first
about what the page will look like. Next month we'll begin
looking at Guideline 3, which covers structure and layout.
Next: What's Up With Markup?
Contributors
Corrie Haffly:
Corrie is the author of the Accessibility series, which appeared
in the PixelMill Newsletter. Though you may not know her name,
Corrie has become one of the top experts in the FrontPage Template
industry. You may know her work better under the name John Galt's
Templates. See Corrie's stunning products today!
John Galt's Templates
John Galt's Tools, PixelMill Newsletter, Volume 2 - Issue 11 : 11/01/2002
Back to top
Was this helpful?
Please rate this article:
Email address: (not required)
(Please provide your email address if you would like PixelMill support to follow-up with you about your comment. You're email address is NOT REQUIRED to submit a comment.)
Comments: (How can we improve this article?)
Clicking "Submit" will not clear this page.
link to this page:
http://www.pixelmill.com/support/al0/kb101569.htm
permalink to this article:
http://www.pixelmill.com/support/kb101569.htm
Back to top