Dobieranie kolorów, które każdy może odczytać
Autor Zespół AsasWeb 1 min czytania
WCAG wymaga współczynnika kontrastu co najmniej 4,5:1 dla tekstu podstawowego i 3:1 dla dużego tekstu oraz elementów interfejsu. Niezawodny sposób, by trafić w te cele, to wbudować je w paletę od samego początku, wybrać ciemny atrament i jasne tło, które przechodzą z zapasem, a potem zweryfikować każdą parę kolorów narzędziem do badania kontrastu. Nigdy nie sygnalizuj niczego samym kolorem i sprawdzaj tryb ciemny osobno, bo paleta, która przechodzi na bieli, może polec na niemal czarnym tle.
Tekst o niskim kontraście wygląda elegancko w narzędziu projektowym, a znika w prawdziwym życiu: w słońcu, na tanim ekranie albo dla każdego z obniżonym wzrokiem. Dostępny kolor nie polega na przygaszaniu marki. Chodzi o to, by ludzie faktycznie mogli go odczytać.
Poznaj cele
WCAG wyznacza jasne minima. Tekst podstawowy potrzebuje współczynnika kontrastu co najmniej 4,5 do 1 względem tła. Duży tekst, od około 24 pikseli, oraz elementy interfejsu użytkownika potrzebują co najmniej 3 do 1. To podłogi, a nie cele, i łatwo je sprawdzić dowolnym narzędziem do kontrastu.
Wbuduj kontrast w paletę
Sztuczka polega na zaprojektowaniu palety wokół tych celów od początku, zamiast odkrywać niezgodności na końcu. Wybierz ciemny atrament i jasną powierzchnię, które przechodzą z zapasem, a następnie dobierz kolory akcentowe, które działają zarówno jako tekst, jak i wypełnienia. Na tej stronie każda para kolorów jest udokumentowana ze swoim zmierzonym współczynnikiem, więc nic nie umyka.
Nie polegaj na samym kolorze
Kolor nigdy nie powinien być jedynym sposobem sygnalizowania czegoś. Pole wymagane, błąd, link w akapicie: każdy potrzebuje drugiej wskazówki, takiej jak tekst, ikona lub podkreślenie. Ludzie, którzy nie postrzegają różnic kolorów, wciąż potrzebują tego komunikatu.
Pamiętaj o trybie ciemnym
Paleta, która przechodzi w trybie jasnym, może nie przejść w trybie ciemnym, gdzie kolor marki wyglądający dobrze na bieli może być zbyt przygaszony na powierzchni niemal czarnej. Każdy motyw potrzebuje własnych sprawdzonych wartości.
Traktujemy kontrast jako zmierzoną liczbę, a nie zgadywankę. Jeśli nie masz pewności, czy kolory Twojej marki przechodzą, rozpocznij projekt, a my je sprawdzimy i znajdziemy paletę, która jest zarówno spójna z marką, jak i czytelna.