9 ways to make your website accessible

Article topics

1. Ensure your content is easy to read
2. Utilise alt text
3. Implement clear navigation
4. Add captions to your videos
5. Optimise your documents for accessibility
6. Check for colour contrast
7. Don’t rely on colours, shapes, and sound
8. Use relative fonts
9. Make sure your forms are easy to use
10. Website accessibility FAQ

Did you know that one in four people in the UK has a disability?

These people may find it harder to navigate and buy products and services from websites. The good news is that there are some easy changes you can make to ensure everyone can access your site.

We asked our user-experience (UX) specialists for their top ways to make your website accessible.

(Want to know more about the ins and outs of web accessibility? Check out our FAQ at the bottom of this article!)

1. Ensure your content is easy to read

Making your website content as easy to read as possible helps a wide range of people, including those with learning disabilities and difficulties like dyslexia.

Here’s how to make your content clear and simple:

• Use headings, paragraphs and bullet points to break your text up
• Use images to accompany your text and make it easier to read (but don’t forget the alt text!)
• Keep your sentences short – under 30 words where possible.
• Use plain English – avoid jargon and hard-to-understand words and phrases. Try to write like you’re speaking to a friend
• Avoid sarcasm and metaphors – people with neurodivergent conditions like autism can find these hard to understand

2. Utilise alt text

Alt text (also known as an alt tag or alt attribute) is a short piece of code attached to the photos and images on your web pages.

Some visually impaired web visitors use screen readers on desktop and mobile devices to read the text on websites. The screen reader reads the alt text so they can understand your images.

Alt text also displays if an image fails to load for any reason (for example, if someone is on a very slow mobile data connection).

Most content management systems like WordPress and Shopify make it easy to add alt text to your images.

Here’s how to write alt text that helps your accessibility efforts.

• Keep it to 140 characters or less – the typical screen reader takes about five seconds to read 140 characters
• Try to be as descriptive as possible to help people understand your content:
  • Good: A dog eating its dinner
  • Better: A cockapoo eating dinner from a blue and white striped bowl
  • Best: A light brown cockapoo with a wagging tail and a red collar, eating dog food from a blue and white striped bowl
• While you can use keywords in your alt text to help with SEO, only do so where it’s appropriate and contextual – don’t add them for the sake of it
• If you have a complicated image (for example, a chart), describe the chart in the content. This can help people who may need extra help understanding the image, like people with learning disabilities
• Don’t use alt text for wholly descriptive images (for example, borders) or if the image is already described in your content. We’ll talk about this in more detail later

Alt text on social media

Alt text isn’t something you can only use on your website – you can use it on social media too.

Many social media platforms, including Facebook, Instagram, LinkedIn, and TikTok now support alt text. You can also add image descriptions to your social media messages, like the RNIB has done above.

This means everyone can understand the context of your social media posts and join in the conversation.

3. Implement clear navigation

People with disabilities may find it challenging to move around your website. The easier you can make it, the more likely they are to stay and convert.

Here are some tips for making sure your site is simple to navigate:

• Use a logical heading structure – H1 for your page header, then H2, and H3 under any H2 headers. This makes it easier for people to scan your page, and act as signposts for people using screen readers
• Use unique, descriptive page titles so page visitors understand which page they need to be on
• Add a ‘scroll back to top’ button so people with mobility impairments and using screen readers don’t have to manually go all the way to the top of your page
• Make sure your website is navigable using keyboard commands. People with low mobility may opt to use a keyboard over a mouse, and screen readers use keyboard gestures
• Consider your anchor text – the clickable text on your page. Make sure it’s easy to understand and contextual, avoid anchor text like ‘click here’
• Try to ensure your pages have a consistent structure, this helps users know what to expect as they move across your site
• Implement a breadcrumb trail to show page visitors where they are on your website and give them an easy way to go back to previous pages
• Listen to your site through a screen reader so you can understand how your page navigation sounds for visually-impaired users. NVDA is free to download and use

