Website Accessibility Checklist — WCAG 2.2 AA Compliance
A practical WCAG 2.2 AA checklist covering colour contrast, keyboard navigation, alt text, captions, form labels and testing tools for websites serving Bahrain and the GCC.
Website accessibility ensures people with disabilities can use your site. WCAG 2.2 AA compliance requires sufficient colour contrast (4.5:1 for normal text), full keyboard navigation, alt text on every meaningful image, captions on video, and clear form labels with error messages. It is a legal requirement in many jurisdictions and a competitive advantage everywhere.
What accessibility is and why it matters
Web accessibility means designing and building websites that people with disabilities can perceive, understand, navigate and interact with. This includes people who are blind or have low vision, those who are deaf or hard of hearing, people with motor impairments who cannot use a mouse, and those with cognitive disabilities that affect reading or memory.
Accessibility is not a niche concern. An estimated 15% of the world’s population — over one billion people — have some form of disability. In Bahrain and the GCC, where digital government services are expanding rapidly, accessibility is becoming a procurement requirement for public-sector contracts.
Legal and business case
Accessibility lawsuits have risen sharply worldwide. In the US, ADA Title III website lawsuits exceeded 4,000 in 2024. The EU Web Accessibility Directive requires public-sector websites to meet WCAG 2.1 AA. While Bahrain does not yet have a specific digital accessibility law, the trend is clear: governments across the GCC are adopting accessibility standards, and private businesses that comply early gain a market advantage.
| Factor | Impact |
|---|---|
| Market size | 1 billion+ people with disabilities globally; 15% of any local audience |
| SEO overlap | Alt text, heading structure and transcripts all improve organic rankings |
| Legal risk | Growing litigation trend; GCC public procurement increasingly requires compliance |
| Brand perception | 84% of consumers say they trust companies that prioritise inclusion |
| Technical quality | Accessible code is cleaner, more maintainable and loads faster |
WCAG 2.2 AA checklist
The following 30 items are grouped by principle. Each one is required for WCAG 2.2 AA conformance. Mark them off as you implement or verify each item on your site.
Perceivable
1. All non-text content has text alternatives (alt text for images, transcripts for audio).
2. Captions are provided for all pre-recorded video.
3. Audio description or full-text alternative is available for video.
4. Colour is not the only way information is conveyed (add icons or patterns).
5. Text contrast ratio is at least 4.5:1 for normal text, 3:1 for large text.
6. Non-text elements (interface components, graphical objects) have 3:1 contrast.
7. Text can be resized up to 200% without loss of content or functionality.
8. Images of text are avoided unless essential (logos, screenshots).
Operable
9. All functionality is available from a keyboard.
10. Keyboard focus is visible at all times.
11. No keyboard traps — focus never gets stuck on one element.
12. Users can bypass repeated content (skip link, landmark navigation).
13. Page titles are descriptive and unique.
14. Focus order follows a logical sequence that preserves meaning.
15. Link purpose is clear from the link text alone.
16. Multiple ways to find pages are available (search, sitemap, navigation).
17. Headings and labels describe topic or purpose.
18. No content flashes more than three times per second.
19. Pointer gestures can be operated with a single click (no complex swipes).
20. Motion animation triggered by interaction can be disabled.
Understandable
21. Language of the page is programmatically set (lang attribute).
22. Language changes within content are marked with lang attributes.
23. Focus does not trigger unexpected context changes (pop-ups, navigation).
24. Input assistance: labels, instructions and error messages are clear.
25. Error identification: errors are described in text, not just colour.
26. Consistent navigation and identification across pages.
27. Consistent help mechanisms (same location for support, chat, FAQ).
Robust
28. All HTML elements have complete start and end tags.
29. ARIA attributes are used correctly and match the actual element behaviour.
30. Status messages (confirmations, errors, suggestions) are programmatically announced.
Testing tools
Automated testing tools catch roughly 30% of accessibility issues. Use them for quick wins and regressions, but never rely on them alone. Manual testing with keyboard-only navigation and a screen reader is essential for comprehensive coverage.
Free tools: WAVE Browser Extension (visual overlay of issues), axe DevTools (developer-friendly, integrates with browser dev tools), Google Lighthouse (built into Chrome, good for automated scoring) and the W3C HTML Validator (catches structural issues that affect accessibility). Paid tools: accessiBe, Siteimprove and Deque’s Axe Auditor.
Implementation priority
Start with the items that block the most users: alt text, keyboard navigation, colour contrast and form labels. These four areas account for the majority of user-facing barriers on most websites. Fixing them eliminates the most common reasons users with disabilities cannot complete key journeys like making a purchase or submitting an enquiry.
Next, address captions on video and proper heading structure. These improve both accessibility and SEO. Finally, test with a screen reader and fix ARIA and focus-order issues. Use the priority: P0 (blocks core functionality) > P1 (prevents understanding) > P2 (degrades experience) > P3 (enhancements).
Bilingual accessibility considerations
Websites serving Bahrain and the GCC are often bilingual with Arabic and English content. Bilingual accessibility adds complexity: each language version needs correct lang attributes (lang="ar" for Arabic), proper text direction (dir="rtl" for Arabic pages), and translated alt text and labels that match the language of the surrounding content. Never use the same alt text in English on an Arabic page.
Screen readers for Arabic, such as the free open-source NVDA with Arabic language pack, handle RTL text well, but only if the markup is correct. Test each language independently using the appropriate screen reader and locale settings.
Frequently asked questions
Bahrain does not yet have a specific accessibility law comparable to the ADA or EU Directive, but government websites are increasingly required to meet WCAG 2.1 AA as a minimum. For private businesses, compliance reduces legal risk, improves SEO and opens your site to the estimated 15% of the global population with some form of disability.
Level A is the minimum — 30 success criteria covering basic accessibility. Level AA adds 20 more criteria including colour contrast and captions — this is the standard most organisations target. Level AAA is the highest but often impractical for general websites as it requires extremely high contrast and slow-motion animation.
Yes. Alt text helps images rank in image search. Proper heading structure helps Google understand content hierarchy. Captions and transcripts provide more indexable text. Fast keyboard navigation correlates with good Core Web Vitals. Many accessibility practices overlap directly with SEO best practices.
Add alt text to every image on your site. Missing alt text is the most common accessibility failure and the quickest to fix. Run a free tool like WAVE or axe DevTools to find every image without alt text, then describe each one in 10 words or fewer.
Use automated tools first: WAVE Browser Extension, axe DevTools or Lighthouse. Automated checks catch roughly 30% of issues. Then test manually: tab through every interactive element, check colour contrast with a picker, and try using a screen reader (VoiceOver on Mac, NVDA on Windows) for key user journeys.