Barrierefreiheit Ihrer Website selbst testen: 30-Minuten-Check

Kurz gesagt: In 30 Minuten können Sie ohne Fachwissen die gröbsten Barrieren Ihrer Website finden: mit der Tastatur statt der Maus navigieren, auf 200 % vergrößern, Kontraste prüfen, Bilder und Überschriften kontrollieren, ein Formular falsch ausfüllen und fünf Minuten mit einem Screenreader zuhören. Das ersetzt keine vollständige Prüfung, zeigt aber zuverlässig, wo Sie anfangen sollten.

Die W3C-Initiative für Barrierefreiheit (WAI) bietet mit den „Easy Checks“ eine ähnliche Kurzprüfung an und sagt selbst ganz offen: Eine Seite kann diese Checks bestehen und trotzdem erhebliche Barrieren haben. Genau so sollten Sie das Protokoll unten verstehen – als ehrliche erste Bestandsaufnahme, nicht als Zertifikat. Technische Bezugsgröße ist WCAG 2.2, Stand November 2026.

Vorbereitung (vor dem Start)

Wählen Sie drei Seiten: die Startseite, die wichtigste Angebotsseite und die Seite mit dem Kontakt- oder Buchungsformular. Legen Sie ein leeres Dokument mit drei Spalten an: Seite, Problem, Schwere (stört / blockiert). Mehr Ausrüstung brauchen Sie nicht.

Minute 0–7: Der Tastaturtest

Legen Sie die Maus weg. Klicken Sie einmal in die Adresszeile und drücken Sie dann wiederholt die Tabulatortaste.

Prüfen Sie dabei:

Sehen Sie immer, wo Sie gerade sind? Jeder Link, jeder Button sollte beim Ansteuern sichtbar hervorgehoben werden. Die WAI nennt den sichtbaren Tastaturfokus als eigenen Prüfpunkt. Verschwindet die Markierung irgendwo, notieren Sie die Stelle.
Gibt es einen „Zum Inhalt springen“-Link? Laut Easy Checks ist ein solcher Sprunglink idealerweise das erste interaktive Element der Seite.
Kommen Sie überall hin? Lässt sich das Menü öffnen, das Cookie-Banner schließen, das Formular absenden?
Bleiben Sie irgendwo hängen? Ein Element, aus dem Sie mit Tab nicht mehr herauskommen, ist ein blockierendes Problem.

Minute 7–11: Zoom auf 200 % und schmale Ansicht

Drücken Sie Strg und Plus (Mac: Cmd und Plus), bis 200 % erreicht sind. WCAG verlangt, dass Text ohne Hilfsmittel auf 200 % vergrößert werden kann, ohne dass Inhalte oder Funktionen verloren gehen.

Gehen Sie danach auf 400 %. Bei einem gängigen Bildschirm entspricht das laut W3C ungefähr einer Breite von 320 CSS-Pixeln. Dort sollte sich der Inhalt untereinander anordnen, sodass Sie nur noch nach unten scrollen müssen, nicht zusätzlich zur Seite.

Achten Sie auf überlappende Texte, abgeschnittene Buttons, Menüs, die nicht mehr aufgehen, und fixierte Leisten, die den halben Bildschirm verdecken.

Minute 11–15: Kontrast

Installieren Sie eine kostenlose Kontrastprüfung als Browsererweiterung oder nutzen Sie die Entwicklerwerkzeuge Ihres Browsers, die bei markiertem Text das Kontrastverhältnis anzeigen. WCAG verlangt für normalen Text mindestens 4,5:1, für großen Text 3:1.

Prüfen Sie gezielt: Fließtext, Links, Text auf farbigen Buttons, Text auf Fotos, Platzhalter in Formularfeldern, Fußzeile. Typische Kandidaten sind helle Grautöne und weiße Schrift auf Fotos.

Minute 15–19: Bilder und Alternativtexte

Alternativtext beschreibt laut WAI den Zweck eines Bildes für Menschen, die es nicht sehen. So prüfen Sie ohne Technik: Rechtsklick auf ein Bild → „Untersuchen“ und nach alt= schauen. Alternativ zeigen viele Barrierefreiheits-Erweiterungen alle Alt-Texte einer Seite auf einmal.

Fragen Sie sich bei jedem Bild:

Transportiert das Bild eine Information (Logo, Foto des Teams, Infografik)? Dann braucht es einen kurzen, sinnvollen Text.
Ist es reine Dekoration? Dann darf der Alt-Text leer sein.
Steht Text im Bild, zum Beispiel ein Angebot oder Öffnungszeiten? Dann muss dieser Text auch als echter Text vorhanden sein.

