Video transcript
Making your website accessible is a legal requirement, but it also makes a huge difference to every person who visits your website.
In addition to that, it also helps extend your website’s reach and its search engine performance.
Here are some quick and easy tips to help you instantly improve accessibility.
1. Write descriptive links
When you add a link to your content, write link text that makes it clear where it will go. And do not use vague phrases like ‘click here’ or ‘read more’.
For example, your link should be ‘Guidance on writing links’ instead of ‘For guidance on writing links, click here.’
This is because people using screen readers often tap through a list of links. They don’t have the surrounding text for context, so hearing a ‘click here’ link doesn’t give them enough information to understand where they’re going.
And remember that people are more likely to scan your page rather than read it in full, so descriptive link text will help users understand quickly if it’s a link they should click on.
2. Use buttons for actions and keep the content short.
Instead of links, buttons can be used for actions like Apply, Submit, or Register.
- Keep the text short and clear.
- Use 2 or 3 words and fewer than 30 characters to help users quickly understand where the button will take them.
3. Use clear and concise language
Using plain English, and using short sentences and paragraphs helps everyone find and understand information more quickly. Most importantly, it helps people with cognitive disabilities, but it’s also useful for anyone skim-reading content – that’s most people online.
Even if your content is aimed at people with higher literacy, like lawyers or judges, research shows that they prefer plain English as it allows them to understand information as quickly as possible.
For example, instead of, “The recently implemented categorical standardisation procedure on waste oil should not be applied before 1 January.” saying, “Do not use the new waste oil standards before the 1st of January” is much clearer and easier to understand.
4. Use headings correctly
Headings are a great way to break up content. They help people to scan your page easily and allow screen reader users to navigate through it too.
Because of this, it’s important to use headings in the correct order.
The main title of your page will be the H1. Any subheadings under that will be an H2, anything under them will be an H3 and so on.
Make sure not to skip heading levels, for example, jumping straight from an H1 to an H3. This can make screen reader users disorientated and confused.
Do not use a bold font instead of headings. Screen readers will not be able to navigate the page if you do this.
5. Keep your H1 short but descriptive.
Your H1 should clearly describe what the page is about. Think about what a user might search for to find your page.
Keep the title short, 65 characters or fewer is best. This will help your search engine optimisation too.
Here’s an example of a good title, ‘Apply for your first provisional driving licence.’ It’s specific without being too detailed. It tells the user exactly what they can do on the page.
A bad example might be if the page were titled ‘Driving licences’ as that’s too broad for the context of the page.
6. Add alternative text to your images.
Alternative text (or alt text), is a short text description read aloud by screen readers, so users with low vision can understand what’s on the screen.
You should include alt text for all images on your site, unless they’re purely decorative.
Alt text can also help your search engine optimisation.
When writing alt text, consider the context of where the image is and how it’s being used.
- Make your alt text-specific but not overly descriptive.
- Provide any important context and include any essential text or data that’s part of the image.
For this picture, a good example of alt text might be, ‘A prison governor and 2 prison officers are conversing in a hallway. They are smiling.’
7. Use HTML pages instead of documents whenever possible
HTML web pages are far more accessible than PDFs or Microsoft Word and PowerPoint documents.
With HTML pages:
- they show up higher in search results
- they resize automatically to any screen size
- they work much better with assistive technology, helping users with disabilities access them
- they make it easier to track and understand what users are doing on your site and where they’re going.
8. Spell out acronyms the first time you use them.
Don’t assume everyone will recognise acronyms.
Write acronyms in full the first time you use them and include the acronym in brackets. After that, you can use the acronym on its own on the rest of your webpage.
For example, Web Content Accessibility Guidelines (WCAG).
9. Use a high colour contrast.
A high colour contrast helps people with low vision or colourblindness and anyone reading in bright light.
Make sure any text stands out clearly from its background.
If you’re unsure, use a contrast checker to check your colours meet accessibility standards. The checker lets you select the colours you’re using and will tell you whether that combination passes or fails the contrast check.
10. Avoid bold, underlined or italic fonts.
If you need to emphasise a message, try to write the sentence clearly and concisely rather than relying on the font style to convey the message.
Bold, underlined and italic fonts are not visible to people using screen readers, and it can make the text harder to read, especially for people with dyslexia.
And that’s it! 10 simple ways to make your web content more accessible, more readable and more user-friendly.