ACCESIBILIDAD ≠ OVERLAY · 30
Barrierefreiheit ≠ Overlay: 10 Prüfungen für eine wirklich zugängliche Website
📅 29. Oktober 2026 · ⏱ 4 Min. Lesezeit
Ein schwebendes Symbol beweist keine Barrierefreiheit. Entscheidend ist, ob Menschen navigieren, Inhalte verstehen und Aufgaben selbstständig abschließen können. Diese zehn Prüfungen zeigen, worauf es ankommt.
01. Mit einer Aufgabe statt mit dem Widget beginnen
Wählen Sie ein wichtiges Ziel: ein Angebot anfordern, einen Termin buchen, etwas kaufen oder Kontaktdaten finden. Gehen Sie den gesamten Ablauf durch, statt nur nach einem Barrierefreiheits-Button zu suchen.
Notieren Sie unverständliche oder unmögliche Schritte. Eine optisch ansprechende Website kann dennoch die entscheidende Handlung verhindern.
02. Den gesamten Weg per Tastatur testen
Legen Sie die Maus beiseite und navigieren Sie mit Tab und Umschalt+Tab. Aktivieren Sie Bedienelemente mit Eingabe oder Leertaste und prüfen Sie Menüs und Formulare.
Eine unlogische Fokusreihenfolge, unerreichbare Elemente oder Tastaturfallen sind funktionale Barrieren. Ein Farbwechsel behebt sie nicht.
03. Fokus und Dialogfenster prüfen
Der Tastaturfokus muss deutlich sichtbar sein und darf nicht unter fixierten Kopfzeilen verschwinden. Bei Dialogfenstern muss der Fokus sinnvoll geführt und nach dem Schließen zurückgesetzt werden.
Bleibt der Fokus bei einem Kaufdialog hinter dem Fenster, ist die Bedienung gestört. Das eigentliche Dialogelement muss repariert werden.
04. Die Seite mit einem Screenreader anhören
Prüfen Sie Überschriften, Links, Schaltflächen und Felder mit einem Screenreader. Achten Sie auf verständliche Namen, eine sinnvolle Lesereihenfolge und passende Alternativtexte.
Das visuelle Erscheinungsbild ersetzt keine korrekte HTML-Semantik. Assistive Technologien benötigen zugeordnete Beschriftungen und verständliche Zustände.
05. Formulare und Fehlermeldungen untersuchen
Senden Sie ein leeres Formular ab und geben Sie ungültige Daten ein. Erklären Fehlermeldungen das Problem und die Lösung? Sind Pflichtfelder und Beschriftungen erkennbar?
Ein bloßes „Fehler“ oder eine ausschließlich rote Markierung reicht nicht. Hinweise müssen verständlich und dem jeweiligen Feld zugeordnet sein.
06. Zoom und mobile Ansichten prüfen
Vergrößern Sie die Ansicht auf 200 Prozent und testen Sie kleine Bildschirme. Wichtige Funktionen müssen ohne überlagerte Schaltflächen erreichbar bleiben.
Größere Schrift hilft nur, wenn sich das Layout anpasst. Ein schwebendes Widget kann ein fehlerhaftes responsives Design nicht reparieren.
07. Inhalte und semantische Struktur überprüfen
Nutzen Sie eine logische Überschriftenhierarchie, aussagekräftige Linktexte und klare Anweisungen. Informative Bilder brauchen passende Textalternativen.
Gute Struktur unterstützt Screenreader und schnelles Überfliegen. Barrierefreiheit ist auch eine redaktionelle Aufgabe.
08. Grenzen automatischer Tests verstehen
Automatische Werkzeuge finden manche Kontrast-, Markup- und Beschriftungsfehler. Sie können nicht allein beurteilen, ob ein gesamter Ablauf verständlich und bedienbar ist.
Kombinieren Sie die Ergebnisse mit manuellen Tests, Tastatur und assistiven Technologien. Eine Punktzahl bedeutet nicht automatisch WCAG-Konformität.
09. Blockaden priorisieren und Verantwortliche benennen
Priorisieren Sie nach Auswirkungen: Eine blockierte Zahlung ist gravierender als eine kleine optische Unstimmigkeit. Dokumentieren Sie den Fehler und die Schritte zur Reproduktion.
Benennen Sie Verantwortliche und korrigieren Sie gemeinsame Komponenten, statt Symptome auf einzelnen Seiten zu überdecken.
10. Nach jeder Änderung erneut testen
WordPress-Updates, Divi-Module und neue Formulare können neue Barrieren schaffen. Integrieren Sie Prüfungen in Veröffentlichung und Wartung.
Nutzen Sie WCAG 2.2 als technische Referenz und halten Sie Testergebnisse fest. Das Ziel ist selbstständige Nutzung, nicht ein Symbol.