Accessibility-Audit: Was wir auf 50 Kunden-Seiten gefunden haben

Wir haben in den letzten Monaten 50 Kunden-Seiten auf Barrierefreiheit geprueft — kleine Handwerksbetriebe, Anwaltskanzleien, Online-Shops, Vereins-Seiten. Das Ergebnis: kein einziger Auftritt war sauber. Manche scheiterten an einer einzigen Kleinigkeit, andere an einem Dutzend. Dieser Beitrag ist die Sammelauswertung. Was kommt immer wieder vor, was kostet es zu beheben — und welche Punkte sollten Sie zuerst angehen.

Vorab: Wir messen mit einer Kombination aus axe-core (automatisierte Pruefung), manueller Tastatur-Navigation und Screenreader-Stichproben mit VoiceOver. Automatisierte Tools finden nach Angabe der axe-Macher rund 57 Prozent aller WCAG-Verstoesse — der Rest braucht ein menschliches Auge. Wer nur ein Plugin laufen laesst und ein gruenes Haekchen sieht, hat in der Regel trotzdem Probleme.

Die haeufigsten Funde

Ein paar Probleme tauchten so oft auf, dass wir sie inzwischen blind erkennen. In der Reihenfolge, wie oft wir sie gesehen haben:

1. Kontrast-Werte unterhalb von 4,5:1

Hellgrauer Text auf weissem Grund. Goldene Buttons mit weisser Schrift. Sekundaer-Texte in einem Grau, das auf dem Designer-Monitor noch lesbar war, auf einem Buero-Display nicht mehr. WCAG verlangt fuer normalen Text mindestens 4,5:1. In rund vier von fuenf Auftritten haben wir mindestens eine Stelle gefunden, die darunter lag — meistens in Footern, Datenschutz-Hinweisen oder bei Hover-States.

Aufwand zur Behebung: meist zehn Minuten. Eine Hex-Korrektur im Theme oder im Block-Editor. Es ist die preiswerteste Verbesserung mit dem groessten Effekt.

2. Bilder ohne Alt-Text

Bei Shop-Seiten besonders bitter: Produktbilder ohne Beschreibung. Ein Screenreader liest dann nur den Dateinamen vor. Das ist nicht nur fuer blinde Nutzer ein Problem — Suchmaschinen verlieren ebenfalls Kontext. Wir haben Online-Shops gesehen, in denen ueber 200 Produktbilder ohne Alt-Text lagen.

Faustregel: dekorative Bilder bekommen ein leeres Alt-Attribut (alt=""), inhaltliche Bilder einen kurzen, beschreibenden Text. „Logo" oder „Bild" zaehlt nicht.

3. Form-Felder ohne sichtbares Label

Platzhalter im Eingabefeld sind keine Beschriftung. Sobald der Nutzer tippt, verschwindet der Hinweis. Wer mit der Tastatur navigiert oder die Seite spaeter nochmal prueft, ist verloren. Das ist ein typischer Designer-Fehler: optisch wirkt die Form aufgeraeumt, in der Bedienung wird sie zur Falle.

4. Tastatur-Navigation gebrochen

Custom-Dropdowns, die nur per Maus funktionieren. Akkordeons, die sich mit Enter nicht aufklappen lassen. Slider ohne Pfeiltasten-Steuerung. Sobald JavaScript ein natives Element ersetzt, geht haeufig die Tastatur-Bedienung verloren — selbst auf Seiten, die ansonsten ordentlich gebaut sind.

Test: Maus weglegen. Mit Tab durch die Seite. Wenn der Fokus irgendwo verschwindet oder ein Element nicht ausloesbar ist, gibt es ein Problem.

5. Fehlende Sprach-Auszeichnung

Das lang-Attribut auf dem html-Tag fehlt oder ist falsch. Screenreader sprechen die Seite dann mit englischer Aussprache vor — auch wenn die Texte deutsch sind. Eine einzige Zeile im Template-Header reicht zur Behebung.

