Kontrastrechner für Farben

Zur Feststellung der Konformität mit den Web Content Accessibility Guidelines ist es wichtig, die zutreffende Konformitätsstufe, das sogenannte Level, zu kennen:

In der Auswertung stoßen Sie auf die Einteilung in »normalen Text« und »großen Text«. Die WCAG legen in dem Kriterium 1.4.3 zwischen Text und Hintergrund ein bestimmtes Kontrastverhältnis fest, das abhängig von der Schriftgröße variiert. Das Ideal ist schwarze Schrift auf weißem Hintergrund oder umgekehrt. Aber selbst mit den strengsten Kritierien der WCAG bleibt ein großer Spielraum:

Etwas sperrig klingt der »Nicht-Text-Kontrast«. Er wird im Kriterium 1.4.11 der WCAG beschrieben und betrifft grafische Objekte und Teile der Bedienoberfläche:

Das Wichtigste zuerst: Die Version 3 der WCAG ist noch nicht veröffentlicht und noch weniger bereits Teil von Gesetzen oder Standards. Es ist noch nicht einmal der Zeitplan der Veröffentlichung veröffentlicht, jener ist für September 2025 angekündigt. Große Änderungen bezüglich der Farbkontraste gelten aber bereits als sehr wahrscheinlich.

Anstelle der Levels A, AA und AAA in WCAG 2.x führt WCAG 3.0 die Levels Bronze, Silver und Gold ein. Diese Levels repräsentieren unterschiedliche Stufen der Zugänglichkeit und bieten eine deutlichere und flexiblere Struktur für die Einhaltung der Richtlinien.

Der Algorithmus in den WCAG 2 berechnet den Kontrast recht simpel, indem er die Helligkeit der beiden Farben linear miteinander vergleicht. Aber eine um 20 Prozent reduzierte Helligkeit bedeutet nicht unbedingt, dass Menschen diese Farbe um 20 Prozent dunkler wahrnehmen. Aus der Kritik an den WCAG 2 heraus wurde der Accessible Perceptual Contrast Algorithm (APCA) entwickelt. Er liefert eine bessere Einschätzung der menschlichen Wahrnehmung. Dadurch sind Farbkombinationen konform, die in der Praxis gut funktionieren, mit WCAG 2 jedoch durchfallen – und umgekehrt:

Der APCA wurde für die WCAG 3 entwickelt und könnte also ein Nachfolger des Kontrastverhältnisses sein. Einige Fachleute empfehlen, den APCA heute schon zu berücksichtigen. Zum einen, weil er zum Standard werden könnte, zum anderen – und darum geht es –, weil er Barrieren besser vermeidet. Besonders empfiehlt es sich bei Gestalterungsmaterial wie einem Logo, das man später nicht so leicht ändern kann. Daher ist der APCA zur Berechnung des L^c (Lightness contrast) in diesem Kontrastrechner vorab integriert und prüft die Konformität mit der Stufe Silver.

Ungeachtet davon sollte die Konformität mit den WCAG 2 als Teil geltender Standards und Gesetze sichergestellt werden. Sich auf den unfertigen APCA bzw. die nicht finalen Grenzwerte zu verlassen könnte im schlimmsten Fall bewirken, dass man am Ende gar keine konforme Farbkombination hat. Bis dahin empfiehlt sich der APCA nur als zusätzlicher Check.

… dann muss es noch barrierefrei angewendet werden. Farben dürfen nicht der alleinige Informationsträger sein (WCAG-Kriterium 1.4.1). So werden in Bedienoberflächen oft die Farben Rot oder Grün verwendet, um valide oder invalide Formulareingaben zu markieren. Grundsätzlich ist es ratsam, semantisch-passende Farben einzusetzen. Aber ohne einer zusätzlichen, schriftlichen Meldung ist diese Information für Menschen mit einer Farbenfehlsichtigkeit schlimmstenfalls gar nicht wahrnehmbar. Diese Menschen haben Schwierigkeiten, rote und grüne Gestaltungselemente voneinander zu trennen. Das Gestaltungsmaterial kann mit verschiedenen Farbsehschwächen simuliert werden:

Auch gesunde Sehorgane reagieren auf Rot-Grün-Kontraste empfindlich. In selber Helligkeit der Farben kann ein Flimmern vor den Augen begünstigt werden. Komplementärkontraste sollten insgesamt mit Vorsicht eingesetzt werden, weil sie oft als unangenehm empfunden werden.