Dateinamen wie „IMG_4032.jpg“ als Alt-Text sind ein Fehler.

Minute 19–22: Seitentitel, Überschriften, Sprache

Seitentitel: Schauen Sie auf den Browser-Tab. Laut WAI ist der Titel das Erste, was ein Screenreader vorliest. Steht dort auf jeder Seite nur „Startseite“ oder der Firmenname, ist das ein Problem.
Überschriften: Eine Erweiterung zur Gliederungsanzeige zeigt alle Überschriften. Gibt es genau eine Hauptüberschrift? Folgen die Ebenen logisch, ohne Sprünge? Sind „Überschriften“ in Wahrheit nur fett formatierter Text?
Sprache: Im Quelltext sollte ganz oben lang="de" stehen (oder de-AT). Sonst liest ein Screenreader Ihren deutschen Text womöglich mit englischer Aussprache.

Minute 22–25: Ein Formular falsch ausfüllen

Öffnen Sie Ihr Kontakt- oder Buchungsformular:

Hat jedes Feld eine sichtbare Beschriftung, die beim Tippen nicht verschwindet?
Ist erkennbar, welche Felder Pflicht sind – nicht nur durch Farbe?
Senden Sie das Formular leer ab. Steht bei jedem fehlenden Feld, was fehlt? Bleiben bereits eingegebene Daten erhalten?
Gibt es ein CAPTCHA? Ist es ohne gutes Sehvermögen lösbar?

Minute 25–30: Fünf Minuten mit einem Screenreader

Unter Windows ist NVDA ein kostenloser Screenreader, den Sie herunterladen und starten können. Am Mac schalten Sie VoiceOver laut Apple-Support mit Command-F5 ein und genauso wieder aus.

Machen Sie nur drei Dinge:

Lassen Sie die Startseite von oben vorlesen. Verstehen Sie, wo Sie sind?
Springen Sie mit der Tastatur durch die Links. Ergeben die vorgelesenen Linktexte allein Sinn, oder hören Sie zehnmal „mehr“?
Versuchen Sie, das Formular auszufüllen. Wird jedes Feld mit seiner Beschriftung angesagt?

Fünf Minuten machen Sie nicht zum Screenreader-Profi. Sie reichen aber, um zu hören, ob Ihre Seite grundsätzlich verständlich vorgelesen wird.

Was Sie mit den Ergebnissen tun

Sortieren Sie Ihre Notizen nach Schwere. Alles, was jemanden vollständig blockiert – kein Fokus, unbedienbares Menü, Formular nicht absendbar – kommt zuerst. Danach Kontraste und fehlende Beschriftungen, danach Alt-Texte und Überschriften. Viele Punkte sind Textarbeit, die Sie im CMS selbst erledigen. Fokus, Menü und Formularlogik brauchen meist jemanden, der den Code anpasst.

Wiederholen Sie den Check nach jeder größeren Änderung an Design oder Formularen. Für Betriebe mit vielen älteren Kunden lohnt zusätzlich ein Blick auf Website-Prüfpunkte für ältere Kundinnen und Kunden.

Häufige Fragen

Reichen automatische Prüftools nicht aus?

Sie finden schnell technische Fehler wie fehlende Alt-Attribute oder zu schwache Kontraste. Ob ein Alt-Text sinnvoll ist, ob die Tastaturbedienung logisch abläuft oder ob ein Formular verständlich ist, sieht nur ein Mensch. Am besten kombinieren Sie beides.

Muss ich jede einzelne Seite testen?

Für den Anfang nicht. Die meisten Probleme stecken in Vorlagen, die sich auf vielen Seiten wiederholen: Kopfbereich, Menü, Fußzeile, Formular. Was Sie auf drei typischen Seiten finden, gilt meist für die ganze Website.

Wie oft sollte ich den Check wiederholen?

Nach jedem Relaunch, jeder neuen Vorlage und jedem neuen Formular. Zusätzlich einmal im Jahr, weil sich durch neue Inhalte und Plugins schleichend Fehler einschleichen.

Was ist mit Videos auf der Website?

Videos mit Sprache brauchen laut WAI Untertitel, reine Audioinhalte ein Transkript. Das ist in 30 Minuten nicht zu prüfen, gehört aber auf die Liste, wenn Sie Videos einsetzen.

Wenn Ihr Protokoll mehr Fragen aufwirft als beantwortet, gehe ich die Punkte gern mit Ihnen durch und sage Ihnen, was Sie selbst im CMS beheben können – melden Sie sich gern.