Was uns ueberrascht hat

Drei Dinge haben wir nicht erwartet, bevor wir die Audits gemacht haben:

WordPress-Themes sind nicht automatisch besser. Wir hatten gedacht, dass kommerzielle Themes von etablierten Anbietern weniger Probleme haben. Falsch gedacht. Auch teure Themes liefern in der Standard-Konfiguration Kontrast-Probleme und nicht-zugaengliche Slider mit. Was zaehlt, ist nicht der Theme-Hersteller, sondern wie das Theme angepasst und befuellt wurde.

Cookie-Banner sind ein Hauptproblem. Genau die Komponente, die Datenschutz sicherstellen soll, ist haeufig selbst nicht zugaenglich. Modal-Overlays ohne Fokus-Falle, Buttons ohne ausreichenden Kontrast, Schliess-Kreuze ohne Beschriftung. Wir empfehlen, beim Banner-Tool gezielt auf eine Accessibility-Konformitaet zu achten — und sie nach der Integration zu pruefen.

Mobile-Ansichten sind oft schlechter. Auf Desktop war alles akzeptabel, aber auf 360 Pixel Breite haben Buttons knapp unter 24 CSS-Pixeln gelegen — das ist nach WCAG 2.2 (Erfolgskriterium 2.5.8) die Mindestgroesse fuer Tap-Targets auf Level AA. Wir empfehlen darueber hinaus 44 bis 48 Pixel als Best Practice — Apple Human Interface Guidelines geben 44 pt vor, Google Material Design 48 dp. Gerade fuer Senioren oder bei Bedienung im wackelnden Bus zahlt sich der groessere Trefferbereich aus. Es lohnt sich, Audits gezielt am Smartphone zu fahren und nicht nur am Desktop.

Was Sie zuerst angehen sollten

Wenn Sie heute eine Stunde Zeit haben, in dieser Reihenfolge:

1. Kontrast pruefen — ein Tool wie der WebAIM Contrast Checker reicht, alle Text-Hintergrund-Kombinationen durchgehen, Werte unter 4,5:1 korrigieren.
2. Alt-Texte fuer alle inhaltlichen Bilder ergaenzen — Produktbilder, Team-Fotos, Referenz-Logos.
3. Tab-Test machen — einmal komplett durch die Seite tabben, jeden Fokus-Verlust notieren, anschliessend reparieren.
4. lang="de" im HTML-Tag pruefen — eine Zeile, behoben in zwei Minuten.
5. Form-Labels durchgehen — sichtbar, korrekt verknuepft, nicht nur Placeholder.

Diese fuenf Punkte beheben in unserer Erfahrung etwa 70 Prozent der Funde. Der Rest braucht laenger — Custom-Komponenten umbauen, Slider austauschen, Modal-Verhalten korrigieren. Aber die Basis steht damit.

Warum das jetzt wichtiger wird

Mit dem Barrierefreiheitsstaerkungsgesetz (BFSG) gilt seit dem 28. Juni 2025 fuer viele kommerzielle Online-Angebote eine gesetzliche Pflicht zur Barrierefreiheit. Betroffen sind unter anderem Online-Shops, Banking-Anbieter und Buchungsplattformen. Reine Visitenkarten-Seiten fallen nicht darunter, sobald Sie aber online verkaufen, Termine buchbar machen oder Konten verwalten lassen, sind Sie in der Pflicht.

Unabhaengig von der Rechtslage: eine zugaengliche Seite ist eine bessere Seite. Klare Kontraste helfen allen Nutzern, gerade auf Mobilgeraeten in der Sonne. Saubere Tastatur-Navigation hilft Power-Usern. Beschriftete Bilder helfen der Suchmaschine. Accessibility ist kein Nischen-Thema — es ist solides Handwerk.

Wenn Sie unsicher sind, wie Ihre eigene Seite abschneidet, schreiben Sie uns. Ein erstes Audit dauert eine bis zwei Stunden und zeigt Ihnen konkret, wo Sie stehen.