Kontroler kontrastu kolorów

Luminancja to kanał, który zostaje zawsze

Kolor ma dwie składowe, na których projektant może się oprzeć: odcień i jasność. Dla całej publiczności wiarygodna jest tylko jedna z nich.

Rozróżnianie odcienia waha się ogromnie. Mniej więcej jeden mężczyzna na dwunastu ma zaburzenie czerwono-zielone, a dla niego różnica odcienia, która Państwu wydaje się oczywista, może nie nieść żadnej informacji. Rozróżnianie jasności jest znacznie bardziej jednolite. Osoba z zaburzeniem widzenia barw, osoba z obniżoną ostrością, osoba patrząca na wyblakły ekran telefonu w pełnym słońcu i osoba o całkowicie typowym wzroku — wszystkie postrzegają dużą różnicę jasności jako dużą różnicę.

Dlatego to właśnie współczynnik kontrastu jest nośną miarą dostępności. Mierzy relację jasności dwóch barw, całkowicie pomijając odcień, i o to dokładnie chodzi, bo pokazuje, co zostaje, gdy kanał odcienia jest niewiarygodny.

Współczynnik biegnie od 1:1, gdzie dwie barwy mają tę samą luminancję względną, a granica między nimi jest niewidoczna dla wszystkich, aż do 21:1 dla czystej czerni na czystej bieli. Obliczenie zdefiniowano w WCAG precyzyjnie: przeliczyć każdy kanał sRGB na światło liniowe, zważyć kanały według ich wkładu w postrzeganą luminancję, a następnie porównać wynik jaśniejszy z ciemniejszym.

Progi i to, co za nimi stoi

4,5:1 — tekst zwykły (WCAG AA). Podstawa dla tekstu głównego. Liczba wywodzi się z utraty wrażliwości na kontrast związanej z ostrością około 20/40, częstą u osób starszych, korygowalną, lecz często nieskorygowaną.

3:1 — tekst duży (WCAG AA). Obowiązuje od 18 punktów zwykłych albo 14 punktów pogrubionych. Większe znaki mają grubsze kreski, więc pozostają czytelne przy niższym kontraście.

3:1 — kontrast elementów nietekstowych (WCAG AA). Obejmuje komponenty interfejsu i grafikę niosącą znaczenie: obramowania pól, stany przełączników, wskaźniki fokusu, ikony przekazujące informację oraz istotne części wykresu. To kryterium pomija się najczęściej i zwykle właśnie na nim wizualnie elegancki, niskokontrastowy interfejs nie przechodzi audytu.

7:1 i 4,5:1 — tekst zwykły i duży (WCAG AAA). Poziom surowszy, wycelowany w ostrość około 20/80. Warto go przyjąć dla długiej lektury nawet wtedy, gdy nie jest wymagany.

Kontrast jest konieczny, lecz niewystarczający

Najczęstszy błąd w pracy nad dostępnymi paletami to uznanie zaliczonego współczynnika kontrastu za koniec pracy. Trzeba odpowiedzieć na dwa niezależne pytania:

1. Czy każda barwa jest czytelna na swoim tle? To kontrast i to sprawdzanie na niego odpowiada.
2. Czy barwy znaczące co innego są rozróżnialne między sobą? To rozdzielność odcieni, a współczynnik kontrastu nic o niej nie mówi.

Wykres z serią czerwoną i zieloną może przejść kontrast z zapasem, obie są ciemne na białym tle, a mimo to być zupełnie nieczytelny dla deuteranopa, bo obie serie są nieodróżnialne od siebie. Takie palety proszę przepuścić także przez symulator widzenia barw.

A zawsze, gdy kolor niesie znaczenie, proszę dodać drugą wskazówkę. Kryterium WCAG dotyczące użycia koloru tego wymaga, a technika G111 opisuje standardowe podejście: łączyć kolor z wzorem, kształtem, położeniem albo wyraźną etykietą. W praktyce oznacza to podpisywanie serii wykresu wprost zamiast legendy barwnej, ikonę obok czerwonego komunikatu o błędzie, podkreślenie odnośników w tekście oraz odróżnianie stanów powodzenia i błędu również kształtem.

Praca ze sprawdzaniem

Proszę podać barwę pierwszego planu i tła, a narzędzie poda współczynnik oraz spełnione progi. Kilka nawyków zwiększa jego użyteczność:

• Proszę sprawdzać rzeczywistą parę. Półprzezroczyste nakładki, gradienty i obrazy tła sprawiają, że faktycznym tłem nie jest barwa z arkusza stylów. Proszę pobrać próbkę z tego, co naprawdę się rysuje.
• Proszę sprawdzać oba motywy. Luminancja nie odwraca się czysto; paleta ciemna wymaga własnego przebiegu.
• W gradiencie proszę sprawdzać przypadek najgorszy, a nie średnią.
• Proszę uwzględniać stany wyłączenia i podpowiedzi. One także są czytane.
• Wskaźniki fokusu proszę sprawdzać na każdej powierzchni, na której się pojawiają. Pierścień fokusu spełniający 3:1 na bieli może zniknąć na karcie.

Szerszy obraz daje projektowanie z myślą o daltonizmie, które omawia budowę palet, oraz jak udostępnić wykresy, zajmujące się konkretnie wizualizacją danych.