Designing a website for disabled and elderly users

Last modified on Monday, 22 February 2016

We recently re-built this eCommerce website selling wheelchairs, mobility scooters and stair lifts. As the target group were elderly and disabled people, we had to consider that some users may have poor eyesight and difficulty with hand-eye coordination.

In this post I want to share some of what we learned from this experience. The tips below will help you build for a wider audience possible by making your website available to everyone.

The website usability challenge

Standard website usability requirements are a simple, clean design, an easy and intuitive navigation, and of course a nice responsive design to accommodate the 30-40% of website traffic that now comes form mobile devices such as smartphone and tablet.

There is an ocean of blogs telling you how to simplify design, streamline navigation and cut out unnecessary wording and other noise to make your website more user friendly, so I am not going to go there. Elderly and disabled users can struggle with what we may often see as a simple and user-friendly website. Here are some common problems that web designers may have never even considered:

  • Sufferers of epilepsy may have problems with flashing colours on screen and fast movements such as rollovers and slideshow.
  • People with poor hand-eye coordination struggle to use a mouse with precision.
  • Color blind users may not see the difference between two coloured area of a website
  • Users with poor eyesight and blind internet users will really struggle with a standard website (yet as we shall see later, it is perfectly possible to build a website for blind user).

Tips for building a website for disabled and/or elderly users

1. Use large clickable areas

Much like you would when designing a website for a mobile phone user, ensure that all clickable areas (such as links and popups) are extra large with ample spaces between clickable areas with no overlaps. This will help the users locate the area and make sure they can click it without hitting the wrong link by mistake.

2. Use high contrast colours

Whenever the use of colour to distinguish one area of a page from another is necessary for usability, make sure you use high contrast to allow colour blind and visually impaired users to see the difference.

3. Write clear, practical and to the point content

Ensure your page content is clearly written, simple and straight to the point. Blind and visually impaired users often use screen readers - long waffly content is not helpful.

4. Write your pages for screen readers

Again, as blind and visually impaired users will be using a Screen Reader, here are a few techniques to optimize your page for their Screen Readers:

  • Use image alt tags. Whilst the image alt tag is commonly cited as a SEO tool. It is also used by screen readers to describe what is in an image.
  • Write front loaded paragraphs. This means putting the conclusion at the beginning of the page/ paragraph to allow the user to skip it if they are not interested in the content.
  • Start with the important information on each page with an accurate page title and clear opening paragraph.
  • Remove anything that is not necessary. Blind users cannot skim read an article as easily, so keep out irrelevant content and add only links that are useful. The user should be able to easily find a link to exactly what they need in one click (without having to go through lots of pages.

5. Make links stand out

Many websites use subtly coloured links on their content instead of the traditional underline on mouseover. Whilst this is more aesthetically pleasing to some, it wont help colour-blind users

6. Resizable text - use it!

Ever seen the A- A+ buttons on a website? They are used to increase/ decrease the size of text on a page. They are not used by most people, but if your website demographic includes the elderly or people with poor eyesight, you should use a font resizer. Most CMS aoftware such as Wordpress and Joomla offer this functionality as standard - you will just need to switch it on to get it working.

7. Absolutely no flashing lights and fast movements

If you have features such as colour changes on mouseover, or quick movements such as slideshows, make sure that they employ gentle movements and soft changes. This will prevent unnecessary stress in some users and avoid causing issues for users with problems such as photosensitive epilepsy.

8. Use simple and highly intuitive navigation

This applies to all websites, but is particularly beneficial to users who find webpages complex and stressful, for example people who suffer from dyslexia. Make your website navigation extra simple and highly intuitive. Much of this can be accomplished by using simple menu titles and a well structured website hierarchy.

Put your website to the test

So you followed the advice above and built your website for elderly- and disabled user-friendly website. Now it is really important that you put it to the test - collect and act on client feedback. There are endless problems that users can have with a website, so it is important you listen to the valuable feedback. This is also an excellent chance for you as a web designer to learn more about user experience and website usability.

If you get your design right, you may well see new clients flocking to your website as it is one of the few sites out there that is so easy to use.

Tests for your website

Here are a list of excellent tests that you can put your website through to see how well it has been built. They include page speed tests, a broken link checker, Schema checker and a HTML error spotter.

If you need a website or eCommerce, please contact us for a quote and professional advice.

Mike Fitzpatrick

Mike Fitzpatrick is the founder and web developer at Jeyjoo web design. He works with both individuals and companies to grow their businesses online.
Seguimi su Google Plus