Standards · WCAG 2.2

SC 1.4.1 Stufe A WCAG 2.0

Verwendung von Farbe

Farbe darf nicht das einzige Mittel sein, um Informationen zu vermitteln. Pflichtfelder, Fehlerzustände, Linkhervorhebungen und Diagrammreihen benötigen jeweils einen zweiten Hinweis (Text, Symbol, Unterstreichung, Muster), damit farbenblinde Nutzende dieselben Informationen erhalten.

Was gefordert wird

Wann immer die Bedeutung eines UI-Elements von seiner Farbe abhängt — eine rote Fehlermeldung, ein grüner „Verfügbar“-Punkt, ein blauer Link in Fließtext, eine farbige Linie in einem Diagramm — muss diese Bedeutung zusätzlich durch etwas anderes als Farbe vermittelt werden. Das Erfolgskriterium verbietet keine Farbe, sondern ausschließlich Farbe als einziges Mittel. Etwa einer von zwölf Männern und eine von zweihundert Frauen hat eine Form von Farbfehlsichtigkeit; hinzu kommen monochrome Ausdrucke, dunkle Bildschirme und stark beleuchtete Umgebungen, in denen Farbunterschiede regelmäßig verloren gehen.

Wie es erfüllt wird

  • Links innerhalb von Textabsätzen unterstreichen. Eine abweichende Farbe allein genügt nicht — dies ist der klassische 1.4.1-Fehler.
  • Jeden Statusindikator durch Farbe und Beschriftung oder Symbol kombinieren: Rot mit dem Text „Fehler“, Grün mit einem Häkchen, Gelb mit einem Warndreieck.
  • Pflichtfelder im Formular sowohl durch Farbe (roter Stern) als auch durch einen Texthinweis kennzeichnen (z. B. „Pflichtfeld“).
  • In Diagrammen unterschiedliche Linienstile (durchgehend, gestrichelt, gepunktet) oder Datenpunkt-Symbole verwenden, nicht nur Farben.
  • Status-Indikatoren wie „Verfügbar / Beschäftigt / Abwesend“ durch Farbe und Symbolform kombinieren (ausgefüllter Kreis, leerer Kreis, Strich).
  • Bei der Formularvalidierung muss der Ungültig-Zustand neben dem roten Rahmen auch eine Fehlermeldung enthalten.

Häufige Fehler

  • Links in Fließtext, die sich nur durch einen leicht anderen Blauton unterscheiden, ohne Unterstreichung. Rot-Grün-farbenblinde Nutzende erkennen keinen Unterschied.
  • Pflichtfeld-Sternchen in Rot ohne aria-required und ohne „Pflichtfeld“-Beschriftung.
  • Diagramme mit fünf Reihen, die nur durch Farbe unterschieden werden — beim Schwarzweißdruck sind die Linien nicht mehr auseinanderzuhalten.
  • Fehlerzustände, die nur durch einen roten Rahmen angezeigt werden, ohne begleitenden Fehlertext.
  • „Online / Offline“-Indikatoren, die ausschließlich die Farbe ändern, ohne Form- oder Beschriftungswechsel.
  • Kreisdiagramme mit ähnlichen Helligkeitsstufen, die in der Legende nur durch Farbe beschriftet sind.

Warum es wichtig ist

Dies ist der am häufigsten genannte 1.4.x-Fehler und einer der am einfachsten zur Designzeit behebbar — eine Unterstreichung hinzufügen, ein Symbol hinzufügen, eine Beschriftung hinzufügen. Nachträgliche Korrekturen sind schwieriger, weil die Markenpalette oft auf farbbasierter Signalisierung aufgebaut ist. Die Qualibooth-, axe- und Lighthouse-Regeln können dies nicht immer automatisch erkennen, weshalb es bei der manuellen Überprüfung auftaucht.