Kontrastprüfer.
Der Kontrastprüfer berechnet das WCAG-Verhältnis zweier Farben und sagt Ihnen, welche der vier Schwellen es erreicht.
Die Berechnung folgt der vom W3C definierten Formel für die relative Leuchtdichte: Jeder Farbkanal wird zunächst linearisiert und dann mit Koeffizienten gewichtet, die die Empfindlichkeit des menschlichen Auges für Grün abbilden. Das Ergebnis liegt zwischen 1:1 und 21:1 — den Extremen aus identischer Farbe und Schwarz auf Weiß.
Warum es vier verschiedene Schwellen gibt
WCAG nennt keine einzelne Zahl, denn Lesbarkeit hängt nicht allein von der Farbe ab. Für Text in normaler Größe liegt die AA-Schwelle bei 4,5:1; großer Text — 18,66 Pixel fett oder 24 Pixel normal — bleibt auch bei weniger Kontrast lesbar, hier gelten 3:1. Stufe AAA verschiebt dasselbe Paar auf 7:1 und 4,5:1.
Die vierte Schwelle betrifft nicht den Text, sondern die Oberfläche. Der Rand eines Formularfelds, ein Symbol, ein grafisches Element ist kein Text — aber was nicht sichtbar ist, lässt sich nicht bedienen; 1.4.11 Nicht-Text-Kontrast verlangt dafür 3:1. Dieses Kriterium wird am häufigsten übersehen, weil die meisten automatischen Prüfwerkzeuge nur Text durchsuchen.
Messen Sie das Gemessene, nicht das Gesehene
Das Urteil „sieht dunkel genug aus“ ist unzuverlässig: Die Helligkeitswahrnehmung verschiebt sich mit dem Bildschirm, dem Umgebungslicht und dem Auge. Im Aufbau dieser Website ergab die Messung genau das — der Rand eines Formularfelds kam auf 1,29:1, weit unter der Schwelle und zu unauffällig, um ihn mit bloßem Auge zu bemerken. Nach der Korrektur waren es 3,13:1, und der Wert wurde an einen Test in der Suite gebunden.
Die Berechnung dieses Werkzeugs ist dieselbe Funktion, die auch die Prüf-Suite dieser Website verwendet. Eine Berechnung, die an zwei Stellen unterschiedliche Ergebnisse liefert, würde eine von beiden zur Lüge machen; deshalb stammt die Formel aus einer einzigen Definition. Die Schritt-für-Schritt-Erklärung der Berechnung und was relative Leuchtdichte ist stehen getrennt geschrieben.
Was es nicht leistet
Das Werkzeug kann keine Seite durchsuchen; es misst nur die beiden Farben, die Sie eingeben. Eine Seitenprüfung erfordert die nach dem tatsächlichen Rendern berechneten Farben — Transparenz, überlagerte Ebenen und Text auf einem Bild verändern das Ergebnis. Für eine vollständige Prüfung nutzen Sie eine Browser-Erweiterung oder automatische Prüfwerkzeuge; auch deren Grenzen stehen getrennt geschrieben.
So wird es benutzt
- Geben Sie die Vordergrundfarbe als sechsstelligen Hexadezimalwert ein
- Geben Sie die Hintergrundfarbe ein
- Das Ergebnis aktualisiert sich sofort — jede der vier Schwellen wird einzeln markiert
Das Werkzeug läuft vollständig in Ihrem Browser — es werden keine Daten gesendet und keine Cookies gesetzt.