1.4.1 Użycie koloru - poziom A
Kolor nie jest wykorzystywany jako jedyny wizualny sposób przekazywania informacji, wskazywania czynności do wykonania lub oczekiwania na odpowiedź, czy też wyróżniania elementów wizualnych.
O co tu chodzi w praktyce?
Jeśli jedyną wskazówką jest kolor, to część osób po prostu jej nie zauważy albo zinterpretuje inaczej. Dlatego informacja ma być dostępna również „bez koloru”, czyli przez coś dodatkowego: tekst, ikonę, wzór, podkreślenie, etykietę, komunikat.
W dokumentacji W3C to kryterium jest opisywane właśnie jako zasada: kolor może pomagać, ale nie może być jedynym nośnikiem znaczenia.
Gdzie to najczęściej się psuje?
Najczęstsze przypadki:
- W formularzu: pole z błędem jest tylko na czerwono, a użytkownik nie dostaje żadnej informacji tekstowej, co jest nie tak i gdzie.
- W formularzu: pola wymagane są oznaczone tylko kolorem (np. czerwony opis), bez jasnego oznaczenia w tekście.
- W treści: linki różnią się od zwykłego tekstu tylko kolorem.
- W wykresie lub legendzie: serie danych różnią się wyłącznie kolorem, bez wzorów, opisów albo innych rozróżników.
Jak pisać i publikować, żeby spełnić 1.4.1?
Najprościej: zostaw kolor jako wsparcie, ale dodaj drugi sygnał.
- Jeśli coś jest błędem, dodaj komunikat tekstowy przy polu (a nie tylko czerwoną ramkę).
- Jeśli coś jest wymagane, oznacz to również tekstowo (np. informacją wymagane).
- Jeśli coś jest linkiem w tekście, zadbaj, żeby był rozpoznawalny także bez koloru (często rozwiązuje to podkreślenie).
- Jeśli masz wykres, dopilnuj, żeby dało się rozróżnić elementy bez patrzenia na barwy (np. wzory, opisy, wartości).
Jak to szybko sprawdzić?
Najprostszy test jest bez narzędzi: przejrzyj stronę i zadaj sobie pytanie, czy użytkownik zrozumie komunikat, rozpozna link, odczyta błąd i rozróżni elementy jeśli nie widzi różnic kolorystycznych. Jeśli nie, to niespełnione kryterium 1.4.1. :(
Pełny tekst kryterium 1.4.1 Użycie koloru
Kolor nie jest wykorzystywany jako jedyny wizualny sposób przekazywania informacji, wskazywania czynności do wykonania lub oczekiwania na odpowiedź, czy też wyróżniania elementów wizualnych.
Źródło: https://www.w3.org/Translations/WCAG21-pl/#uzycie-koloru