)
Ab Mitte 2025 gilt offiziell das Barrierefreiheitsstärkungsgesetz (BFSG). Damit müssen noch mehr Anbieter ein barrierearmes Web sicherstellen. Wenn Sie einen Web-App anbieten, bestimmte technische Produkte vertreiben oder andere elektronische Dienstleistungen, die einen Vertragsabschluss ermöglichen, bereitstellen - dann gilt das Gesetz auch für Sie. Zur optimalen Umsetzung einer barrierearmen Web-App wird im Gesetz konkret auf die WCAG verwiesen.
Was sind die WCAG?
Die „Web Content Accessibility Guidelines“ (WCAG) sind ein internationaler Standard zur barrierefreien Gestaltung von Web-Apps und Webseiten. Festgehalten werden sie vom World Wide Web Consortium (W3C). Das W3C ist ein Gremium zur Standardisierung von Techniken auf Web-Apps und Webseiten, z.B. HTML, XML und SVG. Die WCAG sind über mehrere Ebenen aufgeteilt und informieren damit detailliert zu Bereichen wie Prinzipien der Barrierefreiheit.
Dazu gehören auch „Wahrnehmbarkeit“ und „Verständlichkeit“. Zu einer optimalen Wahrnehmbarkeit einer Web-App gehören zum Beispiel Text-Alternativen für Bilder und zur optimalen Verständlichkeit gehören zum Beispiel Hilfestellungen, um (Eingabe-)Fehler zu vermeiden. Aus den Prinzipien leiten sich Richtlinien ab, sodass sie für Sie und Ihr Web-App Entwicklungsteam besser nachvollziehbar sind. Die WCAG bieten weiterhin Erfolgskriterien an. Damit können Sie testen, ob Ihre Web-App oder Webseite diese Richtlinien erfüllt. Konkrete Techniken werden ebenso mitgegeben wie Hinweise zur Erfüllung dieser Richtlinien.
Was sind die WCAG Levels A, AA & AAA?
Jedes Erfolgskriterium wird nämlich einer Konformitätsstufe zugeordnet: Dabei wird zwischen A, AA und AAA unterschieden. Mit dem BFSG sind die Stufen A und AA relevant für Ihre Web-App oder Webseite. Das sind die weniger strengen Stufen. Als konkretes Beispiel: Für die höchste Stufe AAA muss jede Seite ein Video enthalten, die den angezeigten Inhalt zusätzlich über Gebärdensprache bereitstellt. Das ist natürlich eine Anforderung, die in nur sehr konkretem Kontext sinnvoll einzufordern ist.
Was bedeuten die WCAG für meine Web-App?
Zur Konformitätsstufe A gehört ein bedachter Einsatz von Farben in Ihrer Web-App oder auf Ihrer Webseite. Farben dürfen nie der alleinige Indikator für einen Status sein. Fast 10% aller Männer haben eine Farbsehschwäche, wodurch allein die Schwierigkeit zwei Farbwerte auseinander zu halten schon dafür sorgen kann, dass eine Information nicht zugänglich ist. Oft sind die Farben vom Corporate Design vorgegeben. Beim Umsetzen des Corporate Designs auf Ihrer Webseite oder Web-App sollte also ermöglicht werden, dass Sie neben dem Farbeinsatz auch zum Beispiel Ikonografie oder alternative Visualisierungsmöglichkeiten nutzen dürfen.
Welche strengeren WCAG Kriterien gelten für Web-Apps und Webseiten?
Zur Konformitätsstufe AA gehören unter anderem strengere Kontrastverhältnisse bei der Farbnutzung. Auch hier müssen Sie Ihr Corporate Design prüfen. Gegebenenfalls macht es Sinn, zu Ihren Farbwerten Abstufungen hinzuzufügen, die zu bestimmten Hintergrundfarben einen stärkeren Kontrast ermöglichen. Sie können zum Beispiel prüfen, ob Ihre Sekundärfarbe auf Weiß und auf Schwarz einen ausreichenden Kontrast bildet. Testen können Sie das über Online-Tools wie whocanuse.com.
Wenn Sie erkennen, dass Ihr Farbwert nur auf Weiß genug Kontrast bildet, könnten Sie einen zusätzlichen, helleren Farbwert von Ihrer Sekundärfarbe ableiten. Dieser hellere Farbwert bietet einen stärkeren Kontrast auf Schwarz und entspricht damit dann dem WCAG-Erfolgskriterium AA.
Ein anderes wichtiges Kriterium: Der Fokus muss deutlich markiert sein. Farbe allein reicht nicht. Wenn Ihre Webseiten-Nutzer:innen keine Maus, sondern eine Tastatur zur Navigation oder eine assistive Technologie nutzen, die aber wiederum die Tastaturnavigation triggert, dann muss die „Mausposition“ alternativ sichtbar sein. Das kann zum Beispiel eine dicke Umrandung des interaktiven Elements (wie eines Buttons) sein.
Wenn Sie Wert auf ein sauberes UX Writing legen, werden Sie das nächsten Kriterium vermutlich schon berücksichtigen: Das Wording sollte konsistent sein, damit Ihre Nutzer:innen den gleichen Kontext und die gleiche Aktion auch an anderer Stelle wieder erkennen können. Das ist für Barrierearmut sinnvoll, um im Designprozess kognitive Beeinträchtigungen zu bedenken, aber auch für alle anderen Ihrer Nutzer:innen, weil die Nutzungsführung in Ihrer Webseite und Ihrer Web-App damit fließender ist.
Überprüfen Sie die WCAG Levels in Ihrer Web-App!
Im Rahmen der Beispiele konnten wir sehen, dass Sie Ihr Corporate Design so einige Male hinzuziehen müssen, wenn Sie Ihr Produkt auf Barrierearmut anpassen. Ihr Corporate Design wird vermutlich aktualisiert werden müssen und ein Kapitel explizit zum Thema ist mit Sicherheit sinnvoll, um Designentscheidungen festzuhalten. Die WCAG sind oft allgemein gehalten, weil es am Ende immer auf Ihren individuellen Kontext ankommt. Die individuellen Argumente für Ihr aktuelles Design sollte also durch Ihr Design- und Enwticklungsteam festgehalten werden.
Wenn Sie Unterstützung brauchen und von externen Erfahrungswerten profitieren wollen, können Sie uns übrigens gerne kontaktieren.
