WCAG 2.1 Anforderungen: Der komplette Leitfaden 2026
WCAG 2.1 einfach erklärt: Alle Anforderungen, Konformitätsstufen und Praxisbeispiele. Jetzt prüfen, ob deine Website konform ist.
Die WCAG 2.1 sind der weltweit anerkannte Standard für digitale Barrierefreiheit. Wer eine Website betreibt, die Verbraucher:innen anspricht, kommt seit Juni 2025 nicht mehr an diesen Richtlinien vorbei. In diesem Leitfaden zeigen wir dir, was WCAG 2.1 konkret bedeutet, welche Anforderungen du erfüllen musst und wie du prüfen kannst, ob deine Website konform ist.
Was ist WCAG 2.1?
Die Web Content Accessibility Guidelines 2.1 sind ein Regelwerk des World Wide Web Consortiums (W3C), das festlegt, wie digitale Inhalte gestaltet sein müssen, damit sie von möglichst allen Menschen genutzt werden können — auch von Personen mit Seh-, Hör-, Motorik- oder kognitiven Einschränkungen.
WCAG 2.1 wurde im Juni 2018 veröffentlicht und erweitert die Vorgängerversion 2.0 um 17 zusätzliche Erfolgskriterien, die insbesondere die Nutzung auf mobilen Geräten und für Menschen mit kognitiven Einschränkungen oder Sehbehinderungen verbessern.
Warum sind die WCAG 2.1 Anforderungen wichtig?
Drei Gründe machen WCAG 2.1 für jeden Website-Betreiber relevant:
1. Gesetzliche Pflicht. Das Barrierefreiheitsstärkungsgesetz (BFSG) verlangt Barrierefreiheit nach dem Stand der Technik; die WCAG nennt es selbst nicht. Maßgebliche Orientierung ist nach Angabe der Bundesfachstelle Barrierefreiheit die europäische Norm EN 301 549 mit den WCAG 2.1 in den Stufen A und AA — das ist der Maßstab, an dem geprüft wird. Eine förmliche Konformitätsvermutung nach § 4 BFSG entsteht daraus noch nicht, weil die harmonisierten Normen zum European Accessibility Act bislang nicht im Amtsblatt der EU bekanntgemacht sind. An der Zielmarke ändert das nichts. Seit dem 28. Juni 2025 müssen verbraucherbezogene Dienstleistungen im elektronischen Geschäftsverkehr barrierefrei angeboten werden — ausgenommen Kleinstunternehmen; was das BFSG konkret verlangt, fasst unser Überblicksartikel zusammen. Welche Pflichten daraus im Einzelnen folgen, führt unsere BFSG-Checkliste mit 12 Prüfpunkten auf.
2. Wirtschaftliches Potenzial. In Deutschland leben rund 7,9 Millionen Menschen mit einer anerkannten Schwerbehinderung (Destatis 2023), dazu kommen Millionen mit temporären oder altersbedingten Einschränkungen. Barrierefreie Websites erschließen diese Zielgruppe — und verbessern gleichzeitig die Usability für alle.
3. SEO-Vorteil. Viele WCAG-Kriterien decken sich mit SEO-Best-Practices: saubere HTML-Struktur, Alt-Texte, Transkripte, klare Navigation. Google bewertet viele Accessibility-Signale indirekt über Core Web Vitals, semantisches HTML und Mobile-Usability — barrierefreie Websites profitieren dadurch in der Regel von besseren Rankings.
Die 4 Prinzipien der WCAG 2.1
Alle 78 Erfolgskriterien sind unter vier übergeordneten Prinzipien organisiert. Die Abkürzung POUR hilft beim Merken: Perceivable, Operable, Understandable, Robust.
1. Wahrnehmbar (Perceivable)
Informationen müssen so präsentiert werden, dass Nutzer:innen sie mit ihren Sinnen aufnehmen können.
Wichtigste Anforderungen:
- Textalternativen für alle Nicht-Text-Inhalte (Bilder, Grafiken, Icons) — sogenannte Alt-Texte
- Untertitel und Transkripte für Audio- und Videoinhalte
- Farbkontrast von mindestens 4,5:1 für normalen Text, 3:1 für großen Text
- Responsive Design, das auf Zoom bis 200% ohne Funktionsverlust reagiert
- Keine reine Farbvermittlung von Informationen (z.B. rote Fehlermeldungen brauchen zusätzlich Text oder Icon)
2. Bedienbar (Operable)
Alle Komponenten müssen mit unterschiedlichen Eingabegeräten nutzbar sein — insbesondere der Tastatur.
Wichtigste Anforderungen:
- Vollständige Tastaturbedienbarkeit (keine Funktion darf nur per Maus erreichbar sein)
- Sichtbarer Fokus-Indikator auf allen interaktiven Elementen
- Ausreichend Zeit zum Lesen und Interagieren (keine erzwungenen Zeitlimits)
- Keine Inhalte, die epileptische Anfälle auslösen (max. 3 Blitze pro Sekunde)
- Überspringbare Navigation (Skip-Links zum Hauptinhalt)
- Aussagekräftige Seitentitel und Überschriften-Hierarchie (H1 → H2 → H3)
3. Verständlich (Understandable)
Inhalt und Bedienung müssen nachvollziehbar sein.
Wichtigste Anforderungen:
- Sprache der Seite im HTML definieren (
lang="de") - Konsistente Navigation über alle Seiten hinweg
- Fehlermeldungen klar benennen und Lösungsvorschläge anbieten
- Formularfelder mit sichtbaren Labels beschriften
- Verständliche Sprache — als Empfehlung, nicht als AA-Pflicht (siehe Hinweis unten)
4. Robust (Robust)
Inhalte müssen von einer Vielzahl an Technologien interpretiert werden können — auch von Screenreadern und assistiven Tools.
Wichtigste Anforderungen:
- Valides HTML ohne Syntaxfehler
- ARIA-Attribute korrekt eingesetzt (Name, Rolle, Wert)
- Statusmeldungen für Screenreader erkennbar (z.B. "Warenkorb aktualisiert")
- Kompatibilität mit Screenreadern wie JAWS, NVDA und VoiceOver
Die 3 Konformitätsstufen: A, AA, AAA
WCAG unterteilt die Erfolgskriterien in drei Stufen. Je höher die Stufe, desto strenger die Anforderungen.
| Stufe | Anzahl Kriterien | Bedeutung | Rechtlich relevant in DE |
|---|---|---|---|
| A | 30 | Grundlegende Barrierefreiheit, absolute Mindestanforderungen | Nein (zu niedrig) |
| AA | 20 zusätzlich (50 gesamt) | Professioneller Standard, praktisch für alle Websites erreichbar | Ja — Prüfmaßstab unter dem BFSG seit 2025 |
| AAA | 28 zusätzlich (78 gesamt) | Höchstes Niveau, für viele Websites nicht vollständig umsetzbar | Nur für öffentliche Einrichtungen mit hoher Zielgruppenrelevanz |
Für die meisten Unternehmen ist Stufe AA das realistische Ziel — und der Maßstab, an dem die Marktüberwachung prüft.
WCAG 2.1 Anforderungen im Detail: Die 10 wichtigsten Kriterien
Folgende 10 Kriterien sind die häufigsten Fehlerquellen in der Praxis — und die, auf die automatisierte Scanner zuerst schauen.
| # | Kriterium | Stufe | Praxisbeispiel |
|---|---|---|---|
| 1 | Alt-Texte für Bilder | A | Jedes <img>-Tag braucht alt="..." |
| 2 | Farbkontrast 4,5:1 | AA | Grauer Text auf weißem Hintergrund: min. #767676 |
| 3 | Tastaturbedienbarkeit | A | Jeder Button, Link und Input per Tab erreichbar |
| 4 | Sichtbarer Fokus | AA | Keine outline: none; ohne Ersatz |
| 5 | Formular-Labels | A | Jedes <input> hat ein verknüpftes <label> |
| 6 | Seitensprache | A | <html lang="de"> im HTML-Header |
| 7 | Überschriften-Hierarchie | A | Keine übersprungenen Ebenen (H2 → H4) |
| 8 | Aussagekräftige Linktexte | A | "Mehr erfahren" → "Mehr über BFSG erfahren" |
| 9 | Responsive bis 200% Zoom | AA | Kein horizontales Scrollen bei Zoom |
| 10 | Videotranskripte/Untertitel | A/AA | Jedes Video mit Sprache braucht Untertitel |
Häufige Fehler bei der WCAG-Umsetzung
Wie teste ich meine Website auf WCAG 2.1 Konformität?
Die effizienteste Vorgehensweise kombiniert drei Ebenen:
1. Automatisierter Scan. Unser kostenloser WCAG-Scanner prüft in Sekunden die technischen Kriterien: Alt-Texte, Kontraste, ARIA-Fehler, Formular-Labels.
2. Manueller Tastatur-Test. Navigiere deine Website ausschließlich mit der Tab-Taste. Wenn du irgendwo hängen bleibst oder den Fokus nicht siehst: WCAG-Verstoß.
3. Screenreader-Test. Starte NVDA (Windows, kostenlos) oder VoiceOver (macOS, vorinstalliert) und lass dir deine Seite vorlesen. Was nicht verständlich vorgelesen wird, ist nicht barrierefrei.
Ergänzend lohnt ein Blick auf den offiziellen BITV-Test für eine vollständige manuelle Prüfung.
Fazit: WCAG 2.1 ist kein Nice-to-have mehr
Seit Juni 2025 ist WCAG 2.1 AA in Deutschland der Maßstab, an dem verbraucherbezogene Dienstleistungen im elektronischen Geschäftsverkehr gemessen werden — vom Online-Shop bis zur Terminbuchung, ausgenommen Kleinstunternehmen. Die gute Nachricht: Die meisten Anforderungen sind technisch unkompliziert und lassen sich in wenigen Wochen umsetzen — wenn man weiß, wo man steht.
Der erste Schritt ist immer eine Bestandsaufnahme: Unser kostenloser Scanner zeigt dir in 60 Sekunden, welche Kriterien deine Website erfüllt und wo der dringendste Handlungsbedarf liegt. Wer den erreichten Stand danach halten will, lässt seine Seiten regelmäßig automatisch überwachen — jedes Release kann neue Verstöße einbauen.
Häufig gestellte Fragen (FAQ)
Was ist der Unterschied zwischen WCAG 2.0, 2.1 und 2.2?
WCAG 2.0 (2008) war der ursprüngliche Standard. WCAG 2.1 (2018) ergänzte 17 Kriterien für Mobile und kognitive Einschränkungen. WCAG 2.2 (2023) fügte weitere 9 Kriterien hinzu. Für Deutschland ist aktuell WCAG 2.1 Stufe AA rechtlich maßgeblich.
Muss ich WCAG 2.1 AA oder AAA erfüllen?
Für den BFSG und die meisten Anwendungen ist Stufe AA die richtige Wahl. AAA ist oft technisch nicht vollständig umsetzbar und wird vom Gesetzgeber auch nicht gefordert — außer für bestimmte öffentliche Angebote.
Wie lange dauert die Umsetzung von WCAG 2.1?
Das hängt vom Zustand deiner Website ab. Eine technisch saubere Website benötigt meist 2-6 Wochen für WCAG-2.1-AA-Konformität. Eine komplexe Plattform mit Legacy-Code kann 3-6 Monate dauern.
Was passiert, wenn ich WCAG 2.1 nicht umsetze?
Seit dem BFSG drohen Bußgelder bis zu 100.000 Euro, Abmahnungen durch Wettbewerber und die Untersagung der Marktteilnahme. Wie die Bußgeldstaffelung im Einzelnen aussieht und wie ein Verfahren der Marktüberwachung abläuft, steht in BFSG-Bußgelder: Was kostet Nicht-Compliance?.
Reicht ein automatisierter WCAG-Scanner aus?
Nein. Automatisierte Tests finden etwa 30-40% der möglichen Barrieren. Für eine rechtssichere Umsetzung brauchst du zusätzlich manuelle Tests und idealerweise einen professionellen Audit.
Ist WCAG 2.1 dasselbe wie BITV 2.0?
Nein, aber sie überschneiden sich. BITV 2.0 ist die deutsche Verordnung für öffentliche Stellen und basiert auf der europäischen Norm EN 301 549, die wiederum WCAG 2.1 AA als Kern enthält. Für private Unternehmen gilt primär das BFSG — ebenfalls mit WCAG 2.1 AA als Referenz. Was dieser Unterschied für die Barrierefreiheitserklärung bedeutet, erklärt Barrierefreiheitserklärung erstellen.
Weiterlesen
- 15 min Lesezeit
Accessibility-Overlays: Warum sie meist schaden
Ein Klick, eine Zeile Code, Website barrierefrei? Was Overlay-Tools technisch leisten, was die deutschen Überwachungsstellen dazu sagen — und warum sie dein BFSG-Risiko oft erhöhen statt senken.
OverlaysBFSGWCAGBarrierefreiheitCompliance - 16 min Lesezeit
BFSG-Checkliste 2026: 12 Punkte für compliant Websites
BFSG-Checkliste mit 12 Prüfpunkten für Website & Online-Shop: Pflichten, Bußgeld-Staffelung, Barrierefreiheitserklärung. Jetzt kostenlos prüfen.
BFSGComplianceRechtBarrierefreiheitWCAG - 8 min Lesezeit
Alt-Texte richtig schreiben: 20 Beispiele aus der Praxis
Alt-Texte für Bilder richtig schreiben: WCAG-Regel, 20 Praxisbeispiele nach Bildtyp und die häufigsten Fehler. Jetzt kostenlos prüfen, was bei dir fehlt.
WCAGBarrierefreiheitHTMLStandards