Website accessibility checklist
Use this checklist to identify and fix accessibility failures on your website.
1. Add labels to your input fields
Always add a label to every input field in forms. Labels help everyone, especially those using screen readers, understand what the field is for. Make sure the label is clearly linked to the input field.
Example:
<label for="email">Email Address:</label>
<input type="email" id="email" name="email">
In this example, the for
attribute in the <label>
matches the id
of the <input>
, linking them together.
2. Write good alt text
Keep your alt text for images clear and to the point. Describe what the image is for rather than just describing it literally. This helps users who rely on screen readers get the full picture. Don’t just use generic terms like "image" or "photo."
3. Use headings properly
Organise your content with proper heading levels (H1, H2, H3, etc.). This makes it easier for screen readers to navigate and improves your content’s accessibility and SEO. Don’t skip heading levels or use them out of order.
4. Use HTML5 landmarks
Stick to HTML5 landmark elements like <header>
, <nav>
, <main>
, <aside>
, and <footer>
. They’re recognised by browsers and assistive tech, which makes navigating easier. Do not rely on ARIA landmarks unless there’s no HTML5 equivalent.
5. Ensure sufficient colour contrast
Pick text and background colours that stand out from each other. This ensures everyone, including those with visual impairments, can read your content easily. Do not use low contrast colours that might be hard to read.
6. Make links descriptive
Use clear, meaningful text for links instead of vague phrases like “Click here.” For example, say “Read the full article on accessibility best practices.” If you use icons as buttons or links, make sure they have a descriptive aria-label.
7. Use plain language
Write in plain language and avoid jargon, technical terms, and complicated sentences. This makes your content accessible and easy to understand for everyone, including those with cognitive disabilities. Don't overcomplicate it; keep your writing simple.
8. Ensure focus visibility and order
Make sure keyboard users can see where they’re focused on the page. All interactive elements should have a visible focus state, and the tab order should follow the visual layout. Do not make the focus hard to see or navigate.
9. Test dynamic content with screen readers
If your content updates automatically (like new items loading or pop-ups), make sure it’s accessible with screen readers. Use ARIA live regions if needed and check that screen readers announce updates properly. Do not assume dynamic content will be accessible without testing.
10. Do not identify content based on colour
Avoid relying on colour alone to convey important information. Ensure that key content is understandable without depending solely on colour. Use additional indicators like text labels or patterns to make sure information is accessible to everyone, including those who are colourblind.
11. Use Insytful to check your accessibility
Insytful is an accessible site improvement platform, created by Zengenti.
Insytful scans your website content and identifies improvements for accessibility, SEO, content quality and performance.