Hintergrundwissen Farben barrierefrei einsetzen
-
Anspruch:
-
Aufwand:
- Zielgruppe: Entwicklung
Der Einsatz von Farben kann das Verständnis und die Orientierung in komplexen Oberflächen von Anwendungen wie Apps, Software oder Web-Anwendungen erleichtern oder sogar unterstützen. Beispiele für gelungene Farbwahl:
- Informationen können in roter Farbe mehr Aufmerksamkeit im Sinne von „Achtung“ oder „Fehler“ erhalten.
- Es kann mit dem Einsatz von grüner Farbe vermittelt werden, dass alles in Ordnung ist und keine falschen Eingaben vorliegen.
- Auch die Gruppierung oder schnelle Wiedererkennung von Bereichen sind durch konsequenten Farbeinsatz möglich.
Damit die Nutzung digitaler Anwendungen für Personen ohne Sehvermögen beziehungsweise ohne Farbwahrnehmung möglich ist, sollten Informationen nicht ausschließlich über Farben vermittelt werden.
Bei der Nutzung ohne Sehvermögen werden die Inhalte per Brailleschrift beziehungsweise Sprachausgabe wahrgenommen. Wenn also zum Beispiel ein Eingabefeld in einem Formular, in dem eine Eingabe korrigiert werden soll oder fehlt, rot hervorgehoben ist, geht diese Information bei der Ausgabe in Braille oder per Sprache für blinde Menschen verloren. Zusätzlich zu dieser visuellen farblichen Hervorhebung müssen also auch immer semantische Informationen verfügbar sein, die auf einem anderen Kanal, wie per Sprachausgabe, auditiv wahrgenommen werden können.
Bei der Nutzung ohne Farbwahrnehmung können je nach Art der Farbfehlsichtigkeit bestimmte Farben nicht voneinander unterschieden werden. Die Farbwahl eines digitalen Angebots kann dies bereits berücksichtigen. Entsprechende Simulatoren, mit denen die geplante Farbauswahl geprüft werden kann, sind verfügbar und können von Designern und Redakteuren leicht eingesetzt werden.
Weitere Informationen zu Farbfehlsichtigkeit und Farbwahrnehmung:
- Englischsprachiger Artikel über Farbenblindheit (Color-blindness) von WebAim, Institute for Disability Research, Policy, and Practice
- Informationen zu Sehtest-Tafeln
- Hintergrundinformationen zu Farbenblindheit (Achromasie)
- Achromatopsie Selbsthilfe e.V.
- Kostenfreies englischsprachiges E-Book zu Farbfehlsichtigkeit: „Color Blind Essentials“
- Frei verfügbares E-Book: „Webdesign“, Kapitel: „Farbe im Webdesign“
- Beispiele zum „Color Coding“ (in englischer Sprache)
Farben sind ein wichtiges Mittel bei der Gestaltung von Webseiten, Software-Oberflächen oder Apps. Neben ästhetischen Aspekten haben die Farben auch Wirkungen auf die Nutzerführung und die Gebrauchstauglichkeit. Farben können die Barrierefreiheit im Bereich der Verständlichkeit stark verbessern.
Sie sollten Farben immer mit weiteren Darstellungsoptionen kombinieren. Die Möglichkeiten sind so vielfältig, dass hier nur eine Auswahl aufgezeigt werden kann:
- Farbige Links können zusätzlich unterstrichen werden.
- Andere farbige Texte oder Seitenbereiche können zusätzlich eingerahmt, größer, fett oder kursiv dargestellt werden.
- Farbige Zuordnungen in Diagrammen können durch Muster oder Beschriftungen unterstützt werden.
- Farbige Symbole werden durch Formen eindeutig.
Die Anforderungen an die digitale Barrierefreiheit sind je nach Art der digitalen Anwendung und Anbieter in verschiedenen Standards und Richtlinien geregelt:
- Die für Behörden des Bundes verbindliche Barrierefreie-Informationstechnik-Verordnung (BITV) 2.0 verweist in Deutschland beispielsweise auf die EN 301 549, die die Barrierefreiheit von IKT-Produkten und -Dienstleistungen regelt (Technik und Angebote im Bereich der Information und Kommunikation).
- Auch im Online-Zugangsgesetz wird Barrierefreiheit für die eGovernment-Anwendungen gefordert.
- Für private Anbieter regelt unter anderem das Barrierefreiheitsstärkungsgesetz die Anforderungen an ausgewählte barrierefreie Produkte und Dienstleistungen.
Für Hardware ist beispielsweise in der EN 301 549 (Version 3.2.1) in Bezug auf Farbe Folgendes geregelt:
Für den Fall, dass es sich um eine Webseite, App, Software oder sonstiges digitales Dokument handelt, verweist die EN 301 549 auf die „Web Content Accessibility Guidelines (WCAG) 2.1“:
In diesem Fall kann die Übersetzung der früheren Version WCAG 2.0 herangezogen werden:
Hier ist es also wichtig auf das Mehr-Kanal-Prinzip beziehungsweise 2-Sinne-Prinzip zu setzen und die Informationen immer noch einmal auf einem anderen Weg verfügbar zu machen. Auf welchen Wegen dies technisch erreicht werden kann, dazu liefern die folgenden Dokumente weitere Unterstützung:
- WCAG 2.0, Benutzung von Farbe: Erfolgskriterium 1.4.1 verstehen
- WCAG 2.1, Use of Color: Understanding Success Criterion 1.4.1
- Schnellreferenz der Techniken zur Umsetzung der WCAG 2.1, Erfolgskriterium 1.4.1
Neben der Bereitstellung der Informationen auf verschiedenen Wegen ist es bei Software, die eine Benutzungsschnittstelle bereitstellt ebenso wie bei Webseiten wichtig, dass diese die bevorzugten Benutzerpräferenzen der Nutzenden berücksichtigen (vgl. EN 301 549 Anforderung 11.7). Diese Benutzerpräferenzen lassen sich von den Nutzenden hier einstellen:
- bei Webseiten im Browser und
- bei der Nutzung von Software im Betriebssystem.
Um die eigene digitale Anwendung auf eine barrierefreie Farbverwendung zu überprüfen, können Usertests sinnvoll sein. Ist dies nicht möglich, können Simulatoren und Hilfsmittel eingesetzt werden, um Ihnen einen ersten Eindruck zu verschaffen.
Weiterführende Informationen:
Über ein Hilfsmittel lässt es sich nur schwer korrigieren, wenn Informationen ausschließlich visuell per Farbe vermittelt sind, und die Entwickler*innen eines digitalen Angebots diese Funktion nicht vorgesehen haben.
Optimal ist es, wenn die Anwendung oder Webseite den Nutzenden erlaubt, eigene Farben für bestimmte Elemente zu verwenden, also die bevorzugten Benutzerpräferenzen der Nutzenden berücksichtigt.
- Hilfe zum Browser Firefox zum Ignorieren beziehungsweise Auswählen eigener Farben statt der auf der Webseite verwendeten Farben
- Hilfe zum Ändern von Farben im Betriebssystem Microsoft Windows 11
- Hilfe für die Einstellungen unter iOS zum Beispiel Farbfilter auf dem iPhone
Sogenannte Overlay-Tools versuchen solche nachträglichen Reparaturen auf Seite der Nutzenden für Webseiten durchzuführen. Die Arbeitsweise dieser Overlay-Tools ist dabei aktuell sehr umstritten, da sie möglicherweise neue Barrieren schaffen.
Weiterführende Informationen:
