Unterschied WCAG 2.1 und WCAG 2.2: Die 9 neuen Kriterien für barrierefreies Webdesign

Erfahre, welche neuen Kriterien WCAG 2.2 bringt und wie sie WCAG 2.1 erweitern.

auf LinkedIn folgen

Inhalt

Zwei Klemmbretter mit der Aufschrift WCAG 2.1 und WCAG 2.2 sind auf einer Waage balanciert, neben denen ein Strichmännchen ein Fragezeichen hält. Im Hintergrund ist eine Weltkarte zu sehen.

Mit den neuen WCAG 2.2 Richtlinien wurden die Standards für digitale Barrierefreiheit erweitert und verbessert.

In unserem Beitrag findest du alle wesentlichen Unterschiede einfach und übersichtlich erklärt.

Das Wichtigste in Kürze

  • WCAG 2.2 baut auf den Richtlinien von WCAG 2.1 auf und ergänzt diese um 9 neue Erfolgskriterien.

  • Die neuen Vorgaben verbessern vor allem die Nutzung für Menschen mit kognitiven Behinderungen, Sehbehinderungen und mobile User.

  • Abwärtskompatibilität: Wer WCAG 2.2 erfüllt, erfüllt automatisch auch WCAG 2.1 und 2.0.
  • Das Ziel: digitale Barrierefreiheit und bessere Nutzerfreundlichkeit für alle Menschen

Was bedeutet WCAG 2.2?

Die Web Content Accessibility Guidelines (WCAG) sind internationale Richtlinien für digitale Barrierefreiheit.

Sie definieren Standards dafür, wie Websites, Apps und digitale Inhalte barrierefrei gestaltet werden müssen, damit sie von allen Nutzerinnen und Nutzern uneingeschränkt bedient werden können.

Die aktuelle Version WCAG 2.2 baut auf WCAG 2.1 auf und ergänzt diese um neun neue Erfolgskriterien. Diese verbessern die barrierefreie Nutzung von Websites insbesondere für:

  • Menschen mit kognitiven Behinderungen
  • Menschen mit Sehbehinderungen
  • Nutzerinnen und Nutzer von mobilen Geräten (Smartphones, Tablets etc.)

Unterschied WCAG 2.1 und 2.2

WCAG 2.2 baut auf den bestehenden Erfolgskriterien von WCAG 2.1 auf und ist abwärtskompatibel. Das bedeutet, dass eine Konformität mit WCAG 2.2 automatisch auch eine Konformität mit WCAG 2.1 und 2.0 einschliesst. Ein Kriterium aus WCAG 2.1 wurde entfernt.

Die neuen Erfolgskriterien in WCAG 2.2 verbessern vor allem die Benutzerfreundlichkeit und Zugänglichkeit für Nutzer. Sie zielen darauf ab, die Interaktivität und Bedienbarkeit zu erleichtern und schliessen somit Lücken, die in WCAG 2.1 nicht ausreichend berücksichtigt wurden.

  • Neue Erfolgskriterien: Die neun neuen Erfolgskriterien in WCAG 2.2 (vier auf Stufe AA, zwei auf A und drei auf AAA) konzentrieren sich auf die Bedienbarkeit und Verständlichkeit von Websites.
  • Entferntes Kriterium: Das Kriterium 4.1.1 Parsing aus WCAG 2.1 wurde als veraltet eingestuft und entfernt. Es wird angenommen, dass es bei der Verwendung von modernem HTML oder XML immer erfüllt ist. Aus diesem Grund wird es in WCAG 2.2 nicht mehr explizit aufgeführt.
  • Verbesserte Benutzerfreundlichkeit: Die neuen WCAG 2.2-Richtlinien sollen die Interaktion mit Websites erleichtern. Dazu gehören Vorgaben zu klickbaren Elementen, der sichtbaren Fokusmarkierung und der Authentifizierung.

Die 9 neuen Erfolgskriterien in WCAG 2.2

Die meisten der neuen WCAG 2.2-Erfolgskriterien sind auf der Konformitätsstufe AA angesiedelt, der weltweit als Standard für digitale Barrierefreiheit gilt.

