HTML and CSS Reference
Making web sites accessible requires applying human intelligence to recognize and then fix problems such as
these. As usual, tools are available that can help. The W3C HTML validator discussed in Chapter 2 notes many
accessibility problems as well as pure well-formedness and validity errors. Other tools are available that check
more deeply for accessibility. The W3C maintains a list of many such tools at
www.w3c.org/WAI/ER/tools/complete/ . These tools are helpful, but they are relatively stupid. They may find
problems a validator won't, such as green text on a red background, and they may suspect that certain tables
are likely being used for layout. However, they don't know this, and there are many problems they will never
find. You must spend some time looking at the site with accessibility in mind.
Accessibility is ultimately about people, not about following a fixed set of rules. If your site is open and
accessible to all users, you've done your job, even if you've violated a rule here or there. If your site is
confusing and hard to use, you haven't, even if it validates and passes all the automated checks. To really tell
how well you've succeeded, you have to do user testing. Observe real people navigating your site. Watching
even a single user will reveal problems you didn't know you had. Time and budget permitting, you should
observe many people, and include users with different skill sets and abilities. Watching a senior citizen navigate
your site will tell you very different things than watching a teenager. Watching a blind user navigate with a
screen reader will reveal issues you won't encounter with a sighted user. Try to test as many different classes of
users as you can. Even if your budget does not permit formal user testing, do some informal testing by
recruiting your friends, family, and coworkers for simple tests.
Sometimes even seeing the difficulties other users experience isn't enough. We have to experience them for
ourselves. If you do not have easy access to blind users, you can simulate their experience. First, try to surf
your site through the text mode browser Lynx. Second, try using a voice browser. Turn off your monitor and
surf your own site. If you use a Mac, VoiceOver is built in (though it does take some time to get used to).
However, most blind users prefer the more powerful payware Windows program, JAWS. Either one will give you
a decent approximation of how a blind user views your site. Next, turn the monitor back on, disconnect the
mouse and the keyboard, and try to navigate with voice recognition. This will help to teach you how some
physically disabled people will approach the site and where their pain points are likely to be.
Web-site accessibility is still quite poor, and in 2008 there's no excuse for that. Most users are inconvenienced,
some critically so. However, there are some simple changes and improvements you can make to the design of
your sites to improve matters.
Convert Images to Text
Replace any images that contain text with the text they contain, along with the markup and CSS rules that
mimic the styling.
<img src="logo.gif" width="200" height="200"
alt="Welcome to TIC!" />
<h1 style="font-family: Verdana; font-size: 18pt;
font-weight: bold">Welcome to TIC!</h1>
Visually impaired users can't see images, but they can hear text with a screen reader or feel it with a Braille
printer. An alt attribute helps, but it is not a substitute for real, marked-up text.
Converting images to text dramatically improves search engine optimization. Search engines pay a lot of
attention to text and relatively little to images. They pay special attention to text that appears early in the