Momentan installieren viele Unternehmen ein „Accessibility Overlay“ für ihre Websites und fühlen sich danach barrierefrei. Wir haben uns für einen anderen Weg entschieden. Nicht, weil wir gerne extra Arbeit machen, sondern weil wir überzeugt sind, dass alles andere Augenwischerei wäre.

Warum wir keine Overlays nutzen – und was die Forschung dazu sagt

Wer im Netz nach Barrierefreiheit sucht, landet schnell bei Anbietern, die ein Overlay-Tool verkaufen. Klingt nach einer schnellen Lösung: Ein Button, ein bisschen Javascript – und schon ist die Website barrierefrei? Die Realität sieht anders aus. Die Javascript-Overlays kaschieren das Problem, lösen es aber nicht. Das bestätigt auch eine aktuelle Studie der Halmstad University*:

  • Overlays beheben oft nur wenige WCAG-Probleme, verursachen aber neue.
  • Die User Experience und Usability werden mit Overlays oft sogar schlechter.
  • Menschen mit Sehbehinderung haben meist schon eigene Hilfsmittel. Overlays bringen ihnen wenig, manchmal stören sie sogar.
  • Fazit: Overlays sind Stand heute keine echte Lösung – sondern verschlimmern manchmal sogar die Situation.

Deshalb war für uns klar: Wir wollen, dass das StärkenRadar von Grund auf barrierefrei ist – und zwar nach den Vorgaben der EN 301 549, dem europäischen Standard für digitale Barrierefreiheit. Nicht weil wir müssen, sondern weil es richtig ist.

Was wir am StärkenRadar verändert haben

In den letzten Monaten haben wir viele kleine und große Anpassungen umgesetzt. Hier ein paar der wichtigsten Verbesserungen:

Bessere Kontraste: Überall, wo es nötig war, haben wir die Farbkontraste erhöht – Texte sind jetzt dunkler, Buttons und interaktive Elemente haben angepasste Farben. Damit sind Inhalte nicht nur für Menschen mit Seheinschränkungen besser lesbar, sondern für wirklich alle Benutzer*innen.
Grafik zeigt, wie die Buttons verändert wurden um mehr Kontrast zu erhalten.

Strukturen, die Orientierung geben: Unser Test wurde von Grund auf neu strukturiert: Geordnete Listen, eine saubere Überschriften-Hierarchie und klar definierte Seitenregionen wie <header>, <main> und <nav>.

Optimierte Formulare: Alle Formulareingaben haben jetzt klare und korrekte Labels. Vorallem die Login-Seite und die Sprach-Umschaltung konnten wir deutlich optimieren. Interaktive Schaltflächen sind konsequent als <button> ausgezeichnet. Das verbessert die Bedienbarkeit für alle, besonders für Tastatur-Nutzer*innen.

Klarheit für Screenreader: Bilder und Grafiken sind jetzt mit passenden Alternativ-Texten versehen, damit sie auch beim Vorlesen verständlich werden. Gleichzeitig haben wir dekorative oder irrelevante Elemente für Screenreader ausgeblendet.

Popups mit Fokus: Sobald sich ein Modal-Fenster über die Seite legt, kann es für Screenreader schwierig sein den richtigen Inhalt zu fokussieren. Unsere Lösung: Der Fokus wird beim Öffnen gezielt ins Modal gesetzt und nach dem Schließen sauber zurückgeführt.

Slider, die niemanden ausbremsen: Wärend des Stärkentests bewegen unsere Nutzer*innen insgesamt 120 Schieberegler. Deshalb haben wir ein besonderes Augenmerk darauf gerichtet, die Slider barrierefrei zu machen. Sie lassen sich jetzt bequem per Tastatur steuern und „sprechen“ durch aria-Attribute mit Screenreadern.

Und was ist mit PDF? Unser Barrierefreiheits-Dilemma

Barrierefreiheit hört nicht im Browser auf. Natürlich wollen wir auch das Ergebnis-PDF (das per E-Mail zugestellt wird) möglichst barrierearm machen.

Wir haben dafür alles ausgereizt, was uns technisch möglich ist:

  • InDesign: Die statischen PDF-Seiten sind jetzt voll getaggt und barrierefrei aufgebaut.
  • PDF-Zusammenführung: Unser alter PDF-Merger hat beim Zusammenfügen von PDF-Seiten sämtliche Tags zerstört. Deshalb sind wir auf eine neue PHP-Bibliothek umgestiegen.
  • Dynamische Generierung: Wir haben alle Accessibilty-Features unserer PDF-Library ausgereizt, um die Seite möglichst barrierearm aufzubauen und zu taggen.

Aber die Wahrheit ist: Die aktuellen PDF-Libraries, die mit unserer Webanwendung kompatibel sind, lassen keine komplett barrierefreien PDF-Dokumente „on the fly“ zu. Drei von 13 Seiten sind (noch) nicht voll barrierefrei – weil sich einige Features in dynamisch generierten PDFs einfach nicht sauber abbilden lassen.

Unsere Lösung: Umdenken statt Aufgeben

Statt uns entmutigen zu lassen, haben wir das Problem von der anderen Seite her gedacht. Das Browser-Ergebnis wurde technisch so weiterentwickelt, dass es nun das eigentliche Produkt ist: interaktiv und barrierefrei. Das PDF bleibt erhalten, aber nur als komfortable Zugabe.

Dieser Perspektivwechsel hat uns nicht nur aus einer Sackgasse geführt, sondern das StärkenRadar insgesamt moderner, zugänglicher und zukunftssicher gemacht.

 

* vgl. Kubesch, D. (2024). The Impact of Web Accessibility Overlays on the Usability and User Experience for People with Permanent Visual Impairments