Legen Sie Ihre Maus mal beiseite und versuchen Sie dann, Ihre eigene Website nur mit der Tastatur zu bedienen. Das ist der erste von sieben Tests, den Sie ohne Fachwissen selbst machen können.
Sie brauchen dafür etwa 30 Minuten, einen Browser und zwei kostenlose Hilfsmittel. Danach wissen Sie, ob es sich lohnt, genauer hinzuschauen.
Muss meine Website denn überhaupt barrierefrei sein?
Das hängt ganz davon ab, was Ihre Website tut. Seit dem 28. Juni 2025 gilt das Barrierefreiheitsstärkungsgesetz, kurz BFSG. Es betrifft Websites, über die Verbraucher online einen Vertrag abschließen können, zum Beispiel Online-Shops oder Terminbuchungen.
Reine Informationsseiten ohne Shop und ohne Buchungsfunktion fallen in der Regel nicht darunter. Dasselbe gilt für Angebote, die sich ausschließlich an Unternehmen richten. Ausgenommen sind außerdem Kleinstunternehmen, die Dienstleistungen anbieten. Dazu zählt, wer weniger als zehn Beschäftigte hat und höchstens zwei Millionen Euro Umsatz oder Bilanzsumme im Jahr hat. Beide Bedingungen müssen zusammen erfüllt sein.
Überwacht wird das Gesetz von der Marktüberwachungsstelle der Länder in Magdeburg. Das Gesetz sieht Bußgelder von bis zu 100.000 € vor. Üblicherweise wird zuerst zur Nachbesserung aufgefordert.
Aber was gilt als Maßstab? Technisch ist das die europäische Norm EN 301 549, die auf den internationalen Web-Richtlinien WCAG beruht. Am 2. September 2026 wurde sie aktualisiert und verweist künftig auf WCAG 2.2 statt 2.1. Wann die neue Fassung rechtlich als Maßstab gilt, ist noch offen. Für diesen Selbsttest spielt das keine Rolle, denn die sieben Prüfungen gehen auf Kriterien zurück, die in beiden Versionen gleich sind.
Und wenn Ihre Website nicht unter das Gesetz fällt? Dann lohnt sich der Test trotzdem. Menschen mit Einschränkungen sind Kundinnen, Bewerber und Mitarbeitende. Und eine Seite, die sich einfach bedienen lässt, hilft allen.
Was brauche ich für den Selbsttest?
Einen Browser und zwei kostenlose Hilfsmittel. Das erste ist WAVE, eine Browser-Erweiterung von WebAIM, die Probleme auf einer Seite sichtbar markiert. Das zweite ist der Contrast Checker von WebAIM, der Farbkontraste misst. Beides finden Sie über die Links am Ende dieses Beitrags.
Testen Sie mindestens drei Seiten: die Startseite, eine Unterseite und Ihr Kontaktformular.
1. Lässt sich Ihre Website nur mit der Tastatur bedienen?
Das sollte sie, denn nicht jeder Mensch nutzt eine Maus. Drücken Sie auf Ihrer Startseite die Tab-Taste. Damit springen Sie von Element zu Element, mit Shift und Tab zurück, mit Enter öffnen Sie einen Link oder Button.
Prüfen Sie: Erreichen Sie jeden Menüpunkt, jeden Button und jedes Formularfeld? Kommen Sie auch wieder heraus oder bleiben Sie irgendwo hängen?
2. Sehen Sie beim »Tabben« immer, wo Sie gerade sind?
Es sollte jederzeit ein sichtbarer Rahmen oder eine Hervorhebung am aktuellen Element liegen. Fachleute nennen das den »Fokus«. Fehlt er, wissen Tastaturnutzer nicht, wo sie sich befinden und die Seite ist für sie praktisch nicht bedienbar. Gelegentlich wird er aus Gestaltungsgründen abgeschaltet.
Prüfen Sie beim »Durchtabben«: Können Sie mit dem Blick folgen?
3. Bleibt die Seite bei 200 % Vergrößerung bedienbar?
Das sollte sie, denn viele Menschen vergrößern Seiten. Stellen Sie den Browser auf 200 % (Strg und Plus, am Mac Cmd und Plus).
Prüfen Sie: Ist der Text noch lesbar? Überlappt etwas oder wird etwas abgeschnitten? Fehlt eine Funktion?
4. Ist der Text deutlich genug vom Hintergrund abgesetzt?
Normaler Fließtext benötigt ein Kontrastverhältnis von mindestens 4,5 zu 1. Großer Text wie Überschriften benötigen einen Kontrast von mindestens 3 zu 1. Geben Sie im Contrast Checker die Farbwerte von Text und Hintergrund ein und er rechnet Ihnen die Kontrastwerte aus.
Typische Kandidaten sind hellgraue Zusatztexte, Schrift auf Fotos und helle Buttons.
5. Haben Ihre Bilder einen Alternativtext?
Jedes Bild, das etwas mitteilt, braucht einen kurzen Text, den ein Screenreader vorliest. Das ist ein Programm, das Inhalte einer Seite vorliest. Blinde und sehbehinderte Menschen nutzen es.
Schalten Sie WAVE ein. Es zeigt Bilder ohne Alternativtext mit einem roten Symbol. Ein guter Text beschreibt in einem Satz, was zu sehen ist und wozu das Bild da ist. Rein dekorative Bilder bekommen bewusst keinen Text.
6. Hat jede Seite eine saubere Gliederung?
Eine Seite braucht eine Hauptüberschrift (H1) und darunter Zwischenüberschriften (H2, H3, H4 …) in sinnvoller Reihenfolge. Screenreader-Nutzer springen von Überschrift zu Überschrift, ähnlich wie Sie durch ein Inhaltsverzeichnis blättern.
In WAVE finden Sie im Reiter Structure alle Überschriften auf einen Blick. Häufig wird eine Überschriftenebene nur gewählt, weil die Schrift dann größer aussieht. Die Reihenfolge stimmt dann nicht mehr.
7. Lässt sich Ihr Kontaktformular auch ohne Tastatur ausfüllen?
Jedes Feld braucht eine sichtbare Beschriftung, die auch noch sichtbar ist, wenn man zu tippen beginnt. Platzhaltertexte im Feld verschwinden dagegen beim Tippen.
Füllen Sie das Formular nur mit der Tastatur aus. Machen Sie dann absichtlich einen Fehler, etwa eine ungültige E-Mail-Adresse. Die Fehlermeldung muss sagen, was falsch ist und wo. Ein rot gefärbtes Feld allein reicht nicht.
Wie werte ich das Ergebnis?
Jeder Punkt, bei dem Sie stutzen, ist ein Hinweis, aber noch kein Urteil. Automatische Werkzeuge wie WAVE finden nur einen Teil der Probleme, manches erkennt nur ein Mensch. Dieser Selbsttest ersetzt deshalb keine fachliche Prüfung.
Was Barrierefreiheit darüber hinaus bedeutet, lesen Sie in meinem Beitrag vom August: https://hytte.design/blog/barrierefreie-website/
Möchten Sie wissen, wo Ihre Website steht? Melden Sie sich gerne und wir schauen gemeinsam drauf.
Quellen und Werkzeuge
- WAVE, Browser-Erweiterung zur Prüfung: wave.webaim.org
- Contrast Checker von WebAIM: webaim.org/resources/contrastchecker
- IHK Emden zum BFSG (Anwendungsbereich, Onlineshops und Buchungstools): ihk.de/emden
- Leitlinien Barrierefreiheit zum BFSG (Hinweise der Bundesfachstelle Barrierefreiheit, Kleinstunternehmen): hwk-reutlingen.de
- Marktüberwachungsstelle der Länder (MLBF): mlbf-barrierefrei.de
- Veröffentlichung EN 301 549 V4.1.1 am 2. September 2026: nda.ie