Barrierefreiheit
Digitale Barrierefreiheit gehört zu den Themen, mit denen ich mich fachlich befasse. Diese Seite beschreibt, womit ich arbeite, welche Barrieren in der Praxis immer wieder entstehen und an welcher Stelle im Projekt sie sich am einfachsten vermeiden lassen.
Worum es geht
Barrierefreiheit im Web heißt, dass eine Seite unabhängig von Einschränkungen bedienbar bleibt: mit der Tastatur statt der Maus, mit einem Screenreader statt den Augen, bei starker Vergrößerung, bei eingeschränktem Farbsehen. Der technische Maßstab dafür sind die Web Content Accessibility Guidelines (WCAG). In Deutschland verweisen die BITV und das Barrierefreiheitsstärkungsgesetz (BFSG) auf diese Grundlagen.
In der Praxis geht es selten um spektakuläre Umbauten. Es geht um Kontrastwerte, um sinnvolle Überschriftenhierarchien, um Alternativtexte, um sichtbare Fokusrahmen und darum, dass ein Bedienelement auch dann noch bedienbar ist, wenn niemand mit der Maus darauf zeigt.
Womit ich arbeite
- WCAG 2.2 als technischer Maßstab, BITV und BFSG als rechtlicher Rahmen
- Kontrastprüfung von Text, Bedienelementen und Text auf Bildhintergründen
- Semantisches Markup: Überschriftenstruktur, Landmarks, Listen, Beschriftungen
- Tastaturbedienung, Fokusreihenfolge und sichtbare Fokusdarstellung
- Verhalten bei 200 % Zoom und bei 320 Pixeln Breite
- Berücksichtigung von reduzierter Bewegung und Bedienbarkeit ohne JavaScript
Typische Stolpersteine
Die meisten Barrieren entstehen nicht aus Nachlässigkeit, sondern weil ein Detail im Alltag nicht auffällt. Wer mit der Maus arbeitet und gut sieht, bemerkt nicht, dass ein Fokusrahmen fehlt oder ein Kontrast zu schwach ausfällt. Diese Fälle begegnen mir immer wieder:
- Text auf Bildern. Der Kontrast wechselt je nach Bildstelle – eine einzelne Messung an einer hellen Ecke sagt wenig über den Rest aus.
- Farbe als einziges Merkmal. Ein Link, der sich nur farblich vom Fließtext abhebt, ist für manche Leser kein erkennbarer Link.
- Entfernte Fokusrahmen. Sie werden oft als störend empfunden und weggestylt – womit die Seite für Tastaturnutzer unbedienbar wird.
- Inhalte, die an Animationen hängen. Bleibt das Skript aus, bleibt die Seite leer. Das trifft auch Suchmaschinen und Vorschaudienste.
- Überschriften nach Optik statt Struktur. Eine Ebene wird gewählt, weil die Schrift kleiner aussehen soll – die Gliederung ergibt danach keinen Sinn mehr.
- ARIA als Pflaster. Ein Attribut, das ein bedienbares Element vor Screenreadern verbirgt, richtet mehr Schaden an als gar keine Auszeichnung.
Wann sich der Aufwand entscheidet
Am günstigsten ist Barrierefreiheit ganz am Anfang: bei der Farbwahl, beim Raster, bei der Entscheidung für ein Theme. Ein zu schwacher Kontrast lässt sich im Entwurf in Minuten korrigieren. Steht dieselbe Farbe erst einmal in einem fertigen Shop, betrifft die Korrektur jede Vorlage, jedes Modul und jede Sonderseite.
Deshalb prüfe ich früh und mit einfachen Mitteln. Die Tabulatortaste zeigt in einer Minute, ob eine Seite bedienbar ist und ob die Reihenfolge stimmt. Ein Kontrastwerkzeug beantwortet die Farbfrage, bevor sie im Layout festgeschrieben ist. Und ein Blick auf die Überschriftenstruktur verrät, ob eine Seite sinnvoll gegliedert ist – oder nur so aussieht.
Automatisierte Prüfwerkzeuge helfen dabei, ersetzen aber kein Urteil: Sie erfassen nur einen Teil der Kriterien. Ob ein Alternativtext das Bild wirklich beschreibt oder ob eine Formulierung verständlich ist, lässt sich nicht messen.