Accessibility-Checkliste

Seitenkopf (Header)

Skip-Link vorhanden (<a href="#main">Zum Inhalt springen</a>) WCAG 2.4.1

Seitensprache im <html lang="de">-Attribut definiert WCAG 3.1.1

Seitentitel (<title>) ist beschreibend und einzigartig WCAG 2.4.2

Viewport erlaubt Zoom (user-scalable nicht auf no) WCAG 1.4.4

Logo hat beschreibenden Alt-Text WCAG 1.1.1

Navigation

<nav>-Element mit aria-label verwendet WCAG 1.3.1

Alle Menüpunkte per Tastatur erreichbar (Tab, Enter) WCAG 2.1.1

Aktuelle Seite mit aria-current="page" markiert WCAG 1.3.1

Fokus-Indikatoren auf allen Menüpunkten sichtbar WCAG 2.4.7

Mobile-Menü: Toggle-Button mit aria-expanded WCAG 4.1.2

Navigation ist auf allen Seiten konsistent WCAG 3.2.3

Mehrere Wege zur Seite (Navigation, Suche, Sitemap) WCAG 2.4.5

Hauptinhalt (Main)

<main>-Landmark vorhanden WCAG 1.3.1

Genau ein <h1> pro Seite WCAG 1.3.1

Überschriften bilden logische Hierarchie (h1–h6) ohne Sprünge WCAG 1.3.1

Seitenbereiche mit semantischen Landmarks (<header>, <nav>, <main>, <footer>) WCAG 1.3.1

Listen verwenden <ul>, <ol> oder <dl> WCAG 1.3.1

Sprachwechsel im Inhalt mit lang-Attribut markiert WCAG 3.1.2

Link-Texte sind aussagekräftig – nicht „hier klicken" WCAG 2.4.4

Bilder & Medien

Informative Bilder haben einen beschreibenden Alt-Text WCAG 1.1.1

Dekorative Bilder haben alt="" oder sind per CSS eingebunden WCAG 1.1.1

Icon-Buttons haben einen zugänglichen Namen (aria-label oder versteckter Text) WCAG 1.1.1

Videos haben Untertitel WCAG 1.2.2

Audio-Inhalte haben ein Transkript WCAG 1.2.1

Videos haben Audiodeskription oder Textalternative WCAG 1.2.5

Keine Bilder von Text, ausser wenn unvermeidbar WCAG 1.4.5

Formulare

Jedes Eingabefeld hat ein sichtbares, programmatisch verknüpftes Label WCAG 1.3.1

Zusammengehörige Felder mit <fieldset>/<legend> gruppiert WCAG 1.3.1

Pflichtfelder visuell und mit required gekennzeichnet WCAG 3.3.2

Fehlermeldungen beschreiben den Fehler in Text (nicht nur Farbe) WCAG 3.3.1

Fehler mit aria-describedby verknüpft und aria-invalid="true" gesetzt WCAG 3.3.1

Korrekturvorschläge bei Fehlern angeboten WCAG 3.3.3

Persönliche Daten: passendes autocomplete-Attribut WCAG 1.3.5

Keine redundanten Eingaben – bereits eingegebene Daten nicht erneut abfragen WCAG 3.3.7

Tabellen

<th> für Spalten- und Zeilenköpfe verwendet WCAG 1.3.1

scope="col" oder scope="row" gesetzt WCAG 1.3.1

<caption> beschreibt den Zweck der Tabelle WCAG 1.3.1

Tabelle ist auf kleinen Screens bedienbar (horizontales Scrollen oder Reflow) WCAG 1.4.10

Interaktive Komponenten

Dialoge: role="dialog", aria-modal, Fokus-Trap, Escape schliesst WCAG 4.1.2

Dialog-Fokus kehrt nach dem Schliessen zum Auslöser zurück WCAG 2.4.3

Tabs: role="tablist", aria-selected, Pfeiltasten-Navigation WCAG 4.1.2

Akkordeons: <details>/<summary> oder aria-expanded WCAG 4.1.2

Tooltips: role="tooltip", aria-describedby, per Escape schliessbar WCAG 1.4.13

Drag-Interaktionen bieten eine Klick/Tap-Alternative WCAG 2.5.7

Statusmeldungen per aria-live oder role="status" angekündigt WCAG 4.1.3

Farben & Kontraste

Text-Kontrast mindestens 4.5:1 (normaler Text) bzw. 3:1 (grosser Text) WCAG 1.4.3

UI-Komponenten und Grafiken: Kontrast mindestens 3:1 WCAG 1.4.11

Farbe nicht als einziges Unterscheidungsmerkmal (z.B. Fehler auch mit Icon/Text) WCAG 1.4.1

Fokus-Indikatoren ausreichend kontrastreich WCAG 2.4.7

Dark Mode: alle Kontrastverhältnisse weiterhin eingehalten WCAG 1.4.3

Responsive & Zoom

Kein horizontales Scrollen bei 320px Breite (400% Zoom) WCAG 1.4.10

Text bis 200% vergrösserbar ohne Informationsverlust WCAG 1.4.4

Textabstände anpassbar ohne Inhaltsverlust WCAG 1.4.12

Orientierung nicht eingeschränkt (Hoch-/Querformat) WCAG 1.3.4

Animation & Bewegung

prefers-reduced-motion wird respektiert WCAG 2.3.3

Automatisch bewegte Inhalte können pausiert/gestoppt werden WCAG 2.2.2

Keine blinkenden/blitzenden Inhalte (über 3 pro Sekunde) WCAG 2.3.1

Zeitlimits können verlängert oder deaktiviert werden WCAG 2.2.1

Tastatur

Alle interaktiven Elemente per Tastatur erreichbar und bedienbar WCAG 2.1.1

Keine Tastaturfallen – Fokus kann immer weiter bewegt werden WCAG 2.1.2

Fokus-Reihenfolge ist logisch und nachvollziehbar WCAG 2.4.3

Fokus-Indikator jederzeit sichtbar WCAG 2.4.7

Fokussierte Elemente nicht von Sticky-Headern/Overlays verdeckt WCAG 2.4.11

Touch-Targets mindestens 24×24 CSS-Pixel WCAG 2.5.8

Authentifizierung & Login

Keine kognitiven Funktionstests (Rätsel, Merkaufgaben) für Login WCAG 3.3.8

Passwort-Einfügen (Paste) ist erlaubt WCAG 3.3.8

Hilfemechanismen sind konsistent platziert WCAG 3.2.6

Footer

<footer>-Landmark vorhanden WCAG 1.3.1

Alle Links per Tastatur erreichbar und mit ausreichendem Kontrast WCAG 2.1.1

Keine unerwarteten Kontextänderungen durch Footer-Links WCAG 3.2.1