Easy checks for accessibility compliance
There are plenty of easy steps you can take to make your site more accessible. It’s important to meet those basic standards, as there’s no point investing in a full audit if those standards are not in place. A good starting point is the quick diagnostic, recommended by Design Gouv, which guides digital design for French public services.
How to pre-test accessibility compliance?
Are documents in open and accessible formats?
Here are some things to check to make sure your files are compliant:
- If users don’t need to edit the document, use a PDF.
- For text documents, the recommended format is ODT.
- For presentations, the recommended format is ODP.
- For spreadsheets, the recommended format is ODS.
You can still use Microsoft Office, but you should offer the alternatives listed above.
Why?
Open formats let everyone access the documents without needing to pay for a licence.
Is the language of the website set correctly?
If the website language isn’t set, assistive technologies won’t read the text properly. For a website in English, add the attribute lang="en" to the HTML tag at the start of the code. You can find it by right-clicking on the page and selecting “Inspect” or “View Page Source”.
What if I use English words in another language?
I’m French so my website is in both French and English. And like many countries, English terms are frequently used in French. If that’s something you do too, you’ll need to mark those words as English. This way, screen readers will pronounce them correctly in English.
To mark them in English, wrap the words in a <span> tag with the attribute lang="en". If you need help, let me know! It’s easy to do, even on a CMS (Content Management System) like Webflow.
Is the page title unique and relevant?
The page title helps identify the content in browser tabs, bookmarks, history, or by screen readers. A relevant title also helps with SEO (Search Engine Optimisation). Here’s a couple things to check:
- Each page title includes the page title, followed by the website name (e.g. Blog – Tamara Sredojevic).
- The title is relevant and unique.
- On a search results page, the title is “Search results for xxx page 1 – site name”.
- On a confirmation page, the title reflects the action taken (followed by the site name).
Are there at least two ways to navigate the site?
Check that there are at least two navigation options from these three: main menu, site map, and search bar.
Why?
Giving users multiple ways to navigate lets them choose what works best for them. It’s also useful if one option doesn’t work as expected.
Are colour contrasts strong enough?
Text should have enough contrast with the background colour to be easy to read.
How to check colour contrast?
Use ABC Use All Five to check the contrast of your brand colours. Enter the colour references, and you’ll get a grid showing which combinations you can use. AA or AAA ratings are compliant, meaning they have a contrast ratio of at least 4.5:1. If you get a result like AA18, the contrast isn’t enough for body text, but it could work for bold text or text over 24px.
If your site is already built, you can use a tool like A11ygator to identify contrast problems. Just enter your URL and you'll get a list of accessibility issues. This sort of tool doesn't replace a proper audit, but it works well for this particular criteria.
Additional resources
- The W3C easy checks can help you assess the accessibility of a web page. With these simple checks, you can find out whether or not accessibility is addressed in even the most basic way.
- The British government basic accessibility checks are best done by the person in your organisation with the best knowledge of websites. This will usually be the person responsible for updating the website (like a web officer). Once you’ve finished the checks, you’ll need to make a plan to fix any accessibility problems you find.