WCAG 2.2 - der Standard

Wer legt fest, was “barrierefrei” bedeutet?

Die Web Accessibility Initiative (WAI) der W3C existiert seit 1997 und hat mehrere Standards herausgegeben: WCAG, ATAG, UAAG, WAI-ARIA. Für uns als Web-ProgrammiererInnen relevant sind vor allem:

• Für Webseiten/Content: Web Content Accessibility Guidelines (WCAG)
• Für interaktive Web-Applikationen mit viel JavaScript: Accessible Rich Internet Applications (WAI-ARIA)

WCAG ist die technische Grundlage, auf die sich so gut wie alle Gesetze zu digitaler Barrierefreiheit weltweit berufen - auch die EU-Gesetze, die wir im nächsten Abschnitt behandeln. Wer WCAG erfüllt, erfüllt in der Regel auch die gesetzlichen Vorgaben.

Versionen

WCAG 2.0 (2008) → WCAG 2.1 (2018, u.a. mobile & kognitive Kriterien dazu) → WCAG 2.2 (2023, aktuell). Jede neue Version ist abwärtskompatibel - sie fügt nur weitere Kriterien hinzu, nichts wird entfernt. An WCAG 3.0 wird gearbeitet, aber das dauert noch Jahre.

Die 4 Grundprinzipien: POUR

Alle WCAG-Kriterien lassen sich einem von 4 Grundprinzipien zuordnen - im Englischen ergeben die Anfangsbuchstaben POUR:

Prinzip	Englisch	Bedeutet	Beispiel
Wahrnehmbar	Perceivable	Information muss über mind. einen Sinn wahrnehmbar sein	Alt-Text für Bilder (auch hörbar via Screenreader)
Bedienbar	Operable	Interface & Navigation müssen bedienbar sein	Alles auch nur mit Tastatur erreichbar
Verständlich	Understandable	Information & Bedienung müssen verständlich sein	Klare Fehlermeldungen in Formularen
Robust	Robust	Inhalt muss von verschiedensten Geräten/Technologien darstellbar sein, auch zukünftigen	Gültiges, semantisches HTML statt Tag-Suppe

Merkhilfe

Wenn ihr unsicher seid, ob eine WCAG-Anforderung relevant ist: Fragt euch, welchem der vier Prinzipien sie dient. Fehlt eines davon komplett, ist die Seite für eine ganze Nutzergruppe unbenutzbar - nicht nur unbequem.

Aufbau: Prinzip → Guideline → Success Criterion

WCAG ist wie eine Pyramide aufgebaut:

1. 4 Prinzipien (POUR, siehe oben) - die grobe Kategorie
2. 13 Guidelines darunter - z.B. “1.1 Textalternativen”, “1.4 Unterscheidbar”, “2.1 Per Tastatur zugänglich”
3. Success Criteria (Erfolgskriterien) darunter - konkret testbare Regeln, z.B. “1.1.1 Nicht-Text-Inhalt”, nummeriert nach Guideline.Nummer

Jedes Erfolgskriterium ist einer von drei Konformitätsstufen zugeordnet: A, AA, AAA.

Konformitätsstufen: A, AA, AAA

Die drei Stufen sind nicht “besser/schöner/perfekter”, sondern zeigen, wie schwerwiegend die Barriere ist, wenn das Kriterium fehlt - und wie realistisch es ist, es überall umzusetzen.

Stufe	Bedeutung	Beispiel-Kriterium
A (Minimum)	Grundlegendste Barrieren. Ohne diese Stufe ist der Inhalt für manche NutzerInnengruppen komplett unbenutzbar	1.1.1: Bilder brauchen einen Alternativtext
AA (Standard)	Der weltweit übliche Zielwert für “normale” Webseiten - auch von den meisten Gesetzen (inkl. EU) gefordert	1.4.3: Kontrastverhältnis mind. 4,5 : 1 zwischen Text und Hintergrund
AAA (Höchststufe)	Die strengste Stufe. Laut W3C selbst nicht für ganze Websites realistisch erreichbar - eher für einzelne Bereiche relevant	1.4.6: Kontrastverhältnis mind. 7 : 1

Wichtig zu wissen

Die W3C selbst schreibt, dass AAA für eine gesamte Website nicht als generelles Ziel empfohlen wird - manche Inhalte (z.B. Live-Untertitel in Gebärdensprache für jedes Video) sind für die meisten Anbieter schlicht nicht realistisch leistbar. Der praktische Zielwert für so gut wie alle Projekte - und auch gesetzlich gefordert - ist Stufe AA.

Ein Überblick zum Reinschnuppern

Zum Einstieg eine Illustration von Intopia:

Siehe auch das ausführliche Poster. Damit könnt ihr euch einen Überblick verschaffen, bevor ihr die einzelnen Guidelines im Detail durcharbeitet - was für diesen Kurs nicht nötig ist. Die folgenden Abschnitte dieses Kapitels zeigen euch die praktisch wichtigsten Kriterien direkt anhand von HTML/CSS-Beispielen.