WCAG 2.0, 2.1, and 2.2 — Version Differences and What Changed

In this tutorial, you will learn about WCAG 2.0, 2.1, and 2.2. We cover key concepts, practical examples, and best practices to help you master this topic.

WCAG 2.2 is the current version superseding 2.1 and 2.0, adding 9 new success criteria including Focus Appearance, Accessible Authentication, Dragging Movements, and Pointer Target Spacing while removing 4.1.1 Parsing.

What You'll Learn

You will learn how WCAG has evolved from version 2.0 through 2.2, what each version added, and which version you should target for your projects.

Why It Matters

Targeting the correct WCAG version affects legal Compliance. WCAG 2.0 AA meets Section 508. WCAG 2.2 AA meets or exceeds most current legal requirements worldwide.

Real-World Use

DodaTech targets WCAG 2.2 AA for all products. This version meets Section 508, EAA, and ADA requirements while providing the best user experience.

flowchart LR
  A[WCAG 2.0 2008] --> B[+12 criteria from 2.0 baseline]
  B --> C[WCAG 2.1 2018]
  C --> D[+9 criteria new, -1 removed]
  D --> E[WCAG 2.2 2023]
  A --> F[78 total]
  C --> G[78 total]
  E --> H[86 total]

WCAG 2.0 (2008)

WCAG 2.0 established the POUR framework with 12 guidelines and 61 success criteria at three levels. It is still referenced by Section 508.

WCAG 2.1 (2018)

WCAG 2.1 added 17 new success criteria focusing on mobile Accessibility, low vision, and cognitive accessibility. Key additions: 1.4.10 (Reflow), 1.4.11 (Non-text Contrast), 1.4.12 (Text Spacing), 2.5.5 (Target Size), and 2.5.6 (Concurrent Input Mechanisms).

WCAG 2.2 (2023)

WCAG 2.2 adds 9 new success criteria and removes 4.1.1 Parsing. New criteria include:

Level A

2.4.12 Focus Not Obscured (Minimum)

Level AA

2.4.11 Focus Appearance 2.4.13 Focus Not Obscured (Enhanced) 2.5.7 Dragging Movements 2.5.8 Pointer Target Spacing 3.3.7 Accessible Authentication 3.3.8 Accessible Authentication (No Exception)

Level AAA

3.3.9 Redundant Entry

function getWCAGVersionRequirements(targetVersion) {
  const criteriaCounts = {
    '2.0': { A: 25, AA: 13, AAA: 23, total: 61 },
    '2.1': { A: 30, AA: 20, AAA: 28, total: 78 },
    '2.2': { A: 31, AA: 24, AAA: 31, total: 86 }
  };

  return criteriaCounts[targetVersion] || { message: 'Unknown version' };
}

console.log('WCAG 2.2:', getWCAGVersionRequirements('2.2'));
console.log('WCAG 2.1:', getWCAGVersionRequirements('2.1'));
console.log('WCAG 2.0:', getWCAGVersionRequirements('2.0'));

Expected output:

WCAG 2.2: { A: 31, AA: 24, AAA: 31, total: 86 }
WCAG 2.1: { A: 30, AA: 20, AAA: 28, total: 78 }
WCAG 2.0: { A: 25, AA: 13, AAA: 23, total: 61 }

Backward Compatibility

Content that conforms to WCAG 2.2 also conforms to WCAG 2.1 and 2.0. This makes upgrading safe.

Which Version to Target

Target WCAG 2.2 Level AA for all new projects. For existing projects, upgrade from 2.1 to 2.2 by addressing the 9 new criteria.

Common Mistakes

1. Sticking with WCAG 2.0

WCAG 2.0 misses important mobile and cognitive accessibility criteria added in 2.1 and 2.2.

2. Not Understanding the 4.1.1 Removal

4.1.1 Parsing was removed because browsers and assistive technologies have improved. It is no longer a valid criterion.

3. Ignoring New 2.2 Criteria

Focus Appearance, Accessible Authentication, and Pointer Target Spacing are new requirements. Failing them means your site is not 2.2 compliant.

4. Assuming 2.0 Compliance Is Sufficient

Most laws now reference 2.1 or 2.2. 2.0 compliance may not meet current legal requirements.

5. Not Planning Version Upgrades

WCAG version upgrades add new criteria. Plan time and budget to address them.

6. Confusing WCAG Version with Level

Version (2.0, 2.1, 2.2) is different from level (A, AA, AAA). You need both.

7. Forgetting That Conformance Must Be Claimed Explicitly

Conformance to a specific WCAG version must be stated in your conformance claim.

Practice Questions

1. What is the current WCAG version?

WCAG 2.2, published in October 2023.

2. How many success criteria does WCAG 2.2 have?

86, compared to 78 in WCAG 2.1 and 61 in WCAG 2.0.

3. What was removed in WCAG 2.2?

Success Criterion 4.1.1 Parsing was removed.

4. What are the new WCAG 2.2 success criteria at Level AA?

Focus Appearance (2.4.11), Focus Not Obscured Enhanced (2.4.13), Dragging Movements (2.5.7), Pointer Target Spacing (2.5.8), Accessible Authentication (3.3.7), Accessible Authentication No Exception (3.3.8).

5. Challenge: Find a website that claims WCAG 2.1 AA compliance. Check if it would also meet WCAG 2.2 AA by testing the 9 new criteria.

FAQ

Mini Project

Create a WCAG version Migration plan. For a fictional site currently at WCAG 2.0 AA, list the additional success criteria needed to reach WCAG 2.2 AA. Estimate effort for each.

What's Next

Learn about the Four POUR Principles that form the foundation of WCAG. Then explore Conformance Levels A, AA, and AAA in depth.