Im Folgenden findest du alle neuen WCAG 2.2-Kriterien im Überblick:

  • 2.4.11 Fokus nicht verdeckt (Minimum) (AA): Stellt sicher, dass das fokussierte Element, wenn man zum Beispiel mit der Tastatur navigiert, nicht von anderen Inhalten (z. B. einem Sticky-Header oder einem Cookie-Banner) verdeckt wird. 
  • 2.4.12 Fokus nicht verdeckt (Enhanced) (AAA): Eine strengere Version des vorherigen Kriteriums. Es verlangt, dass der Tastaturfokus vollständig sichtbar sein muss. Das bedeutet, dass kein Teil des fokussierten Elements durch andere Webinhalte verdeckt werden darf.
  • 2.4.13 Fokus-Erscheinung (AAA): Verlangt, dass die visuelle Darstellung des Fokus-Indikators einen ausreichenden Kontrast und eine Mindestgrösse hat, damit er für Nutzer mit Sehschwäche gut erkennbar ist. Der Kontrast muss mindestens 3:1 zum umgebenden Bereich betragen, und der Indikator muss die Fläche eines 2 CSS-Pixel dicken Umrisses abdecken.
  • 2.5.7 Ziehbewegungen (AA): Funktionalitäten, die eine Ziehbewegung (Drag-and-Drop) erfordern, müssen auch mit einer einfachen Zeigerbewegung (z. B. einem Klick) bedienbar sein. Dies ist besonders wichtig für Menschen mit motorischen Behinderungen oder bei der Bedienung auf Touchscreens.
  • 2.5.8 Zielgrösse (Minimum) (AA): Klickbare Elemente wie Links und Buttons müssen eine Mindestgrösse von 24 x 24 CSS-Pixeln haben. Ausnahmen gibt es, wenn der Abstand zwischen den Elementen gross genug ist.
  • 3.2.6 Konsistente Hilfe (A): Wenn auf einer Website Hilfsmechanismen wie Kontaktinformationen, eine Chat-Funktion oder ein FAQ-Link vorhanden sind und auf mehreren Seiten wiederholt werden, müssen sie immer an der gleichen relativen Position platziert sein. Dies hilft Nutzern, sich zu orientieren und leicht auf Unterstützung zuzugreifen.
  • 3.3.7 Redundante Eingabe (A): Verhindert, dass Nutzer dieselben Informationen mehrfach in einem Formular oder während eines Prozesses eingeben müssen, es sei denn, dies ist aus Sicherheitsgründen erforderlich (z. B. bei der Passwortwiederholung).
  • 3.3.8 Zugängliche Authentifizierung (Minimum) (AA): Verhindert kognitive Testanforderungen (wie z. B. sich ein Passwort merken), es sei denn, es gibt einen alternativen Weg, der keine solche Anforderung hat, oder eine Hilfestellung, die für Nutzer mit kognitiven Behinderungen zugänglich ist.
  • 3.3.9 Zugängliche Authentifizierung (Enhanced) (AAA): Dies ist eine erweiterte Anforderung an die Authentifizierung. Es verlangt, dass Authentifizierungsmechanismen überhaupt keine kognitiven Tests erfordern. Die einzige Ausnahme ist, wenn eine Alternative ohne kognitive Tests oder ein unterstützender Mechanismus zur Verfügung steht.

Fazit: WCAG 2.2 als Schlüssel zu barrierefreien Websites

Die neuen WCAG 2.2-Kriterien mögen auf den ersten Blick technisch wirken, doch sie alle haben ein gemeinsames Ziel: Sie verbessern die tägliche Nutzung von Websites für Millionen von Menschen. Die Umsetzung der WCAG 2.2-Vorgaben machen Websites nicht nur barrierefrei, sondern auch insgesamt benutzerfreundlicher. Das Ergebnis ist eine bessere Nutzererfahrung für alle.

Wer eine barrierefreie Website zukunftssicher und inklusiv gestalten möchte, muss die Umsetzung der Web Content Accessibility Guidelines 2.2 sicherstellen.

Wenn du alle Anforderungen im Blick behalten möchtest, hilft dir unsere aktuelle Checkliste für barrierefreie Websites nach WCAG 2.2 mit einer klaren Übersicht über alle Erfolgskriterien.

Kostenlose
SEO & KI-Analyse

Wir analysieren deine Website und zeigen dir, wie sichtbar du bei Google & KI im Vergleich zur Konkurrenz bist.

Zwei Männer stehen nebeneinander und zeigen mit beiden Händen nach unten, vor einem weißen Hintergrund.
Frau mit braunem Haar, lächelnd, mit gemustertem Kragenhemd, fotografiert vor einem schlichten weißen Hintergrund.

Artikel von

Ayra von Däniken

