WCAG 2.2 Compliance Checklist: What Every Business Website Must Fix

Santhosh Kotteeswaran
Feb 21
5 min read

Website accessibility is no longer optional in 2026. Courts increasingly reference the Web Content Accessibility Guidelines (WCAG) when evaluating compliance under the Americans with Disabilities Act and similar global laws.

If your website fails WCAG 2.2 Level AA standards, you may be exposing your business to:

Legal risk
Lost customers
SEO disadvantages
Brand reputation damage

This guide gives you a practical, business-focused WCAG 2.2 compliance checklist — what must be fixed, what’s new in 2.2, and how to prioritize.

What Is WCAG 2.2?

WCAG is developed by the World Wide Web Consortium (W3C). It provides technical standards to ensure websites are accessible to people with:

Visual impairments
Hearing impairments
Motor disabilities
Cognitive disabilities
Neurological conditions

WCAG is organized under four principles:

Perceivable
Operable
Understandable
Robust

Most businesses should aim for WCAG 2.2 Level AA compliance, as this is the standard most commonly referenced in legal actions.

Why WCAG 2.2 Matters in 2026

WCAG 2.2 builds on 2.1 and introduces new criteria focused on:

Mobile usability
Focus visibility
Cognitive accessibility
Dragging movements
Target size requirements

Many websites that passed WCAG 2.1 still fail WCAG 2.2.

If you haven’t updated your compliance strategy recently, you may already be behind.

WCAG 2.2 Compliance Checklist

Below is a structured checklist of what every business website must fix.

1. PERCEIVABLE: Can Users See or Hear Your Content?

1.1 Provide Meaningful Alt Text for Images

Every informative image must include descriptive alt text.

Fix:

Product images
Icons with meaning
Infographics
Charts

Do NOT:

Use file names
Stuff keywords
Leave alt empty (unless decorative)

1.2 Ensure Proper Color Contrast

WCAG 2.2 requires:

4.5:1 contrast ratio for normal text
3:1 for large text
3:1 for UI components and focus indicators

Common violations:

Light gray text
Placeholder text too faint
Buttons blending into background

1.3 Provide Captions and Transcripts for Video

All prerecorded videos must include:

Closed captions
Transcripts (when applicable)

Live videos require:

Real-time captions (where feasible)

1.4 Avoid Text in Images

Text embedded inside images cannot be read by screen readers.

Replace image text with real HTML text whenever possible.

2. OPERABLE: Can Users Navigate Your Website?

2.1 Full Keyboard Accessibility

Users must be able to:

Navigate via Tab key
Activate buttons with Enter/Space
Access dropdowns
Complete forms

Test this by unplugging your mouse.

If you can’t navigate your site, you’re not compliant.

2.2 Visible Focus Indicators (WCAG 2.2 Update)

This is a major update in WCAG 2.2.

Focus indicators must:

Be clearly visible
Have sufficient contrast
Surround or highlight the entire element

Many modern designs remove focus outlines — this creates legal risk.

2.3 No Keyboard Traps

Users must not get stuck inside:

Popups
Modal windows
Menus
Sliders

They must be able to:

Enter
Navigate
Exit

2.4 Dragging Alternatives (New in WCAG 2.2)

If your website requires drag-and-drop functionality:

You must provide a single-pointer alternative.

Example:

Instead of dragging a slider, allow clicking arrows.

This affects:

E-commerce filters
Range selectors
Custom builders

2.5 Target Size Requirements (New in WCAG 2.2)

Clickable elements must be large enough.

Minimum size:

24 x 24 CSS pixels (Level AA)

This helps:

Mobile users
Users with tremors
Users with motor impairments

Small icons are now a compliance issue.

3. UNDERSTANDABLE: Can Users Understand Your Interface?

3.1 Clear Form Labels

Every form input must have:

A visible label
Programmatic association

Placeholder text alone is NOT sufficient.

3.2 Accessible Error Messages

When users make mistakes:

Errors must be clearly explained
Fields must be identified
Instructions must be provided

