Zum Inhalt springen

Was ist WCAG 2.2?

WCAG 2.2 (Web Content Accessibility Guidelines) ist der internationale Standard für Web-Barrierefreiheit, veröffentlicht im Oktober 2023. Sie enthält 78 Erfolgskriterien auf drei Konformitätsstufen (A, AA, AAA) und erweitert WCAG 2.1 um 9 neue Kriterien — besonders für mobile Nutzung und kognitive Zugänglichkeit. Für die meisten Websites ist WCAG 2.2 Level AA der anzustrebende Standard und gesetzlicher Mindeststandard für viele EU-Regelungen.

Neue Kriterien in WCAG 2.2

WCAG 2.2 fügt 9 neue Erfolgskriterien hinzu. Besonders relevant für kommerzielle Websites sind die neuen AA-Kriterien die mobile und kognitive Zugänglichkeit verbessern.

2.4.11 Focus Not Obscured (Minimum)

Stufe: AA — Fokus-Indikator nicht vollständig verdeckt

2.5.7 Dragging Movements

Stufe: AA — Alle Drag-Aktionen auch ohne Ziehen bedienbar

2.5.8 Target Size (Minimum)

Stufe: AA — Mindestgröße von Klickzielen: 24x24 CSS-Pixel

3.2.6 Consistent Help

Stufe: A — Hilfe-Funktionen konsistent platziert

3.3.7 Redundant Entry

Stufe: A — Keine redundante Dateneingabe

3.3.8 Accessible Authentication (Minimum)

Stufe: AA — Kein kognitiver Test für Authentifizierung

Die wichtigsten AA-Kriterien im Detail

1.1.1 Non-text Content (A)

Non-text Content

Alle nicht-textuellen Inhalte brauchen eine Textalternative. Bilder: beschreibender Alt-Text. Dekorative Bilder: leerer Alt-Text (alt leer lassen). Icons: aria-label. Videos: Untertitel und Audiodeskription. Das ist das häufigste Barrierefreiheitsproblem auf Websites.

1.3.1 Info and Relationships (A)

Info and Relationships

Informationsstruktur muss programmatisch erkennbar sein — nicht nur visuell. Überschriften als h1-h6, Listen als ul/ol/li, Tabellen mit th-Elementen und scope-Attribut, Formulare mit Label-Zuordnung. Rein visuell bold gemachter Text ist kein semantischer Heading.

1.4.3 Contrast (Minimum) (AA)

Contrast

Textkontrast mindestens 4,5:1 für normalen Text, 3:1 für großen Text (18px oder 14px bold). UI-Komponenten und grafische Objekte: 3:1. Dekoratives hat kein Mindestkontrast. Werkzeuge: WebAIM Contrast Checker, Browser DevTools Color Picker.

2.4.7 Focus Visible (AA)

Focus Visible

Alle Tastatur-fokussierbaren Elemente brauchen einen sichtbaren Fokus-Indikator. outline:none ohne Alternative ist ein Verstoß. :focus-visible für einen klaren, gut sichtbaren Fokus-Ring einsetzen. Kontrast des Fokus-Indikators: mindestens 3:1.

2.5.8 Target Size — Minimum (AA, neu in 2.2)

Target Size

Klickziele müssen mindestens 24x24 CSS-Pixel groß sein. Ausnahmen: wenn genug Abstand zu anderen Zielen vorhanden ist, oder das Element Inline-Text ist. Für Touch-Interfaces empfehlen sich 44x44 Pixel (Apple HIG) oder 48x48 Pixel (Material Design).

3.3.8 Accessible Authentication (AA, neu in 2.2)

Accessible Authentication

Authentifizierung darf keinen kognitiven Test erfordern den Nutzer mit kognitiven Einschränkungen nicht lösen können. CAPTCHA ohne Alternative verstößt gegen dieses Kriterium. Alternativen: E-Mail-Code, biometrische Authentifizierung, Password-Manager-Unterstützung.

WCAG 2.2 in der Entwicklung umsetzen

Viele WCAG-Kriterien lassen sich durch systematische Code-Patterns erfüllen — nicht durch Fall-zu-Fall-Entscheidungen. Ein gut aufgesetztes Komponenten-System mit barrierefreien Basis-Komponenten erfüllt die meisten Kriterien automatisch.

Bild ohne Alt-Text

Lösung: alt leer lassen für Deko, Beschreibung für inhaltliche Bilder — WCAG 1.1.1

Niedriger Kontrast

Lösung: Mindest 4,5:1 für Text prüfen — WCAG 1.4.3

Kein Fokus-Indikator

Lösung: :focus-visible mit ausreichendem Kontrast — WCAG 2.4.7

Zu kleines Klickziel

Lösung: min-width/height 24px (besser 44px) — WCAG 2.5.8

Formular ohne Label

Lösung: label for=‘id’ oder aria-label — WCAG 1.3.1

CAPTCHA ohne Alternative

Lösung: E-Mail-Code oder andere Alternative — WCAG 3.3.8

Häufig gestellte Fragen

Was ist der Unterschied zwischen WCAG 2.1 und 2.2?

WCAG 2.2 fügt 9 neue Erfolgskriterien hinzu und entfernt 4.1.1 Parsing (das durch moderne Browser-Engines obsolet wurde). Die neuen Kriterien fokussieren auf mobile Zugänglichkeit (Target Size, Dragging) und kognitive Zugänglichkeit (Accessible Authentication, Redundant Entry). Alle WCAG-2.1-Kriterien bleiben in 2.2 enthalten.

Muss ich WCAG 2.1 oder 2.2 erfüllen?

Das BFSG und die EU Accessibility Act beziehen sich auf die EN 301 549, die aktuell WCAG 2.1 referenziert. WCAG 2.2 ist der neuere Standard — wer 2.2 AA erfüllt, erfüllt automatisch auch 2.1 AA (plus einige neue Anforderungen).

Wie teste ich ob meine Website WCAG 2.2 AA erfüllt?

Kombination aus automatisierten Tests (axe DevTools, WAVE, Lighthouse) und manuellen Tests. Automatisierte Tests finden ca. 30-40% der Probleme. Manuell prüfen: Tastatur-Navigation (Tab durch die gesamte Seite), Screenreader (NVDA kostenlos, VoiceOver in macOS/iOS), Kontrast-Checker, Zoom auf 200%.

Was ist WCAG 3.0 und wann kommt es?

WCAG 3.0 (Silver) ist ein fundamentales Redesign der Guidelines mit einem neuen Bewertungsmodell. Es ist 2026 noch in der Draft-Phase und wird voraussichtlich nicht vor 2027-2028 finalisiert. WCAG 2.2 bleibt der maßgebliche Standard für die absehbare Zukunft.