4. Add captions to your videos

Captions on your videos mean people with hearing impairments can understand what you’re talking about. You can add captions to the videos on your website, as well as across your social media platforms.

The RNID has a great guide to adding captions on social media.

Many video creation platforms let you add captions to your videos. Some platforms can autogenerate them for you using AI and speech recognition technology, but in our experience, these can often go wrong! It’s always best to add them yourself.

If you can’t add captions to your website videos, you can add a transcript directly to your page.

While captions help those with hearing impairments, they help other people too, for example, people watching videos on mute during the commute to work or in the office.

A staggering 92% of people watch videos with the sound off!

5. Optimise your documents for accessibility

From an accessibility standpoint, it’s better if all your content is on your webpages. This is because if a disabled visitor has specific browser settings enabled to make the pages they view accessible, they can use them.

However, there may be some circumstances where you need to publish documents like PDFs on your site.

Here’s our guidance for creating accessible documents that everyone can view:

• Make sure your document is easy to read and well-structured
• Make sure the text in your document is selectable, this is so screen readers can view it. You can use optical character recognition in PDF documents to convert scanned text into selectable text
• Add metadata to PDFs that specify what the document is about
• Add a table of contents if your document is long, so viewers can jump to the relevant section
• Avoid complex tables as these can confuse screen readers

Many document creation platforms have accessibility checkers so you can see if your document is accessible before you upload it to your website.

6. Check for colour contrast

Colour contrast is how one colour stands out from another.

Some colour combinations (for example, black and white) have a strong contrast, while others (for example, pink and green) don’t.

Highly contrasting colours are easier to read and understand. However, people with low vision and colour blindness may struggle to distinguish between poorly contrasting colours.

(According to the NHS, 1 in 12 men and 1 in 200 women have some form of colour blindness.)

WebAIM has a colour contrast checker so you can see how your chosen colours contrast against each other. Aim to pass WCAG AA to ensure everyone can interact with your content.There are two different types of reward systems: flat-rate and tiered.

If your brand’s colour scheme isn’t accessible, consider offering alternative colour modes for visitors to choose from. For example, the RNIB provides a light and dark colour scheme, as well as yellow and black, which is extremely high contrast.

7. Don’t rely on colours, shapes, and sound

If you use colours, shapes, and sounds to convey a message on your page, there is the risk that some visitors may be left out.

For example, let’s say your website text is black and your links are blue and not underlined. People with certain types of colour blindness may not be able to distinguish between the two. In this situation, underlining your links can help people determine what they can click on.

Alternatively, let’s say you have a quiz on your website. Visitors hear a chime when they get an answer right, and a buzzing sound when they get one wrong. People with hearing impairments won’t be able to tell if they get an answer right or wrong. In this case, adding a message as an additional cue will help.

8. Use relative fonts

There are two types of website fonts: absolute and relative.

Absolute fonts are a fixed size – this means they don’t change if a visitor zooms into the page using their browser or changes their browser’s default font size. Relative fonts are scalable, meaning they adjust if a visitor makes changes in their browser.

Unless a fixed size font is essential, use relative fonts for accessibility purposes.

9. Make sure your forms are easy to use

Forms are an essential part of any website, whether on a contact us page or a landing page. However, they often aren’t accessible.

Here’s what to bear in mind to make your forms as easy to access as possible:

• Only ask for the information you need – shorter forms are more accessible
• Clearly identify any mandatory fields
• Add descriptive labels to your forms – screen readers read these and tell users what information they need to provide. One in four forms don’t have descriptive labels on them
• Provide clear and simple error messages
• Don’t rely on colour or sound alone if you need to display an error. For example, instead of just highlighting a form field in red, provide an error message too
• Don’t put time limits on forms

10. Website accessibility FAQ

What is website accessibility?

Website accessibility is the process of designing and developing your website so people with disabilities can use it.

23% of adults of working age, and 45% of older adults are disabled.

