WCAG 2.2: was sich ändert und warum Sie Ihr Audit jetzt aktualisieren sollten

WCAG 2.2 wurde im Oktober 2023 zu einer offiziellen W3C-Empfehlung, aber die meisten Produktteams haben ihre Audits noch nicht aktualisiert. Der häufigste Grund, den ich höre: „Wir haben das letztes Jahr mit 2.1 gemacht – müssen wir das wirklich schon wieder machen?“ Die kurze Antwort lautet: Ja. Die längere Antwort lautet: Es hängt davon ab, wie stark Ihr Produkt den Mustern ausgesetzt ist, die die neuen Kriterien betreffen.

Dieser Artikel ist keine Liste aller neuen Kriterien mit abstrakten Erklärungen. Er ist ein praktischer Leitfaden, um zu verstehen, welche Kriterien die gängigsten Produkte konkret betreffen und wie Sie die Änderungen schrittweise angehen, ohne Ihr Entwicklungsteam zu blockieren.

Die neun neuen Kriterien im Überblick

WCAG 2.2 führt gegenüber Version 2.1 neun neue Erfolgskriterien ein. Sieben liegen auf Stufe A oder AA – das heißt, sie sind für die Standardkonformität erforderlich. Zwei liegen auf Stufe AAA. Die wirkungsvollsten lohnt es sich gut zu kennen.

2.4.11 – Focus Not Obscured (AA). Wenn eine Komponente den Tastaturfokus erhält, darf sie nicht vollständig von anderen Inhalten verdeckt werden – einem fixierten Banner am oberen Seitenrand, einer Benachrichtigungsleiste am unteren Rand. Das ist das Kriterium, das ich in Produkten mit fixierten Headern am häufigsten verletzt sehe.

2.4.13 – Focus Appearance (AA). Das technischste und das am meisten unterschätzte. Der Fokusindikator muss eine Mindestfläche haben, die dem Umfang der Komponente multipliziert mit 2px entspricht, sowie ein Kontrastverhältnis von mindestens 3:1 zwischen fokussiertem und nicht fokussiertem Zustand. Die klassische 1px-Outline reicht nicht mehr aus. Sie brauchen einen sichtbaren, dicken Ring mit gutem Kontrast.

2.5.7 – Dragging Movements (AA). Alle Funktionen, die Ziehen erfordern, müssen eine barrierefreie Alternative haben, die mit einem einzelnen Zeiger funktioniert. Das betrifft sortierbare Listen, individuelle Schieberegler, Kalender mit Auswahl per Ziehen und jede Oberfläche, die auf Ziehgesten setzt.

2.5.8 – Target Size (Minimum) (AA). Das kleinste klickbare Ziel muss mindestens 24×24 CSS-Pixel groß sein. Viele gängige Muster für Icon-Buttons liegen unter dieser Schwelle.

3.3.7 – Redundant Entry (A). Informationen, die in einem mehrstufigen Prozess bereits eingegeben wurden, dürfen nicht erneut abgefragt werden. Das betrifft Checkout-Abläufe, Konfigurationsassistenten und jedes mehrstufige Formular.

Wo Sie nach den häufigsten Verstößen suchen sollten

Nicht alle Produkte sind gleichermaßen betroffen. Die Hochrisikomuster für WCAG 2.2 sind:

• Navigation mit fixierten Headern – häufiger Verstoß gegen 2.4.11
• Entfernte oder minimierte individuelle Fokus-Outlines – Verstoß gegen 2.4.13
• Drag-and-drop ohne Alternativen – Verstoß gegen 2.5.7
• Icon-Buttons kleiner als 24px – Verstoß gegen 2.5.8
• Mehrstufige Formulare, die Daten erneut abfragen – Verstoß gegen 3.3.7

Wie Sie das Aktualisierungs-Audit strukturieren

Es ist nicht nötig, ein vollständiges Audit von Grund auf neu durchzuführen. Der Ansatz, den ich verwende, ist ein differenzielles Audit: Gehen Sie von der Dokumentation des bestehenden 2.1-Audits aus und prüfen Sie gezielt die neun neuen Kriterien sowie den Wegfall von Kriterium 4.1.1 (Parsing), das WCAG 2.2 offiziell als veraltet eingestuft hat.

Der Prozess folgt vier Phasen: Bestandsaufnahme der Risikomuster; manuelle Tastaturtests; Messung der Touch-Ziele auf Mobilgeräten; Überprüfung der mehrstufigen Abläufe.

Barrierefreiheit ist kein Sprint, den man einmal macht. Sie ist laufende Wartung, wie Sicherheit. Jedes Release kann neue Verstöße einführen.

Focus Appearance in der Praxis: die Zahlen

Kriterium 2.4.13 erfordert eine Berechnung. Die Formel: Fläche des Fokusindikators ≥ Umfang der Komponente × 2px. Bei einem Button von 120px×40px beträgt der Umfang 320px, also muss die Mindestfläche 640px² betragen. Eine 3px-Outline ist dabei komfortabel auf der sicheren Seite. Eine 1px-Outline – für viele Teams immer noch der Standard – ist es nicht.

Praktisch gesehen ist der Umstieg auf einen 2–3px-Ring in einer kontrastierenden Farbe keine Neufassung – es ist eine Änderung von wenigen Zeilen CSS im Design System. Wenn Sie ein Token-System verwenden, genügt es, die Fokus-Tokens global zu aktualisieren.

Der europäische Rechtsrahmen

Der European Accessibility Act ist im Juni 2025 für digitale Produkte und Dienstleistungen in Kraft getreten. Der technische Referenzstandard EN 301 549 nennt WCAG 2.1 als Mindestgrundlage, aber viele nationale Umsetzungen richten sich an 2.2 aus. Teams in regulierten Branchen – Gesundheitswesen, Finanzen, öffentliche Verwaltung – stehen vor einer rechtlichen Verpflichtung, die weit über gute Designpraxis hinausgeht.

Ihr Audit jetzt zu aktualisieren, ist nicht nur das Richtige. Es schützt Sie auch vor einem wachsenden rechtlichen Risiko in einem Regelungsumfeld, das sich rasch verschärft.