WCAG 2.1 einfach erklärt: Die wichtigsten Kriterien

Die Web Content Accessibility Guidelines (WCAG) 2.1 sind der internationale Standard für barrierefreie Webinhalte. Level AA ist das Niveau, das das BFSG vorschreibt. Hier die häufigsten Verstöße und wie Sie sie beheben.

1. Fehlende Alt-Texte bei Bildern

WCAG 1.1.1: Jedes Bild braucht einen beschreibenden Alternativtext. Screenreader lesen diesen vor, damit sehbehinderte Nutzer den Inhalt verstehen.

<!-- Falsch -->
<img src="produkt.jpg">

<!-- Richtig -->
<img src="produkt.jpg" alt="Rote Lederhandtasche mit Goldschnalle">

2. Unzureichende Farbkontraste

WCAG 1.4.3: Text muss ein Kontrastverhältnis von mindestens 4.5:1 zum Hintergrund haben. Grauer Text auf weißem Hintergrund ist ein typischer Verstoß.

3. Fehlende Formular-Labels

WCAG 1.3.1: Jedes Eingabefeld braucht ein zugeordnetes Label. Placeholder-Text allein reicht nicht.

<!-- Falsch -->
<input placeholder="E-Mail">

<!-- Richtig -->
<label for="email">E-Mail-Adresse</label>
<input id="email" type="email">

4. Keine Tastaturbedienbarkeit

WCAG 2.1.1: Alle interaktiven Elemente müssen per Tastatur erreichbar sein. Dropdown-Menüs, die nur auf Hover reagieren, sind ein häufiges Problem.

5. Fehlende Überschriften-Hierarchie

WCAG 1.3.1: Überschriften müssen eine logische Hierarchie bilden (H1 → H2 → H3). Überspringen von Ebenen (H1 → H3) verwirrt Screenreader-Nutzer.

Weitere häufige Verstöße

• Leere Links/Buttons: Links ohne erkennbaren Text (WCAG 4.1.2)
• Fehlende Sprache: Kein lang-Attribut im HTML-Tag (WCAG 3.1.1)
• Automatisch abspielende Medien: Videos/Audio ohne Pause-Option (WCAG 1.4.2)
• Fehlende Skip-Links: Keine Möglichkeit, die Navigation zu überspringen (WCAG 2.4.1)
• Tabellen ohne Headers: Datentabellen ohne th-Elemente (WCAG 1.3.1)