Sometimes when people first learn about Web accessibility they look for quick ways of improving the sites they build. This often leads to misuse or overuse of certain HTML features that are meant to aid accessibility, but when used wrongly have no effect and can actually have the opposite effect by making the page less accessible and less usable.

Many of the commonly misused accessibility features are HTML attributes. It is my feeling that they get misused either by developers who mean well but don’t quite understand how the attributes help end users, or by developers who add them simply to be able to tick “accessibility” off their to-do list and shut up their manager, client or whoever is pestering them about making the site more accessible.

Here are a few examples of HTML attributes that are often misused or overused:

* The accesskey attribute. A potentially useful attribute, the accesskey attribute creates a keyboard shortcut for a link or form control. However, it is so badly implemented in most browsers that it’s safest to avoid using it. Very few users are aware of it, and with current implementations it can conflict with shortcut keys used for other functions in the browser.

That said, accesskey can be useful to some people if many sites use the same shortcut keys. Many public sector sites use the same shortcut keys since they follow a guideline which states which keys to use for what. It doesn’t solve the user agent problem, but at least it makes the use of accesskey consistent.

It is quite common to see accesskey use go completely overboard though, with just about every link and form control having an accesskey attribute, especially in the administrative interfaces of CMSs and other tools that claim to be accessible.

* The tabindex attribute. Changing the order in which elements receive keyboard focus from the order they appear in the markup can perhaps be useful in some hypothetical cases. I can’t really think of any such cases, but that is not how the tabindex attribute is normally used. Instead it is often used to define the tabbing order of elements that are already in a logical order in the markup. This wouldn’t really be noticed or cause any problems if it weren’t for the fact that elements with a tabindex attribute take precedence over all other elements when using the keyboard to navigate.
A good example is the comment form in a default WordPress installation. The form controls (input fields and submit button) all have tabindex attributes despite already being in a logical order in the source. The effect is that keyboard users will skip straight to the comment form when they start tabbing through the page. Very annoying and completely useless, though probably well-meaning.

* The title attribute. The developers of several CMSs that are popular in my part of the world have apparently learned about the title attribute and that it can be used to clarify the target of a link. So they want to use it for all links that their CMS creates, mindlessly repeating exactly what is already in the actual link text, sometimes with “Link to: ” prepended. That is completely useless and does nothing to improve accessibility. All it does is increase document size.

* The alt attribute. Overly explicit and verbose alt text is a nuisance. One of my favourite examples used to be csn.se, the website for the Swedish National Board of Student Aid. Until a few weeks ago, the site consisted of old-school nested tables and spacer GIFs.
Somebody, probably a well-meaning person, added alt text to the many spacer GIFs and other presentational img elements that were used on the site. So far so good. But unfortunately the alt text should have been empty to indicate that the images were purely decorative. Instead, the text “Typografisk luft” (“Typographical space”) was used for spacer images and “Webbplatsens hörn” (“The website’s corner”) for images whose only purpose is to create rounded corners.
There wasn’t just one or two of them either. On the English About CSN page I could count to no less than 185 spacer GIFs with alt=”Typografisk luft”. Take that, screenreader users! It makes for a superb example when demonstrating what not to do, so in a way it is unfortunate that they have now updated the site to get rid of the spacer GIFs. They do misuse the title attribute though.

In early August this year, Patrick H. Lauke held an excellent presentation where he brings up many of these overused accessibility features. The presentation slides can be downloaded in several formats from Too much accessibility. There is also an audio recording of the presentation, which is really great since you can listen to Patrick talk while going through the slides.

Patrick also brings up several other features that can improve accessibility if used correctly, so I highly recommend that you take the time to go through the entire presentation. You will come away with a much better understanding of why the HTML attributes I mention here can be problematic when used wrong, and how to use them well.

By Roger Johansson (a Swedish web professional specialising in web standards, accessibility, and usability)
December 2007
Article source: http://www.456bereastreet.com/