Practical Accessible Web Design
Accessible web design is big business, but it mostly involves long complicated standards and politics. As the author of an accessible web browser for blind people, here's my practical list of accessibility guidelines for the real world. Follow these (if you can) and your website is more likely to be useful for blind people and WebbIE users.
- Don't use Java or Flash. It's completely inaccessible.
- Avoid frames and iframes: how does a blind person know if a link has changed a page "over there" when they know only that the link they have just clicked has not caused a new page to appear?
- Put in a skiplinks link at the top of your page, linking to the main content. Do not use CSS
display:noneto hide it: this will stop it appearing to blind users. You can also use CSS to make the main page content appear first in the HTML code, like I do on this page: do View Source in your browser and note that the code for the navigation bar on the top right comes AFTER the body code. HTML gets rendered linearly to blind people, so they get the content first, rather than lists of links.
alttags on images used for links and
alt=""(an alt attribute with the value of an empty string) for almost every other image. Blind people don't care if there is an image there. Don't make them wade through hundreds of image descriptions. Choosing alt tag or attribute content.
- Use the LABEL HTML element to make forms work for blind people. It's very simple, but very important, so here is a guide to using the LABEL element to make forms more accessible.
- Do not use popup windows - they break the back button and confuse the user. You can see there's another window, a blind user just knows they're on a new page - oh, whoops, where is their browser?
- Test it yourself with WebbIE. If you can use it in WebbIE then blind people are more likely to be able to.
Want more (complete) information? Check out the links on WebbIE for web designers.