Just Search Labs Just Search Research and Development

Accessibility need not be considered as something of an addition to your website. Many of the changes made to improve accessibility will have benefits in terms of usability and search engine optimisation.

What is accessibility?

Accessibility is the process of making your website friendly to people with a disability. Users may be visually imparied, have poor motor control or may be hard of hearing. Web designers should take accessibility into account as part of the  Disability Discrimination Act.

• 2.2 (p7): “The Disability Discrimination Act makes it unlawful for a service provider to discriminate against a disabled person by refusing to provide any service which it provides to members of the public.”
• 4.7 (p39): “From 1st October 1999 a service provider has to take reasonable steps to change a practice which makes it unreasonably difficult for disabled people to make use of its services.”
• 2.13 – 2.17 (p11-13): “What services are affected by the Disability Discrimination Act? An airline company provides a flight reservation and booking service to the public on its website. This is a provision of a service and is subject to the act.”
• 5.23 (p71): “For people with visual impairments, the range of auxiliary aids or services which it might be reasonable to provide to ensure that services are accessible might include … accessible websites.”
• 5.26 (p68): “For people with hearing disabilities, the range of auxiliary aids or services which it might be reasonable to provide to ensure that services are accessible might include … accessible websites.”

Furthermore, if you are turning away visitors because they cannot access your website then you are reducing your target audience. So what can you do to improve the accessibility of  your website?

How can my Site be Improved?

Content

Use high-contrasting colours for text and background to make the site easier to read for the visually impaired. Avoid difficult to read fonts. San-serif fonts are the most easy to read on screen such as Verdana or Arial.

Document-Structure: use headings and sub-headings to break the page-up into easily readable sections separate the content into paragraphs. Do not use justification on long sections of text but stick with left-aligned text. The jagged right-hand edge of the text guides the eye to the next line making the paragraph easier to scan.

Use lists and blockquotes where appropriate.

Use plain-English rather than sententious, circumlocutory, jargon-filled sentences like this one.

Check spelling and proof-read content to see that it make sense and reads well.

Images

Use the alt attribute and also the title attribute in images. The text in the alt tag is displayed when the image cannot be displayed. The title tag text is displayed when the mouse is moved over the image and can be used to offer further explanation or like a tool tip. Especially useful to explain icons.

The additional text is also useful for SEO as search engines cannot understand what information an image contains. The emphasis should be as an aid to users, however and should not be stuffed with keywords. Further description of the image can be added using the underused longdesc attribute which has a URI where a long description of the image can be found. Probably overkill for most situations but perhaps for describing a graph or chart it might be useful.

Don’t use high-contrast background images.

Video

Transcripts of video or audio information are good idea to help people that are hard of hearing. The SEO benefit of this is it creates more text content. In addition for people  without a sound card, for example people at work with low-spec PCs it is also useful.

Access-keys

Some web-users may not have the coordination to control a mouse but may be able to press keys. The UK standard guidelines for access keys for commonly occurring pages are as follows:

S – Skip navigation

1 – Home page

2 – What’s new

3 – Site map

4 – Search

5 – Frequently Asked Questions (FAQ)

6 – Help

7 – Complaints procedure

8 – Terms and conditions

9 – Feedback form

0 – Accesskey details

(Skip navigation – prevents screen readers from reading the navigation text.)

It is not supported by all browsers but most modern browsers such as IE 7, Firefox support this attribute.

<a href=”sitemap.htm” accesskey=”s” title=”Sitemap. Accesskey:3”>Sitemap</a>

Links

Use anchor text which is meaningful. Avoid linking using ‘click here’. The SEO benefit is that the anchor text can include key-phrases. Make use of different colours for visited links as well as the active link to show users the last link they visited and the links they have visited.

Design

Use CSS to create layout and avoid the use of tables for anything other than tabulated data. Use colours that work well together to make the site easier to read. Some visitors suffer from colour-blindness, which makes it difficult for them to distinguish between certain colours, for example red and green. If these colours are used a indicators, other visual cues should also be provided.

Standards Compliance

Most web browsers support standard compliant code and this is the safest way to ensure that your code will be displayed as you intended. Internet explorer 6 is the only exception to this which still has a fairly large base of users.  Conditional CSS can be used to provide additional CSS for this browser.

CSS and (X)HTML can be validated using the W3C valuators. It is a bit of a pain at first but once you get used to solving the main problems it can become second-nature to your coding.

Flash and Bleeding-Edge Technologies

Many computers used by disabled people will not be using the latest technology because they are provided by public institutions or do not have the level of technical support to provide the latest thing. Provide alternative content if plug-ins are not available. Swfobject is a JavaScript based, standards compliant way of inserting Flash which returns alternative content such as text or an image.

Navigation and Search

Use conventional placement of navigation on the left, a search facility should be made available on every page and placed in the top-left hand corner with a clearly labelled search button. For large sites bread crumb menus may be a useful addition.

Conclusion

Accessibility is an increasingly important part of web design and it does not have to be something which is considered separately from search engine optimisation or usability. There are many things that can be done to improve your site which need not take a lot of time and will provide benefit to your visitors both able bodied or not and hopefully will increase your position in the search engine results page.

Sir Pumpkin Longshanks
Programmer, Research and Development