Der Kontrast von Bedienelementen ist die Anforderung, dass Bedienelemente und die wichtigen Teile von Grafiken mindestens 3:1 gegen ihre Umgebung erreichen. Sie gilt für alles, was kein Text ist.
- Kontrast von Bedienelementen
Die Anforderung von 3:1 für Bedienelemente und für wichtige Teile von Grafiken.
Beispiel: „Der Kontrast von Bedienelementen ist verletzt, wenn der Rahmen des Eingabefelds auf Weiß kaum zu sehen ist.“Auch: Non-text Contrast, Kontrast ohne Text. Gemeint sind Ränder, Flächen, Symbole, Zustände und die Teile einer Grafik, ohne die sie nicht zu verstehen ist.
Abgrenzung zum Textkontrast: Für Text verlangt die WCAG 4,5:1 und für großen Text 3:1. Hier geht es um alles, was gar keinen Text enthält, und dort gilt 3:1 durchgehend.
Was das Kriterium verlangt
Erfolgskriterium 1.4.11 „Non-text Contrast“ steht auf Stufe AA und nennt zwei Gruppen: Bedienelemente samt der Information, die nötig ist, um sie und ihre Zustände zu erkennen, und Teile von Grafiken, die zum Verständnis gebraucht werden. Ausgenommen sind inaktive Elemente und solche, deren Aussehen der Browser bestimmt.
Gemessen wird gegen die angrenzende Farbe. Ein weißes Eingabefeld auf weißem Grund erfüllt die Anforderung über seinen Rahmen, und der Rahmen muss dafür dunkel genug sein.
Was darunter fällt
Der Rahmen eines Eingabefelds, der Umschalter in beiden Stellungen, das Häkchen im Kontrollfeld, der Fokusindikator, Symbole ohne Beschriftung, die Linien und Flächen eines Diagramms, die Trennlinie, über die eine Tabelle gelesen wird.
Nicht darunter fallen reine Zierelemente. Ein Verlauf im Hintergrund, ein Muster hinter dem Text und ein Bild, das nichts erklärt, müssen diesen Wert nicht erreichen.
Woran es scheitert
An hellgrauen Rahmen. Der gern genommene Ton #dddddd erreicht gegen Weiß 1,36:1 und liegt damit weit unter der Anforderung. Der hellste Grauton, der auf Weiß noch 3:1 schafft, ist etwa #959595, und das wirkt neben einer zurückhaltenden Gestaltung schon dunkel.
Aus unserer Arbeit an über 2.500 Website-Projekten ist das der Punkt, an dem Gestaltung und Anforderung am häufigsten aneinandergeraten. Wer den Rahmen nicht dunkler haben möchte, löst es über eine Füllung: Ein leicht getöntes Feld auf weißem Grund erreicht den Wert über die Fläche statt über die Linie.