According to the Equality Act 2010, a disability is any physical or mental impairment that has long-term, substantial effects on your ability to carry out day-to-day activities. Examples of disabilities include:

• Visual impairments (any condition that affects a person’s eyesight)
• Physical impairments (any condition that causes mobility, muscle control, speech, or chronic tiredness)
• Hearing impairments (a partial or total inability to hear)
• Learning disabilities (any condition that affects how a person’s brain processes information)

Some people may have multiple impairments – for example, there are over 450,000 people in the UK who are deafblind.

Why is website accessibility important?

One in four people in the UK has a disability. Having a disability can make it harder for them to access websites and buy products and services online.

Ensuring your website is accessible means everyone can navigate and use your website, regardless of disabilities they have. This helps make the internet a more inclusive place.

It’s also important to remember that disabled customers have a lot of buying power. The ‘purple pound’ is worth about £274 billion per year. An accessible site means disabled people are more likely to buy from your business.

Are there any specific standards for website accessibility?

The most well-known and used framework is the Web Content Accessibility Guidelines (WCAG), which was developed by the World Wide Web Consortium (W3C).

This specifies that websites must be:

• Perceivable: Everyone must be able to ‘see’ or ‘hear’ what’s on your website
• Operable: Everyone must be able to navigate your website
• Understandable: Everyone must be able to understand your content
• Robust: Your content must work with all devices and tools

There are three different levels of criteria: A, AA, and AAA. A is the easiest to achieve, while achieving AAA is very difficult.

Can you get in trouble if your website isn’t accessible?

The Equality Act 2010 covers websites under ‘provisions of services’. This means you have a responsibility to make sure your website is accessible to disabled people.

There are strict guidelines in place for public sector websites and apps, which must meet the WCAG 2.2 AA accessibility standard.

There have been examples of businesses being sued for having inaccessible websites, but this is rare. For example, the RNIB sued former airline BMI in 2012, but this was a last resort following multiple attempts to help the business achieve standards.

However, an inaccessible website can have other consequences for your business, including reduced sales, negative publicity, and extra time and resources dealing with customer enquiries.

Can an accessible website help with SEO?

Yes – an accessible website improves the user experience for everyone, which can give you a boost in the search engine rankings.

A well-structured site (for example, with the right heading tags and good alt text) can also make it easier for the search engines to crawl and understand your site. This means you’re more likely to appear for relevant search queries.

Adding captions to your videos can help with SEO, as this provides the search engines with additional context about your videos.

Including relevant keywords in your alt text can help with SEO; however it’s important to do it only when a keyword is relevant. Stuffing your alt text with keywords can not only have a negative impact on SEO, but also frustrate screen reader users.

Let’s say your keyword is ‘red trainers.’ ‘Close-up of red trainers with white laces’ is a good example of using your keyword as it appears naturally. However, ‘red trainers for sale, best cheap discount red trainers’ would be bad as it doesn’t describe the image accurately.

How can I check my website for accessibility issues?

There are two ways you can check your website for accessibility issues.

The first is by going through every page manually to identify any problems. You can use accessibility technology like screen readers to do this. Alternatively, specialist accessibility companies or digital marketing agencies can audit your site for you.

The second is to use tools that automatically check your site for accessibility issues like missing alt tags and incorrect heading structures. W3C has a list of tools you can use to evaluate your website in line with WCAG standards.

Accessibility doesn’t have to be aggravating

Making sure your website is accessible can seem like hard work, but a lot of it is common sense. When you implement new features, think of how people with disabilities can access them too, and you’re heading in the right direction!

Remember that an accessible website that’s easy to navigate and understand benefits everyone, which can lead to happier web visitors, as well as additional leads and sales.

And if that doesn’t convince you that accessibility is a good thing, let us leave you with one final statistic – 73% of websites see an increase in organic traffic when they implement accessibility measures.

If you want to audit your existing site for accessibility, we’d be happy to help. Get in touch with us today, and take the first step in making your website inclusive for everyone.