Ayra von Däniken ist Web Accessibility Expertin, die ihre Marketingexpertise mit ihrem fundierten Hintergrund in der Heilpädagogik vereint. Mit dieser einzigartigen Perspektive hilft sie Unternehmen dabei, digitale Barrieren abzubauen. Sie berät und schult Teams in der Umsetzung der WCAG-Richtlinien, führt Zugänglichkeits-Audits durch und setzt sich leidenschaftlich für die Entwicklung barrierefreier Websites und digitale Inklusion ein.

Das könnte dich auch interessieren

Ein leuchtend gelber Ordner mit einem Pfeil, der auf ein PDF-Symbol zeigt, steht vor einem schwarzen Hintergrund mit gepunkteten Akzenten.
13 Min. Lesezeit
Wie gestalte ich barrierefreie PDF Dateien? Mein Praxisguide für dich
Das WordPress-Logo auf der linken Seite und das Wix-Logo auf der rechten Seite, getrennt durch ein "V" in der Mitte, mit einem schwarz-gelben digitalen Themenhintergrund.
19 Min. Lesezeit
Wix vs. WordPress – Der grosse Vergleich 2026
Ein Screenshot des WordPress-Dashboards zeigt den Bereich Plugins mit den aktivierbaren Plugins Akismet Anti-Spam und Classic Editor.
17 Min. Lesezeit
Die 22 besten WordPress Plugins für 2026
Das WordPress-Logo ist teilweise in dunkles, kräuselndes Wasser eingetaucht, das von einem gelb-grünen Licht beleuchtet wird.
8 Min. Lesezeit
Warum WordPress? 10 Gründe für eine WordPress-Website 2026
Webflow- und WordPress-Logos nebeneinander mit "Vs" dazwischen, vor einem schwarz-gelben digitalen Hintergrund.
11 Min. Lesezeit
Webflow vs WordPress – unsere Website war auf beiden Systemen
Nahaufnahme eines Computerbildschirms, auf dem die WordPress.com-Website mit dunklem Hintergrund und gelb leuchtenden Highlights angezeigt wird.
16 Min. Lesezeit
Für welche Unternehmen eignet sich WordPress?
Ein leuchtend gelber Ordner mit einem Pfeil, der auf ein PDF-Symbol zeigt, steht vor einem schwarzen Hintergrund mit gepunkteten Akzenten.
13 Min. Lesezeit
Wie gestalte ich barrierefreie PDF Dateien? Mein Praxisguide für dich
Das WordPress-Logo auf der linken Seite und das Wix-Logo auf der rechten Seite, getrennt durch ein "V" in der Mitte, mit einem schwarz-gelben digitalen Themenhintergrund.
19 Min. Lesezeit
Wix vs. WordPress – Der grosse Vergleich 2026
Ein Screenshot des WordPress-Dashboards zeigt den Bereich Plugins mit den aktivierbaren Plugins Akismet Anti-Spam und Classic Editor.
17 Min. Lesezeit
Die 22 besten WordPress Plugins für 2026
Das WordPress-Logo ist teilweise in dunkles, kräuselndes Wasser eingetaucht, das von einem gelb-grünen Licht beleuchtet wird.
8 Min. Lesezeit
Warum WordPress? 10 Gründe für eine WordPress-Website 2026
Webflow- und WordPress-Logos nebeneinander mit "Vs" dazwischen, vor einem schwarz-gelben digitalen Hintergrund.
11 Min. Lesezeit
Webflow vs WordPress – unsere Website war auf beiden Systemen
Nahaufnahme eines Computerbildschirms, auf dem die WordPress.com-Website mit dunklem Hintergrund und gelb leuchtenden Highlights angezeigt wird.
16 Min. Lesezeit
Für welche Unternehmen eignet sich WordPress?

Sprich mit uns persönlich

Füll kurz das Formular aus – wir melden uns mit den nächsten Schritten und einer ersten Einschätzung zu Umfang und Budgetrahmen.

SEO-Insights - alle 2 Wochen!

Zwei Männer stehen zu beiden Seiten eines "Search Experience Journal"-Banners. Darunter wird in einem deutschen Text eine Studie über die Nutzung von künstlicher Intelligenz durch die Generation Z in der Schweiz vorgestellt.

✓ Aktuelle KI- & SEO-Trends auf den Punkt
✓ Praxistipps, Studien & Deep Dives
✓ 100% kostenlos & jederzeit kündbar

Eine Gegenüberstellung von acht professionell gekleideten Personen, darunter Männer und Frauen, die von den Schultern aufwärts vor einem hellen Hintergrund gezeigt werden.

200+ Marketing-Verantwortliche lesen unseren Newsletter! 🎉