Barrierefreiheit — Alle Artikel & Tutorials

2 Artikel

Die digitale Barrierefreiheit wird in erster Linie mit spezialisierten Werkzeugen gemessen (axe-core, Lighthouse, Pa11y), die das DOM und die ARIA-Rollen prüfen. Ein erheblicher Teil der WCAG-Regeln lässt sich jedoch auch visuell überprüfen: Text-/Hintergrund-Kontrastverhältnis gemäß AA-Norm, ausreichend sichtbarer Fokus bei Tastaturnavigation, Touch-Target-Größe von mindestens 44 Pixeln, visuelle Hierarchie, die der semantischen Hierarchie entspricht. Visuelles Testing ersetzt kein Barrierefreiheits-Audit, ist aber eine natürliche und oft vernachlässigte Ergänzung.

Die Artikel auf dieser Seite untersuchen genau diese Schnittstelle: Wie erkennt man eine Kontrastregression nach einer Paletten-Überarbeitung? Wie überprüft man, dass der Fokus-Zustand nach einem CSS-Update nicht verschwunden ist? Wie testet man systematisch Dark Mode und alternative Themes unter dem Aspekt der Barrierefreiheit? Wie kombiniert man einen axe-core-Linter in der CI mit einem visuellen Test für interaktive Zustände? Wir sprechen auch ehrlich über die Grenzen: Ein visueller Test sagt nichts darüber aus, ob ein aria-label schlecht formuliert ist oder ob ein Screenreader die Struktur korrekt interpretiert. Er fängt jedoch zuverlässig jene Bugs ab, bei denen der Code valide bleibt, während die Darstellung unbrauchbar wird. Eine ergänzende, keine konkurrierende Herangehensweise zu spezialisierten Barrierefreiheits-Tools.