You are here

Website Accessibility

Website accessibility can sometimes be seen as an afterthought - making tweaks and adjustments to cater for people with visual impairment for example. But accessibility ought to be a fundamental, if communication is about conveying information shouldn't the aim be to enable as many people as possible to access it? Just as the very nature of a website - being available online 24 hours a day, 7 days week - is a benefit for all, good practice in accessible design is not about add-ons for users with a particular disability but about ensuring the site can be enjoyed by the widest possible audience.

Applying print principles online

Traditional guidelines for accessible print communications largely apply online. Issues of font size and contrast affect many more people than those who consider themselves visually impaired. Whilst it is possible to test websites for compliance with guidelines on a technical level this does not ensure a site is necessarily accessible.

Resisting tempation

Being an exciting medium, with a rapid rate of change, designing for the web is awash with temptation. Animation and video clips add dynamism to a page and it is always tempting to add the latest widget. However, there are some important factors to bear in mind:

  • key content may not be accessible to all users if it requires inaccessible technology
  • gimmicky widgets may have limited cross-browser support and may not work at all in older browsers
  • moving images and flashing graphics can be distracting to the point of prompting users to leave the page

Text and images

Text is machine readable. Text embedded in an image becomes part of the image - it is no longer machine readable. So, whilst posting text as an image can be attractive either to use a font or graphic effect which is not available in HTML, or simply to save time by posting an image of an event flyer rather than type in the details, it isn't a good idea. Text based content can be accessed by assistive technologies such as screen-readers and this is relevant to search engines too - they also need to be able to read content. At a more basic level users who may wish to increase the font size to make it more readable might not be able to do so.

Technical accessibility, understanding HTML

Web pages are written in HTML. HTML is a 'mark up' language which describes the structure of a document to a browser. This structure is relevant to the meaning of elements in the document. For example, HTML provides for 7 heading elements - h1, h2 etc - structurally a h1 heading is more important than h2. In a book, therefore, h1 may start a chapter and h2 may be the main heading(s) within each chapter. HTML should not tell the browser about the appearence of an element. This is done by CSS. However, because it is possible using HTML and CSS to define how each heading element appears, there can be a tempation to use an element for its appearence rather than structural relevance. Put simply, using a h3 heading when structurally a h2 should be used. As assistive technology (and search engines) expect the HTML to explain structure and not appearence this inappropriate use of HTML elements for appearence will mean the content is not technically accessible.

Common issues

With the majority of websites now using some form of content management system accessibility issues can be built into the theme or even the system being used. Some common issues are:

  • missing 'alt' attributes for images - the alt attribute provides a short description of an image, it must be present but it can be empty
  • using heading elements for appearence rather than structure
  • incorrect nesting of headings (an implication of the above)
  • links with the same link text pointing to different resources
  • the default style sheet language must be specified when style attributes are used
  • the default scripting language should also be specified (generally Javascript)

Testing for accessibility and validating HTML

There are a variety of tools available that can be used to check whether a site meets accessibility guidelines and has valid HTML - a site can meet accessibility guidlines without necessarily having valid HTML, although valid HTML will reduce pthe potential for accessibility issues and so both go hand in hand.

Tools are also available for checking foreground/background contrasts:

The above resources are examples rather than recommendations, many other tools are available.

For more information about website accessibility: