Zum Inhalt springen
InsideUX Design

UX-Glossar

WCAG

Die WCAG (Web Content Accessibility Guidelines) sind die international anerkannten Richtlinien des W3C für barrierefreie Webinhalte. Sie legen prüfbare Kriterien fest, an denen sich auch Gesetze orientieren.

Stell dir vor, ein Team bekommt den Auftrag: „Unsere Website muss barrierefrei werden.“ Sofort tauchen Fragen auf. Reicht ein guter Kontrast? Und woran erkennt man, wann die Arbeit erledigt ist?

Genau dafür gibt es die WCAG. Sie machen aus dem großen Wort Barrierefreiheit eine Liste konkreter, überprüfbarer Anforderungen.

Einfach erklärt

WCAG steht für Web Content Accessibility Guidelines, auf Deutsch etwa „Richtlinien für barrierefreie Webinhalte“. Herausgeber ist das World Wide Web Consortium (W3C), das auch Standards wie HTML pflegt. Die erste Version der WCAG 2 erschien 2008. Die aktuelle Fassung WCAG 2.2 wurde im Oktober 2023 veröffentlicht und im Dezember 2024 noch einmal aktualisiert.

Ein Vergleich aus dem Alltag: Die WCAG funktionieren wie eine Bauordnung für Websites. Eine Bauordnung schreibt nicht vor, wie ein Haus aussieht, aber sie legt fest, wie breit Türen und wie hoch Stufen sein dürfen. Die WCAG lassen dir ebenso Gestaltungsfreiheit, setzen aber Mindeststandards.

Vier Prinzipien, drei Stufen

Die WCAG sind nach vier Prinzipien geordnet. Inhalte müssen wahrnehmbar sein (zum Beispiel Alternativtexte für Bilder), bedienbar (etwa vollständig per Tastatur), verständlich (klare Sprache, vorhersehbares Verhalten) und robust, also mit Browsern und Hilfsmitteln wie einem Screenreader zuverlässig nutzbar.

Unter diesen Prinzipien stehen 13 Richtlinien und darunter die eigentlichen Erfolgskriterien. Jedes Kriterium gehört zu einer Konformitätsstufe: A ist das Minimum, AA der übliche Zielstandard, AAA die höchste Stufe. Ein Beispiel für AA ist das Kontrastverhältnis von mindestens 4,5:1 für normalen Text. Die Versionen bauen aufeinander auf: Was WCAG 2.2 erfüllt, erfüllt laut W3C auch WCAG 2.1 und 2.0.

Welche Version gilt rechtlich?

Gesetze verweisen meist nicht direkt auf die WCAG, sondern auf die europäische Norm EN 301 549. Ihre bislang maßgebliche Version V3.2.1 verlangt für Websites die Kriterien der Stufen A und AA aus WCAG 2.1. In Deutschland ist sie die Referenz für öffentliche Stellen nach der BITV 2.0 und für Unternehmen, die unter das Barrierefreiheitsstärkungsgesetz fallen.

Im September 2026 ist die neue Version V4.1.1 der EN 301 549 erschienen, die sich an WCAG 2.2 AA orientiert. Bis sie im Amtsblatt der EU gelistet ist und rechtlich voll wirkt, kann es dauern. Pragmatisch heißt das: Wer heute neu baut, peilt gleich WCAG 2.2 AA an. Mehr zur Gesetzeslage im Artikel BFSG in der Praxis: Was das Barrierefreiheitsstärkungsgesetz für Websites und Apps bedeutet.

Ein Beispiel

Ein Beispiel: Ein Onlineshop zeigt Pflichtfelder im Checkout nur mit einer roten Umrandung an. Ein WCAG-Audit findet gleich mehrere Probleme. Farbe ist das einzige Signal (Kriterium 1.4.1), es gibt keine Beschriftung, die ein Screenreader vorlesen kann (3.3.2), und die Fehlermeldung beschreibt nicht, was falsch ist (3.3.1).

Nach der Überarbeitung tragen Pflichtfelder den Hinweis „Pflichtfeld“ im Label, und Fehlermeldungen nennen das Problem in Worten, etwa „Bitte gib eine Postleitzahl mit fünf Ziffern ein“. Statt einer vagen Beschwerde hat das Team jetzt eine klare, prüfbare Aufgabenliste.

Häufige Missverständnisse

Automatische Prüftools decken nur einen Teil der Kriterien ab. Ob ein Alternativtext sinnvoll ist, muss ein Mensch beurteilen. Außerdem gelten die WCAG nicht nur für Websites: Die EN 301 549 überträgt sie auch auf Apps und Dokumente. Und die Nachfolgeversion WCAG 3 ist noch ein früher Entwurf, auf den du aktuell nicht warten musst.

In der Praxis

  • Nutze die Kurzreferenz. Die offizielle WCAG 2.2 Quick Reference lässt sich nach Stufe und Thema filtern.
  • Kombiniere Tools und Handarbeit. Automatische Tests finden Kontrastfehler schnell, Tastatur- und Screenreader-Tests bleiben Handarbeit. Wie das geht, zeigt der Artikel Accessibility-Prüfung: Werkzeuge und Methoden für UX-Designer.
  • Verankere die Kriterien im Design System. Wenn Buttons, Formularfelder und Farben einmal WCAG-konform gebaut sind, erbt jede neue Seite diese Qualität.

Verwandte Begriffe

Barrierefreiheit, Screenreader, Design System

Quellen