Accessibility for websites is crucial so that everyone is able to access your website regardless of their needs.
This includes those with:
- impaired vision
- motor difficulties
- cognitive impairments or learning disabilities
- deafness or impaired hearing
At least 1 in 5 people in the UK have a long term illness, impairment or disability. Many more have a temporary disability.
(https://www.gov.uk/guidance/accessibility-requirements-for-public-sector-websites-and-apps)
There are many things that you can do to help with website accessibility to comply with WCAG 2.2 design principles.
Accessibility for Websites 5 Tips
1. Readability –Â Your website content needs to be read by visitors with lower literacy skills as well as visitors who’s first language isn’t English. So make things as simple as possible as the required grade is that a 9 year old would understand (recommended by gov.uk). Use common words, have shorter sentances, don’t use double negatives and use more active rather than passive language.
2. Colour Contrast –Â There are so many websites that I land on that have glaring colours that make my eyes go funny, but worse than that they have different contracts of colours put together to make text unreadable. There is a scale for text and background colour and you can check your website here: https://www.experte.com/accessibility/contrast.
3. Use alt text for images – alt text is used on images to describe what the image is so that screen readers can describe what is being seen, for example if the visitor is blind or has visual difficulties. Alt tags are generally discussed for SEO purposes and it is recommended to use your chosen key phrase in your alt tag of images. But also make sure you are describing the images for accessibility purposes.
4. Use a site structure – this is helpful for screen readers to read your website page in the correct order. It is also used in web browsers and by search engine bots. This means using a hierarchical heading structure, so Header 1 is always the title and shouldn’t be used again on the page. The next header should then be header 2 (don’t jump to header 3) and header 3’s should be within header 2’s etc. Many people just choose a header based on size, which is not the correct way to do it. You should set sizes for headers and use them accordingly. They also need to be descriptiveso that the reader knows what you are going to talk about next.
5. Use descriptive links – This is not just for accessibility but also for general user experience (Google checks will pick you up on it) so when you have a link or a button the link text (or button text) should always explain what that link is going to take you to. So no more read more, find out more, click here. Those are not descriptive enough, make sure that the visitor knows what the link does or where it goes to without contect of the text before hand.
So how can you check if you are meeting standards and how you can improve (as there is always room for improvement)?
Using the Google Page Insights checker is a good place to start. As well as assessing your site speed and suggesting improvements it also gives you suggestions on improving your visibility.
If you have a WordPress website you can also use the SA11Y plugin (just search for it under plugins on your dashboard). Once installed it will appear in the right hand corner of your website pages and give you tips on how to make your website more accessible. Pointing out structure mistakes, missing alt tags etc.
 If you want more tips on how to improve your website sign up to our weekly newsletter for tutorials and up to date blog posts.