QualiBooth

guides

Wo mit Barrierefreiheit anfangen, wenn sie zu groß wirkt

Web-Barrierefreiheit kann anfangs überwältigend wirken. So gehen Sie sie praktisch an: wo Sie anfangen, was Sie priorisieren und wie Sie ohne perfekte Ressourcen Fortschritte machen.

6 min read QualiBooth
Eine Person arbeitet an einem Laptop an einem aufgeräumten Schreibtisch mit einer Kaffeetasse und steht für konzentriertes, produktives Arbeiten.

Das Erste zum Verständnis: Sie müssen nicht alles auf einmal beheben

Wenn Organisationen zum ersten Mal auf WCAG 2.2 stoßen, ist die Reaktion oft eine Mischung aus echter Sorge und Überforderung. Es gibt 78 Erfolgskriterien über drei Konformitätsstufen. Die unterstützende Techniken-Dokumentation ist gewaltig. Automatische Scans liefern Listen mit Hunderten von Problemen. Es fühlt sich an, als müssten Sie alles anhalten und Monate an Entwicklungszeit aufwenden, bevor Sie auch nur daran denken könnten, Ihre Website barrierefrei zu nennen.

Dieses Gefühl ist verständlich, aber irreführend. Die Verbesserung der Barrierefreiheit ist kein binärer Zustand — barrierefrei oder nicht barrierefrei. Sie ist ein Spektrum, und bedeutsame Fortschritte sind von dort aus möglich, wo Sie gerade jetzt stehen, selbst wenn das „Wir haben darüber noch nie nachgedacht” ist.

Das Ziel dieses Leitfadens ist es, Ihnen den Anfang zu erleichtern.

Warum es normal ist, sich überfordert zu fühlen

Web-Barrierefreiheit wirkt groß, weil sie tatsächlich groß ist. WCAG umfasst die visuelle Darstellung (Kontrast, Textgröße, Abstände), auditive Inhalte (Untertitel, Transkripte), Interaktion (Tastaturnavigation, Timing, Bewegung), Semantik (Struktur, Beschriftungen, Rollen) und kognitive Aspekte (Sprache, Konsistenz, Fehlerbehebung). Sie gilt für Desktop, Mobilgeräte und assistive Technik. Sie betrifft Design, Inhalt, Entwicklung und Testen.

Doch das Folgende verändert das Bild: Die meisten Barrierefreiheitsfehler häufen sich um eine kleine Zahl von Mustern. Jahr für Jahr stellt der WebAIM-Million-Bericht (der die eine Million meistbesuchten Websites analysiert) fest, dass dieselben sechs Probleme für die überwältigende Mehrheit der automatisch erkennbaren WCAG-Fehler verantwortlich sind:

  1. Zu geringer Farbkontrast
  2. Fehlender Alternativtext bei Bildern
  3. Fehlende Beschriftungen von Formulareingaben
  4. Leere Links (Links ohne Text)
  5. Fehlende Angabe der Dokumentsprache
  6. Leere Schaltflächen (Schaltflächen ohne Text)

Diese sechs Muster allein sind auf über 95 % der getesteten Startseiten vorhanden. Sie auf Ihrer Website zu beheben, macht Sie nicht vollständig barrierefrei, beseitigt aber Barrieren, die die größte Zahl von Nutzenden mit Behinderung betreffen. Das ist ein sinnvoller Ausgangspunkt.

Schritt 1: Verstehen Sie Ihre aktuelle Position

Bevor Sie Behebungen priorisieren können, müssen Sie wissen, wo Sie stehen. Ein kostenloser automatischer Scan liefert Ihnen das in Minuten.

Automatische Werkzeuge sind keine vollständige Lösung für Barrierefreiheit — sie erfassen zuverlässig nur 30–40 % der WCAG-Fehler, weil die meisten Barrieren menschliches Urteilsvermögen zur Erkennung erfordern. Aber sie sind hervorragend darin, die oben aufgeführten häufigen, automatisierbaren Fehler zu finden: Kontrast, fehlenden Alternativtext, nicht beschriftete Eingaben und ähnliche strukturelle Probleme.

