design, build, test and consultancy

There is a vast amount of information and advice available about web accessibility, and it can be overwhelming so this is my take on the essentials that you need to know. This is only an introduction and not meant to be comprehensive.

What is Web Accessibility

In a nutshell it is a means of making websites available and usable by people across a range of disabilities including:

• Visual impairment and blindness
• Hearing impairment and deafness
• Learning difficulties
• Cognitive (process of thought) difficulties
• Physical difficulties e.g. inability to use a mouse
• Photosensitive epilepsy

At first sight some of these may appear insurmountable e.g. how does a blind person read a website? Some of them do conflict, for example the right colour combinations for someone with a form of colour blindness could make a website inaccessible to someone with a form of dyslexia. There are no perfect answers but the fact is that the web as a whole is woefully inaccessible and with not too much work could be vastly improved.

How Can a Website be Made Accessible

The first thing I would say is that as with most things in life, the earlier accessibility is considered in the design of a website, the easier it is to include. Accessibility can be successfully bolted on afterwards but this usually involves more work (and thus cost) and doesn’t necessarily lead to an ongoing culture of accessibility (e.g. for content managed sites, much of the accessibility is down to how individual authors and editors use the content management system).
The simplest and most effective things you can do to ensure that a website is as accessible as possible are:

• Ensure that anything which isn’t text has a text equivalent (e.g. an image of a Company brochure page should be accompanied by text reflecting the contents of that image).
• Any video or audio needs to have alternatives e.g. transcriptions, captions
• Anything that you can do on the site with a mouse should also be achievable just using a keyboard
• Don’t use small text or badly contrasting text/background combinations
• Avoid anything that blinks or flashes rapidly
• Keep the number of links on a page to a sensible amount (including navigation links)
• Structure pages properly with headings, lists etc. (this also helps with Search Engine Optimisation)

Further Reading

As mentioned in the introduction there is a great deal of information available. I would recommend the official Web Content Accessibility Guidelines (WCAG 2.0) as a good starting point.

Please Comment

Please add your comments to this post, tell me things I have missed, ask me for more detail, give me your views.

You can drive if you are blind, although your ability to drive safely will vary depending on a number of factors including whether you have any assistance (and bearing in mind that dogs no longer need a licence in the UK). You can even do so legally if not on a public road (in the UK at least). Living in Birmingham, I recall an incident a few years back when a completely blind guy was caught speeding on a public road with a passenger shouting driving instructions to him. The funny part was that he was then banned from driving for some years and had to take an extended driving test.

The second question is more sensible, although it never ceases to amaze me that the majority of people assume that a blind person would have no means of reading a web page.

What if You Can’t See the Page?

Braille displays are available and used but the vast majority of blind web users read web pages by listening to them. Modern operating systems include voice synthesis software to allow text on a screen to be read out but this software is usually somewhat limited and isn’t particularly suitable for the content and structure of web pages. Screenreader software such as JAWS, Window-Eyes or NVDA are more commonly used as they provide a means of skimming through content and links and support more of the user interface components of the web (for example forms).

Web pages need to be well structured to allow effective reading by screenreader software. The most important things to consider are:

1. Any text contained within an image is not accessible to the screenreader
2. Too many links on a page can make navigation and orientation very difficult
3. The visual appearance of text e.g. colour, font-size, bold, italic, position, is not accessible through screenreader software

Some Simple Tips

All is not lost though, some simple techniques can fix these issues:

1. Text within an image can be described using the alt attribute (or longdesc if the description is more detailed than a short phrase or sentence). If the text is repeated elsewhere on the page then it doesn’t even need to be directly associated with the image. In the case of a more complex image (for example a graph), it may be more appropriate to use table markup to give the right semantic structure to the information.
2. Too many links is too many links, but providing they are grouped logically, and have meaningful text, and have skip links at the beginning of groups to allow quick navigation, they can be much more accessible.
3. Visual appearance should be separate from semantic structure. If a piece of text is meant to be a heading then it should be marked up with the appropriate level of HTML heading. If a particular word needs emphasising then the HTML emphasis or strong tags should be used. If the colour of some text is important (for example in the key to a graph), then the link between the colour and its meaning has to be conveyed in another way too (in this case perhaps through the graph data being within an HTML data table).

Trivia

Did you know that the Driver Vehicle Licensing Agency can supply a braille version of the driving licence application form. Good to know that public money is being spent wisely.