Designing a website for disabled and elderly users
We recently re-built an 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, intuitive navigation, responsive design and AMP pages for fast mobile loading.
Developing a website for disabled and elderly users requires extra thought. 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 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 contents are clearly written, simple and straight to the point. Blind and visually impaired users often use screen readers – 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 to users who find web pages complex and stressful, for example people who suffer from dyslexia. When building a website for disabled and elderly users, make the navigation simple and intuitive. Use simple menu titles and a well structured hierarchy.
Put your website to the test
Once you have built your website for disabled and elderly users, it is essential that you put it to the test – collect client feedback and act on it.
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 to see how well it has been built. They include page speed tests, a broken link checker, Schema checker and a HTML error spotter.