How to make your website accessible

A website's accessibility is crucial in attracting and retaining disabled and elderly users, who are often overlooked at each stage of design. Many websites are not designed with accessibility specifically in mind and simply 'throw it in' at the end, which isn't ideal.


Juicy Web Design now offers a full accessibility service - available here.


Nowadays, there are large numbers of people with disabilities using the World Wide Web. If your website is not accessible to them they will simply click back and go to the next website on their search engine's results screen. Attracting visitors in such a competitive technology is hard enough as it is, so losing some of these immediately to poor site design is lazy and a generally bad practise.

Here are some tips to making your website accessible:

Specify the language used on your page.
Screen readers, used by disabled users to browse the Internet require this information inorder to properly analyse and feeback a page's content to it's user.
example: <html lang="en">

Use descriptive page titles
These tags are used by disabled users through screen readers and by able users alike as a method of instantly distinguishing between pages that they have visited. Helpful labelling will aid their progression forwards and backwards through any website.

Colour
Many users (up to 8%) suffer some kind of colour blindness. Bolding and underlining are a good way of ensuring that all users will be able to see key content and navigational links easily.

Add links sensibly
Text chosen as link text should be informative and relevant. If users view your website on a text-only browser and are subjected to hundereds of "see more" links they will be very confused!

Accesskeys
Keyboard shortcuts can be set up to pages on your site. These are also supported by both screen readers and visual browsers. By using ALT+ a number, followed by Enter, users can navigate to selected pages.
example: <a href="index.htm" title="Homepage" accesskey="1">Home</a>.

Table Elements
Table summaries are used solely for the benefit of screen readers, in a similar way to Alt tags for images.
example: <table summary="A summary of the table">

Long Description
Where images require detailed explanations in ALT tags it maybe sensible to use long description attributes aswell, so that the extensive content can be held in a separate file.

Fonts
Many disabled users will take advantage of Internet Explorer's option of increasing text size. Please note that any text included on imagery or sometimes set rigidly by a css may not be adjusted by this option.

Only add Alt Tags where necessary
Use a blank alt: (alt="") for things like spacers where understanding what the missing image is not necessary.


There are many more ways to make your website accessible. The only way to be sure that you've covered them all is to call on the expertise of Juicy Web Design - click here for more information.

13 June 2006
Juicy Web Design offering Web Design services to Birmingham company High Tide Productions. I expect to carry out several web projects for this client over the coming months.
Read more news articles

I am providing web consultancy and design services to Oxley Conservatory.