1. Wahrnehmbarkeit
1.1. Textalternativen:
- Alle nicht-textuellen Inhalte (Bilder, Icons, Grafiken) haben alt-Attribute oder äquivalente Beschreibungen.
- Dekorative Elemente sind mit leerem alt=““ markiert oder per CSS ausgeblendet.
1.2. Zeitbasierte Medien:
- Videos haben Untertitel (für Live-Inhalte: Transkripte).
- Audiodateien bieten Transkripte oder Beschreibungen.
1.3. Anpassbare Darstellung:
- Inhalte sind semantisch strukturiert (z. B. <h1>-<h6>, <nav>, <button>).
- Tabellen nutzen <th> mit scope-Attribut für Header.
- Formulare haben verknüpfte <label>-Elemente.
1.4. Unterscheidbarkeit:
- Text hat ausreichenden Kontrast (mind. 4.5:1 für normalen Text, 3:1 für große Texte).
- Inhalte sind bei 200% Zoom nutzbar (ohne horizontales Scrollen).
- Text ist nicht allein durch Farbe erkennbar (z. B. Links mit Unterstreichung).
2. Bedienbarkeit
2.1. Tastaturbedienbarkeit:
- Alle Funktionen sind per Tastatur erreichbar (Tab-Reihenfolge logisch).
- Keine „Tastaturfallen“ (z. B. in Modalen).
2.2. Ausreichend Zeit:
- Bewegliche/autoplay-Inhalte können pausiert werden.
- Zeitlimits sind deaktivierbar/anpassbar.
2.3. Anfälle vermeiden:
- Keine blinkenden Inhalte (>3x/Sekunde).
2.4. Navigation & Orientierung:
- Übersichtliche Seitentitel (<title>), klare Breadcrumbs.
- Fokus-Indikatoren sichtbar (z. B. bei :focus).
- „Skip-Links“ für direkten Zugriff auf Hauptinhalte.
3. Verständlichkeit
3.1. Lesbarkeit:
- Sprache der Seite ist via <html lang=“…“> definiert.
- Ungewöhnliche Begriffe/Abkürzungen werden erklärt.
3.2. Vorhersehbarkeit:
- Navigation konsistent strukturiert.
- Änderungen des Kontexts (z. B. Pop-ups) werden vorher angekündigt.
3.3. Eingabeunterstützung:
- Formularfehler sind beschreibend und leicht korrigierbar.
- Sensible Aktionen (z. B. Löschen) bestätigen lassen.
4. Robustheit
4.1. Kompatibilität:
- Markup ist valide (z. B. via W3C-Validator).
- ARIA-Attribute korrekt implementiert (falls genutzt).
- Dynamische Inhalte für Screenreader aktualisierbar (aria-live).