WCAG 2.2 Accessibility: A Practical Guide for Websites

WCAG 2.2 accessibility means meeting the current version of the Web Content Accessibility Guidelines, the W3C standard that defines how to make websites usable for people with disabilities, including those who rely on screen readers, keyboards, magnification or voice control. Most organisations aim for Level AA, which covers the practical basics: readable contrast, keyboard access, clear forms, text alternatives for images and predictable navigation.

Key Takeaways

• WCAG 2.2 became a W3C Recommendation in October 2023 and adds nine success criteria to WCAG 2.1.
• Level AA is the realistic target for business websites and the level most laws and procurement rules refer to.
• The new criteria focus on visible focus, target size, alternatives to dragging, consistent help, and easier forms and logins.
• Many fixes are cheap when built in from the start: semantic HTML, labels, contrast and keyboard testing.
• Accessibility also helps SEO, mobile usability and conversions, especially for older users and low-cost devices.

What Is WCAG 2.2 and Who Needs to Follow It?

WCAG 2.2 is the latest stable version of the Web Content Accessibility Guidelines published by the World Wide Web Consortium (W3C). It is organised around four principles, that content must be perceivable, operable, understandable and robust, and it sets testable success criteria at three levels: A, AA and AAA.

Legal requirements depend on where you operate and who your customers are. In the European Union, the European Accessibility Act has applied since June 2025 to many consumer-facing digital services, including e-commerce, with some exemptions for micro-enterprises. In the United States, accessibility claims against websites are common under the Americans with Disabilities Act. If you are an Afghan business selling to customers in Europe or North America, or a diaspora business based there, check your obligations with a local adviser.

For businesses serving customers inside Afghanistan, accessibility is less a legal question and more a matter of reaching everyone, including older customers, people with low vision and anyone using a small, cheap phone in bright sunlight.

What Is New in WCAG 2.2?

WCAG 2.2 adds nine success criteria and removes one obsolete criterion, 4.1.1 Parsing. The additions most relevant to typical business sites are:

• Focus Not Obscured (Minimum), AA: when an element receives keyboard focus, it must not be completely hidden by sticky headers, cookie banners or chat widgets.
• Dragging Movements, AA: anything that requires dragging, such as sliders or sortable lists, must also work with a simple tap or click.
• Target Size (Minimum), AA: clickable targets should be at least 24 by 24 CSS pixels, or have enough spacing around them, with some exceptions.
• Consistent Help, A: if you offer help such as a phone number, WhatsApp link or contact form, it should appear in the same place across pages.
• Redundant Entry, A: do not make users type the same information twice in one process; pre-fill it or let them select it.
• Accessible Authentication (Minimum), AA: logins should not depend on cognitive tests such as remembering or retyping codes, unless an alternative exists, for example allowing paste and password managers.

The remaining three, Focus Not Obscured (Enhanced), Focus Appearance and Accessible Authentication (Enhanced), are Level AAA.

What Are the Most Common Accessibility Problems on Business Websites?

The most common problems are the basic ones, and they are usually quick to fix. When we review sites, the same issues come up again and again:

• Low colour contrast, especially light grey text on white and text over photos. Level AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text.
• Images without meaningful alternative text, or decorative images that screen readers announce as file names.
• Form fields without visible labels, relying on placeholder text that disappears when typing starts.
• Menus, sliders and pop-ups that cannot be used with a keyboard.
• Focus outlines removed in CSS, so keyboard users cannot see where they are.
• Headings chosen for size rather than structure, which breaks navigation for screen reader users.
• Videos without captions.
• Missing or wrong lang attributes, which make screen readers pronounce Dari or Pashto with English rules.

That last point matters in Afghanistan. Screen reader and text-to-speech support for Pashto is more limited than for English or Dari, so correct lang attributes, clear structure and plain language help even more. Our guide to RTL website design covers setting language and direction correctly.

How Do You Test a Website for WCAG 2.2?

Combine automated tools with manual checks, because automated scanners only catch part of the problems. Tools such as Lighthouse, axe DevTools and WAVE quickly find missing alt text, contrast failures and missing labels. They cannot judge whether alt text is meaningful or whether a process makes sense with a keyboard.

A practical testing routine:

1. Run an automated scan on your key templates: home, service or product page, article, contact form and checkout.
2. Put the mouse aside and complete the main tasks using only Tab, Shift+Tab, Enter, Space and the arrow keys.
3. Check that the focus indicator is always visible and never hidden behind sticky headers or banners.
4. Zoom the browser to 200 percent and confirm nothing overlaps or disappears.
5. Turn on a screen reader, such as NVDA on Windows, VoiceOver on Apple devices or TalkBack on Android, and listen to a page from top to bottom.
6. Check every form for visible labels, clear error messages and the ability to paste into password and code fields.
7. Measure tap targets on mobile and make sure buttons and links are large enough and not crowded together.
8. Fix the issues, re-test and record what you checked, so the next update does not undo the work.

How Does Accessibility Help SEO and Conversions?

Accessible websites tend to perform better in search and convert better, because many accessibility practices are also good SEO and usability practices. Descriptive alt text helps image search. A proper heading structure helps search engines and AI assistants understand the page. Clear labels and error messages reduce form abandonment, which is often exactly where enquiries are lost.

Larger tap targets and readable contrast also help everyone using a phone outdoors, in bright light or on a small, low-cost screen, which describes a lot of mobile traffic in Afghanistan. Our landing page conversion checklist includes several of these points.

Where Should a Small Business Start?

Start with your most important user journeys rather than trying to fix every page at once. For most businesses that means the homepage, the main service or product pages, and the contact, booking or checkout process.

Fix contrast, labels, alt text and keyboard access first, then work through the WCAG 2.2 additions. Build accessibility into your design system and components so new pages are accessible by default instead of being fixed after launch. If you serve customers abroad, our guide to websites for Afghan businesses abroad covers other things those markets expect.

Work With Sheen

Sheen designs websites with accessibility built in, from contrast and keyboard support to correct language settings for screen readers in English, Dari and Pashto, and we can review an existing site against WCAG 2.2. See our web design service or contact us at info@sheen.af or +93 784 966 018.