Nigdy nie polegaj wyłącznie na kolorze

Dla wielu użytkowników wybrana przez Ciebie czerwień i zieleń wyglądają niemal tak samo. Używanie samego koloru do przekazywania znaczenia pozostawia ich bez pewności.

Około 1 na 12 mężczyzn doświadcza pewnej formy ślepoty barw. To duża część odbiorców, a nie rzadki przypadek brzegowy.

Klasycznym błędem jest czerwony błąd i zielony sukces, które dla wielu użytkowników wyglądają identycznie. Pomyłki dotyczące czerwieni i zieleni są zdecydowanie najczęstsze.

Kryterium 1.4.1 WCAG mówi, że kolor nigdy nie może być jedynym sposobem przekazywania informacji. Zawsze należy wesprzeć go drugim sygnałem.

Najprostszym rozwiązaniem są słowa. Połącz czerwone pole z etykietą „Błąd”, aby znaczenie pozostało jasne nawet wtedy, gdy kolor nie jest rozpoznawalny.

Znacznik wyboru, trójkąt ostrzegawczy lub X przekazują znaczenie za pomocą kształtu. Dzięki temu sukces i błąd różnią się nawet w skali szarości.

Niebieski link w szarym akapicie może być dla niektórych użytkowników niewidoczny. Dodaj podkreślenie, aby linki były oczywiste bez polegania na kolorze.

Wykresy rozróżniające serie wyłącznie za pomocą kolorów są pułapką. Dodaj do każdej linii lub części wzory, etykiety bezpośrednie albo różne kształty.

Nie oznaczaj błędnego pola wyłącznie czerwoną obwódką. Dodaj tekstowy komunikat o błędzie oraz ikonę, aby każdy wiedział, co się nie udało.

Szybki test intuicyjny: wyświetl projekt w skali szarości. Jeśli nadal potrafisz odróżnić stany i linki, nie polegasz wyłącznie na kolorze.

Zachowanie podkreślenia sprawia, że odnośniki są czytelne także dla użytkowników, którzy nie dostrzegają różnicy kolorów.

Nauczyli się Państwo, aby nigdy nie używać koloru jako jedynego sygnału: należy dodawać tekst, ikony, kształty lub podkreślenia, aby znaczenie było dostępne dla każdego. Następny temat: sprawdzanie kontrastu za pomocą narzędzi. 🌈