Accessible website design

Making your website vision impaired (‘VI’) friendly

Accessible website design is a must. Website designers now have a legal obligation under section 21 of the Disability Discrimination Act to make reasonable adjustments to ensure blind and partially sighted people can access your service. Aside from this, it make sense to ensure that all users can access your product or services.

To meet government accessibility requirements, digital services must:

  1. Meet level AA of the Web Content Accessibility Guidelines (WCAG 2.0) as a minimum.
  2. Work on the most used assistive technologies – including screen magnifiers, screen readers and speech recognition tools.
  3. Include people with disabilities in user research.

Making websites V.I. friendly is not straightforward and the reason is not the technology. Vision impairment is an incredibly broad condition meaning that those living with sight loss will access websites in a variety of ways.

For example, somebody with no useful vision accesses websites using a screen reader. There are several alternatives but the one I use is called JAWS. Blind users are unable to use a mouse. This means that they navigate using key stroke combinations on their keyboard. However, someone with limited vision might use a mouse but require a larger font size or user-friendly colour contrasts.

It is a complicated area and getting advice from disabled users focus groups is an effective way of improving your website.

10 tips for a more accessible site design from the European Blind Union

  1. Provide Alt Text for all images, and alternative content for all other media.
  2. Use eternal CSS for styling and layout and HTML for document structure.
  3. Associate table headers with table cells and use tables only for data. Include a table summary.
  4. Provide a skip links option to let a user skip repetitive content or better still, reduce the number of links on a website.
  5. Do not use flash, frames or tables for layout purposes.
  6. Design for device independence. Do not require a mouse and do not require JavaScript to activate links etc.
  7. Use simple language on your website, and specify the language used. If a user clicks on a link, they need to know what they should expect to find. Things like “click here” or unlabelled action buttons are not good from a VI perspective and should be avoided.
  8. Make sure colours and fonts contrast sufficiently and limit the number of colours you use as the more colours use the more difficult the website is to read.
  9. Do not fix a font size on your website. Use percentages or EMs. the ability to manually adjust the font size is a feature worth enabling.
  10. Use a fluid layout, using percentages or EMs for width.