Führen Sie einen kostenlosen Scan Ihrer Website durch. Sehen Sie sich an, was zurückkommt. Die gemeldeten Probleme sind echt — bei den häufigen Mustern werden es keine Fehlalarme sein — und sie sind eine konkrete Ausgangsliste.

Schritt 2: Priorisieren Sie nach Wirkung, nicht nach Vollständigkeit

Sobald Sie eine Liste haben, ist die Versuchung groß, jeden Punkt der Reihe nach abzuarbeiten. Widerstehen Sie ihr. Priorisieren Sie stattdessen nach der Kombination aus Wirkung und Häufigkeit:

Höchste Wirkung (zuerst beheben):

  • Alle Barrieren in Ihrem Bezahl-, Registrierungs- oder primären Conversion-Ablauf — wenn Nutzende die Transaktion nicht abschließen können, kostet Sie der Barrierefreiheitsfehler Geschäft
  • Barrieren bei Anmeldung und Authentifizierung — wer nicht hineinkommt, kann nichts nutzen
  • Navigation — wenn Nutzende keine Seiten finden, spielt Barrierefreiheit auf Seitenebene keine Rolle

Hohe Wirkung (als Zweites beheben):

  • Kerninhaltsseiten: Produktseiten, Informationsseiten, die Inhalte, die Nutzende gezielt aufrufen
  • Formularfelder sowie deren Beschriftungen und Fehlermeldungen — Formulare sind der Ort, an dem Interaktion stattfindet
  • Kontrastfehler — diese betreffen eine sehr große Bevölkerungsgruppe und lassen sich meist unkompliziert beheben

Wichtig, aber weniger dringlich (später beheben):

  • Archivinhalte und ältere Seiten mit wenig Verkehr
  • Grenzfall-Interaktionen und WCAG-Kriterien, die kleinere Gruppen betreffen
  • Anforderungen der Stufe AAA (die über den gesetzlichen Standard hinausgehen)

Sie müssen keine perfekten Werte erzielen, bevor Ihre besucher- und conversionstärksten Seiten barrierefrei sind. Machen Sie diese zuerst richtig.

Schritt 3: Ergänzen Sie manuelle Tests für das, was die Automatisierung übersieht

Sobald Ihre automatisch gefundenen Probleme unter Kontrolle sind, ist die nächste Ebene das manuelle Testen. Hier finden Sie:

  • Fehler bei der Tastaturnavigation — können Nutzende ohne Maus durch Ihre gesamte Website tabben?
  • Probleme beim Fokusmanagement — wandert der Fokus nach dem Öffnen eines Modals in das Modal hinein? Kehrt er nach dem Schließen zurück?
  • Screenreader-Verhalten — kündigt Ihr eigenes Dropdown seinen Zustand an? Teilt Ihr Karussell mit, welche Folie aktiv ist?
  • Logische Lesereihenfolge — wenn Sie das CSS entfernen, ergibt die Seite dann noch Sinn?

Der schnellste Weg, mit dem manuellen Testen zu beginnen, ist:

  1. Ziehen Sie Ihre Maus ab und versuchen Sie, die primäre Nutzerreise Ihrer Website nur mit der Tastatur abzuschließen (Tab, Umschalt+Tab, Enter, Leertaste, Escape, Pfeiltasten). Notieren Sie alles, was bricht.

  2. Laden Sie einen kostenlosen Screenreader herunter (NVDA für Windows ist kostenlos; VoiceOver ist in Mac und iOS integriert). Navigieren Sie durch Ihre wichtigsten Seiten. Hören Sie zu, was angekündigt wird. Ist es verständlich?

  3. Nutzen Sie die Barrierefreiheitswerkzeuge des Browsers — sowohl Chrome als auch Firefox haben Barrierefreiheits-Inspektoren, die den Barrierefreiheitsbaum, die ARIA-Rollen und die berechneten zugänglichen Namen für jedes Element anzeigen.

