Friday, 28 September 2007

Web accessibility testing with Thunder screen reader

Most web designers know that well-structured and valid XHTML with CSS makes a big difference for blind and visually-impaired people surfing the web. As developers we can check our code with things like an accessibility validator, however I've never actually used a screen reader to find out how my web pages sound for a blind person. A search turned up a couple of interesting videos on YouTube about a free screen reader called Thunder which I downloaded and tried out.

As a visually unimpaired person it's a very interesting experience to surf the web using just the keyboard with your monitor switched off. Considering most of us strive to write well-formed code anyway testing it in something like Thunder takes little effort and ensures your site is as accessible as possible. For example I quickly noticed the benefit of placing your content before navigation or adding a "skip to main content" link to avoid hearing a list of navigation links at the top of every page. I also noticed the importance of label tags on forms to keep the input field correctly associated with the label.

Often accessibility is regarded as a secondary consideration by busy designers, but for a person with no sight the internet is a life changing tool allowing them to use email, IM, online shopping and banking amongst many other things. I think putting yourself in someone else's shoes with Thunder is much more involving than reading a list of do's and don'ts and quickly gives you a feel for what the real accessibility issues are.

As a side note I thought it somewhat ironic that the Thunder website employs an old-school table layout, generally regarded as a big no-no for accessibility. The website creator also displays the W3C logo claiming Level A Conformance to Web Content Accessibility Guidelines 1.0. However their site also uses a table layout which doesn't meet WCA Guideline 3: Use markup and style sheets and do so properly.

1 comment:

jowdjbrown said...

The first mistake begins with a typical business web design that is designed for us and not our web market. How can a web site that's not designed for our market engage our market? The answer is to learn more about our market by using psycho-graphic tools. websites