Accessibility
I decided to see if this blog could pass some basic accessibility tests. Since 1998, Federal Agencies have been required to adhere to certain web accessibility guidelines, called Section 508. Now, I’m not a Federal employee, but I do get funding from the NSF, and so I figured I ought to at least take a stab at it.
There’s a very good tutorial on building web sites which meet the guidelines. Another invaluable resource is Mark Pilgrim’s Dive Into Accessibility site, which covers almost all of the bases for Section 508 Accessibility.
Given Mark’s fame, it’s not surprising that his recommendations (and hence most of the things required to pass the Section 508 Accessibility tests) are already incorporated into the default MT templates.
My own previous cleanup had cleared up most of the remaining things which would cause accessibility problems. I really only had three classes of problems to fix.
- I had to ensure that all my images had real
alt
attributes.alt=""
may pass the W3C Validator, but it still isn’t accessible. MT’s default Search Template does not define
<label>
s for each of the form elements. One needs to replace things like<input type="checkbox" name="CaseSearch" /> Match case
with
<input type="checkbox" id="CaseSearch" name="CaseSearch" /> <label for="CaseSearch">Match case</label>
- You must include
scope
attributes for table headers (that’s not the only accessible solution, but it’s the easiest). Each column header should say<th scope="col">...</th>
and each row header should say<th scope="row">...</th>
Having read through the above-cited tutorials and made the requisite changes in my templates, it was time to run my pages past Bobby and Cynthia. Both require a certain amount of “manual” checking, over and above the automated tests, but in good conscience I think I can now display some new badges in my sidebar. [Well, almost good conscience. I doubt there are any screen readers out there that grock MathML. Even so, that’s still more accessible than using GIFs for equations.]
Update (8/13/2003): One point not flagged by Bobby or Cynthia was the need to explicitly indicate any use of foreign language words or phrases by using the xml:lang=""
attribute. So, eg, I need to write
<span xml:lang="fr">plus ça change</span>
when I slip in a phrase in French. Screen readers need to know this to pronounce the text appropriately.
Update (8/19/2003): JAWS 4.51 claims to support both <abbr>
and <acronym>
tags. So I am now using them both. The distinction is important because a screenreader should read an acronym but spell out an abbreviation. I’ve also added an aural
stylesheet, not that JAWS gives a hoot about such Standards-based niceties.