Example:❌ “Invalid input”✅ “Please enter a valid email address (example@email.com)”

3.3 Consistent Navigation

Menus must:

Stay in consistent locations
Use consistent labels
Avoid unexpected changes

This is critical for cognitive accessibility.

3.4 Avoid Time Limits (Or Provide Extensions)

If your site has timeouts:

Warn users
Allow extension
Avoid auto-logout without notice

This applies to:

Banking portals
Checkout sessions
Application forms

4. ROBUST: Does Your Code Work with Assistive Technology?

4.1 Proper Heading Structure

Use headings logically:

H1 for main title
H2 for sections
H3 for subsections

Do NOT skip heading levels randomly.

Screen readers rely on structure.

4.2 Use Semantic HTML

Avoid:

Div-only layouts
Fake buttons
Clickable spans

Use proper elements:

<button>
<nav>
<main>
<header>

4.3 ARIA Usage (When Necessary)

ARIA labels should:

Enhance accessibility
Not replace semantic HTML
Be tested properly

Improper ARIA can make things worse.

High-Risk Areas for Businesses

Based on litigation patterns, these areas are most frequently flagged:

Homepages
Product pages
Checkout flows
Contact forms
Appointment booking
Login portals

E-commerce businesses are especially vulnerable.

What Automated Tools Miss

Accessibility widgets and scanners typically detect only 30–40% of issues.

They cannot fully evaluate:

Keyboard flow logic
Cognitive load
Screen reader usability
Focus visibility clarity
Meaningful alt descriptions

Manual testing is essential.

Step-by-Step Plan to Achieve WCAG

2.2 Compliance

Step 1: Run Automated Testing

Use scanning tools to identify surface-level issues.

Step 2: Conduct Manual Keyboard Testing

Test:

Navigation
Forms
Modals
Dropdowns

Step 3: Test with Screen Readers

Common screen readers:

NVDA (Windows)
VoiceOver (Mac)

Step 4: Perform Professional Audit

A comprehensive audit should include:

Full WCAG 2.2 Level AA mapping
Code review
Risk prioritization
Documentation

Step 5: Implement Remediation Plan

Fix high-risk areas first:

Navigation
Forms
Checkout
Homepage

Step 6: Maintain Ongoing Monitoring

Accessibility is continuous.

You should:

Audit quarterly
Train content teams
Review plugin updates
Test new features before launch

Common Myths About WCAG 2.2

“My Website Looks Clean and Modern, So It’s Accessible”

Design ≠ accessibility.

Minimalist UI often hides contrast and focus failures.

“Accessibility Plugins Solve Everything”

Overlays do NOT fix:

Structural HTML issues
Keyboard flow problems
Screen reader compatibility

Courts increasingly reject overlay-only defenses.

“Only Blind Users Benefit”

Accessibility improves usability for:

Mobile users
Elderly users
Slow internet users
Temporary injuries
Power users

It benefits everyone.

The Cost of Non-Compliance

Potential consequences include:

Demand letters
Settlements ($5,000–$50,000+)
Legal fees
Forced remediation
Reputation damage

Fixing your website proactively is always cheaper than reacting to a lawsuit.

Final WCAG 2.2 Business Checklist

Before you say your site is compliant, confirm:

All images have meaningful alt text
Text meets 4.5:1 contrast ratio
All functionality works via keyboard
Focus indicators are clearly visible
Clickable targets meet 24x24 minimum size
Drag-and-drop has alternatives
Forms have accessible labels and error messages
Headings follow logical structure
Videos include captions
Manual and screen reader testing completed

If you cannot confidently confirm every item above, your website may not meet WCAG 2.2 Level AA standards.

Bottom Line

WCAG 2.2 compliance is not just a technical requirement.

It is:

Legal protection
Risk management
User experience optimization
Revenue expansion

Businesses that treat accessibility as a strategic priority — not just a legal checkbox — will win in 2026 and beyond.

If you'd like, I can now write the third article:

“ADA Website Lawsuits Are Rising — Is Your Site at Risk?”