Diese Tests brauchen Zeit zum Erlernen, kosten aber nichts, und sie finden Probleme, die kein automatisches Werkzeug findet.

Schritt 4: Verankern Sie sie in Ihrem Arbeitsablauf

Der teuerste Weg, Barrierefreiheit umzusetzen, ist, sie als einmalige Nachbesserung zu behandeln — die Website reparieren, den Sieg verkünden und dann zusehen, wie sich mit jeder neuen Funktionsveröffentlichung neue Barrieren ansammeln.

Nachhaltige Barrierefreiheit bedeutet, die Art, wie Sie arbeiten, zu verändern:

  • Design-Review — erfüllt das Design die Kontrastanforderungen? Sind interaktive Zustände sichtbar?
  • Entwicklung — werden native HTML-Elemente verwendet, wo möglich? Sind Formularfelder beschriftet? Haben eigene Komponenten korrektes ARIA?
  • Inhalt — hat jedes Bild einen passenden Alternativtext? Sind Links aussagekräftig?
  • Testen — blockiert die CI bei Barrierefreiheits-Regressionen? Gibt es einen manuellen Testschritt vor größeren Veröffentlichungen?

Unser Leitfaden zur Barrierefreiheit im Softwareentwicklungszyklus geht tiefer darauf ein, wie das in der Praxis aussieht. Unser Dienst zur CI/CD-Integration macht die automatisierte Ebene zu einem Teil jedes Builds.

Realistische Erwartungen setzen

Für eine Website, die nie auf Barrierefreiheit geprüft wurde, ist das Erreichen der WCAG-2.1-Konformität auf Stufe AA über jede Seite hinweg in der Regel ein mehrmonatiges Projekt — länger bei großen, komplexen Websites mit umfangreichem Altcode.

Das bedeutet nicht, dass Sie in den nächsten zwei Wochen keine bedeutsamen Fortschritte machen können. Die sechs häufigsten Probleme zu beheben, die ich oben aufgeführt habe, macht Ihre Website für eine beträchtliche Bevölkerungsgruppe spürbar barrierefreier, selbst wenn sie Sie noch nicht gesetzeskonform macht.

Der Rahmen, den ich am nützlichsten finde: Streben Sie kontinuierliche Verbesserung an statt Konformität als Endziel. Lösen Sie in jedem Sprint-Zyklus eine Reihe identifizierter Probleme. Führen Sie automatische Prüfungen bei neuen Funktionen durch, bevor sie ausgeliefert werden. Planen Sie vierteljährlich manuelle Tests. Erstellen Sie eine Barrierefreiheitserklärung, die Ihren aktuellen Stand und Ihren Fahrplan ehrlich widerspiegelt.

Organisationen, die es so angehen, machen tendenziell insgesamt schnellere Fortschritte als jene, die warten, bis sie ein vollständiges Nachbesserungsprojekt mit Ressourcen ausstatten können.

Wo Sie heute anfangen

Wenn Sie noch nichts getan haben: Führen Sie einen kostenlosen Scan durch. In zwei Minuten haben Sie eine echte Liste echter Probleme, nach Schweregrad priorisiert. Das ist Ihr Ausgangspunkt.

Wenn Sie Scans durchgeführt, aber noch nicht mit dem manuellen Testen begonnen haben: Probieren Sie heute den Tastatur-Test an Ihrem Bezahlablauf aus. Wenn Sie Barrieren finden, haben Sie Ihre nächste Priorität gefunden.

Wenn Sie manuell testen, es aber noch nicht in Ihren Arbeitsablauf integriert haben: Lesen Sie unseren Leitfaden zur Barrierefreiheit im Entwicklungsprozess und finden Sie einen Punkt in Ihrem aktuellen Arbeitsablauf, an dem eine Barrierefreiheitsprüfung ergänzt werden könnte.

Fortschritt schlägt Perfektion. Fangen Sie irgendwo an.

Beginnen Sie mit einem kostenlosen Scan, um Ihren Stand zu sehen