Website auf Barrierefreiheit testen: mit Tools und manuell, Schritt fuer Schritt

Wenn du wissen willst, ob deine Website wirklich barrierefrei ist, reicht ein einzelnes Tool nicht aus. Automatische Scanner finden je nach Quelle nur einen Teil der tatsaechlichen Probleme – den Rest deckst du nur durch manuelle Pruefung auf. Dieser Leitfaden zeigt dir beide Wege: erst die schnellen Tool-Checks, dann die manuelle Pruefung, die den Unterschied macht. Wir testen Barrierefreiheit nicht nur bei Kundenprojekten, sondern betreiben sieben eigene Marken in Produktion – darunter einen Barrierefreiheits-Scanner. Die folgenden Schritte sind also Praxis, kein Lehrbuch.

Warum automatische Tools nur die halbe Wahrheit sind

Automatische Prueftools sind nuetzlich, weil sie in Sekunden technische Fehler finden: fehlende Alt-Texte, zu schwache Farbkontraste, fehlende Formular-Beschriftungen, kaputte HTML-Struktur. Was sie nicht koennen, ist Bedeutung beurteilen. Ein Tool sieht, dass ein Bild einen Alt-Text hat – ob dieser Alt-Text das Bild sinnvoll beschreibt, kann es nicht wissen. Genauso wenig erkennt es, ob die Tab-Reihenfolge logisch ist oder ob ein Video Untertitel braucht. Faustregel: Ein sauberer Tool-Report bedeutet nicht barrierefrei, sondern nur keine offensichtlichen technischen Fehler.

Schritt 1: Schneller Tool-Check

Starte mit kostenlosen, etablierten Werkzeugen. Diese drei decken einen Grossteil der automatisch pruefbaren Punkte ab:

• WAVE (wave.webaim.org) – markiert Fehler direkt visuell auf der Seite, ideal fuer den ersten Ueberblick.
• axe DevTools – Browser-Erweiterung fuer Chrome und Firefox, sehr praezise, wenige Fehlalarme.
• Lighthouse – in Chrome bereits eingebaut (DevTools → Tab Lighthouse), liefert einen Accessibility-Score plus konkrete Hinweise.

Pruefe nicht nur die Startseite. Teste mindestens je eine Seite pro Vorlagentyp: Startseite, eine Unterseite, ein Formular (Kontakt oder Checkout), und falls vorhanden einen Blog-Artikel. Notiere die wiederkehrenden Fehler – oft steckt eine Ursache im Template und betrifft hunderte Seiten gleichzeitig.

Schritt 2: Mit der Tastatur navigieren

Das ist der wichtigste manuelle Test – und er kostet nichts. Klick einmal in die Adressleiste, dann bedien die ganze Seite nur mit der Tastatur:

• Tab springt vorwaerts, Shift+Tab zurueck durch alle Links, Buttons und Formularfelder.
• Enter und Leertaste loesen Aktionen aus, mit den Pfeiltasten bedienst du Auswahllisten und Slider.

Achte dabei auf drei Dinge: Ist immer sichtbar, wo du gerade bist (deutlicher Fokus-Rahmen)? Ist die Reihenfolge logisch und folgt dem Lesefluss? Kommst du ueberall hin und auch wieder weg – besonders aus Menues, Pop-ups und Cookie-Bannern? Bleibst du in einem Element haengen oder ist der Fokus unsichtbar, hast du ein echtes Problem gefunden, das kein Scanner zuverlaessig meldet.

Schritt 3: Mit einem Screenreader hoeren

Du brauchst keine teure Software. Unter Windows ist der Narrator eingebaut (Strg+Win+Enter), kostenlos und sehr verbreitet ist NVDA, auf dem Mac liegt VoiceOver bereit (Cmd+F5). Schliess die Augen und hoer dir zu, wie die Seite vorgelesen wird. Gute Fragen dabei:

• Werden Bilder sinnvoll beschrieben – oder nur als Bild oder mit dem Dateinamen vorgelesen?
• Sind Ueberschriften als Ueberschriften erkennbar, sodass du per Tastenkuerzel springen kannst?
• Werden Formularfelder klar benannt (Vorname, E-Mail) statt nur Eingabefeld?
• Werden Fehlermeldungen und Statushinweise tatsaechlich angesagt?

Anfangs ist das ungewohnt, doch schon zehn Minuten zeigen dir, wie deine Seite fuer blinde Nutzer klingt.

Schritt 4: Farben, Kontrast und Zoom pruefen

Stell deinen Browser-Zoom auf 200 Prozent: Bleibt alles lesbar, oder ueberlappt Text und verschwindet hinter Raendern? Schalt testweise auf Graustufen, um zu sehen, ob Informationen allein ueber Farbe transportiert werden – etwa rote Pflichtfelder ohne zusaetzliches Sternchen oder Text. Den Kontrast von Text zu Hintergrund pruefst du mit dem Kontrast-Checker von WebAIM; als Mindestwert gilt 4,5:1 fuer normalen Text.

Was die Tools dir nicht abnehmen

Manche Punkte erfordern Urteilsvermoegen: Sind Link-Texte aussagekraeftig (mehr Infos statt hier klicken)? Ist die Sprache verstaendlich? Haben Videos Untertitel? Diese inhaltlichen Fragen sind oft die letzten zehn Prozent – und genau die, die ueber echte Nutzbarkeit entscheiden.

Ehrlich gesagt: Fuer eine einfache, sauber gebaute Website kommst du mit den Schritten 1 bis 4 erstaunlich weit, oft ganz ohne externe Hilfe. Wird es komplexer – ein Shop, ein Buchungssystem, ein interaktives Dashboard – oder steht das Thema wegen des Barrierefreiheitsstaerkungsgesetzes (BFSG) auf deiner Pflichtliste, lohnt eine strukturierte Pruefung entlang der WCAG-Kriterien. Wir bauen Webseiten und Tools von Anfang an so, dass diese Tests sauber durchlaufen – weil nachtraegliches Reparieren immer teurer ist als von Beginn an mitgedachte Barrierefreiheit.