WCAG 3.2.5: Zmiana na żądanie
WCAG 3.2.5 Zmiana na żądanie (AA)
Wprowadzenie
Kryterium sukcesu WCAG 3.2.5 „Zmiana na żądanie” jest kluczowe dla zapewnienia przewidywalności i kontroli użytkownika nad interfejsem. Wymaga, aby wszelkie zmiany kontekstu na stronie internetowej, takie jak otwarcie nowego okna, przejście na nową stronę, znacząca zmiana układu treści czy przesunięcie fokusu, były inicjowane wyłącznie przez użytkownika. Oznacza to, że działania te nie powinny następować automatycznie, bez wyraźnej interakcji ze strony użytkownika. Jeżeli jednak takie zmiany muszą nastąpić automatycznie, strona musi oferować mechanizm, który pozwala użytkownikowi je wyłączyć lub kontrolować.
Celem tego kryterium jest zapobieganie dezorientacji i utracie kontroli przez użytkowników, którzy mogą mieć trudności z przetwarzaniem informacji, śledzeniem szybkich zmian lub precyzyjnym sterowaniem urządzeniami wskazującymi.
Dlaczego to jest ważne?
Automatyczne zmiany kontekstu mogą stwarzać znaczące bariery dostępności dla wielu grup użytkowników:
- Użytkownicy z niepełnosprawnościami poznawczymi: Nagłe zmiany kontekstu, takie jak automatyczne odświeżanie strony, przekierowania, czy wyskakujące okna, mogą być niezwykle dezorientujące. Mogą prowadzić do utraty orientacji, frustracji i niemożności ukończenia zadania. Użytkownicy ci potrzebują przewidywalnego środowiska, w którym to oni kontrolują przepływ informacji.
- Użytkownicy z niepełnosprawnościami ruchowymi: Osoby, które korzystają z alternatywnych metod wprowadzania danych (np. klawiatury, przełączników) lub mają trudności z precyzyjnym sterowaniem myszką, mogą przypadkowo aktywować elementy interfejsu, jeśli strona nagle się zmieni. Nagłe zmiany kontekstu mogą prowadzić do niechcianych akcji lub utraty bieżącego miejsca pracy.
- Użytkownicy czytników ekranu: Gdy kontekst strony zmienia się automatycznie, czytniki ekranu mogą nie nadążać za tymi zmianami, co prowadzi do niezrozumiałych komunikatów lub utraty fokusu użytkownika. Mogą również nie być w stanie poprawnie zinterpretować nowej treści, co uniemożliwia użytkownikowi zrozumienie, co się stało.
- Użytkownicy z niską wizją: Nagłe zmiany treści lub układu mogą sprawić, że osoby z niską wizją zgubią punkt orientacyjny na stronie i będą miały trudności ze znalezieniem miejsca, w którym się znajdowały przed zmianą.
- Ogólna przewidywalność: Zapewnienie, że zmiany kontekstu są inicjowane przez użytkownika, zwiększa ogólną przewidywalność interfejsu, co korzystnie wpływa na komfort i efektywność korzystania z serwisu dla wszystkich.
Wymagania kryterium sukcesu 3.2.5
Pełna treść kryterium sukcesu 3.2.5 (poziom AA) brzmi:
„Zmiany kontekstu są inicjowane tylko przez żądanie użytkownika, lub dostępny jest mechanizm wyłączający takie zmiany.”
Zmiana kontekstu w tym przypadku oznacza znaczącą zmianę treści na stronie internetowej, która może dezorientować użytkownika, jeśli nie jest przez niego inicjowana. Przykłady obejmują:
- Otworzenie nowego okna lub wyskakującego okienka.
- Przejście fokusu na inny element (jeśli nie jest to wynikiem działania użytkownika).
- Przekierowanie na inną stronę (np. po upływie określonego czasu).
- Znacząca reorganizacja całej treści strony lub zmiana jej głównego celu.
Nie każda zmiana treści jest zmianą kontekstu. Na przykład, zmiana pojedynczego elementu na stronie, takiego jak zaktualizowanie licznika lub wyświetlenie komunikatu o błędzie, zazwyczaj nie jest traktowana jako zmiana kontekstu, chyba że znacząco zmienia ogólny sens lub funkcjonalność strony.
Praktyczne wytyczne dla zapewnienia zgodności
-
Formularze: Po przesłaniu formularza, strona powinna albo odświeżyć się z komunikatem potwierdzającym (na tej samej stronie), albo przekierować użytkownika na stronę z potwierdzeniem lub wynikiem, ale tylko po wyraźnej akcji użytkownika (np. kliknięcie przycisku „Wyślij”). Nigdy nie przesyłaj formularza automatycznie po zmianie wartości w polu (np. w rozwijanej liście
<select>
). -
Linki i nawigacja: Unikaj automatycznego otwierania nowych okien lub kart przeglądarki. Jeśli link musi otworzyć nowe okno, poinformuj o tym użytkownika z wyprzedzeniem (np. poprzez tekst „(otwiera się w nowej karcie)” lub odpowiednią ikonę i atrybut
aria-label
dla czytników ekranu). Użycietarget="_blank"
bez ostrzeżenia jest niezgodne z tym kryterium, ponieważ użytkownik nie spodziewa się zmiany okna/karty. -
Automatyczne przekierowania/odświeżanie: Unikaj używania
<meta http-equiv="refresh">
do automatycznego przekierowywania użytkowników na inne strony po określonym czasie. Jeśli jest to absolutnie konieczne, zapewnij użytkownikowi mechanizm do wstrzymania, wyłączenia lub kontrolowania tego procesu. - Wyskakujące okna (modale): Okna modalne lub pop-upy powinny pojawiać się tylko w odpowiedzi na wyraźne działanie użytkownika (np. kliknięcie przycisku). Nie powinny pojawiać się automatycznie po załadowaniu strony lub bez interakcji.
-
Zmiany treści dynamicznej: Treści, które zmieniają się dynamicznie na stronie (np. aktualizacja wyników wyszukiwania, zawartość koszyka zakupowego), są dopuszczalne, o ile nie stanowią „zmiany kontekstu” (tj. nie przekierowują, nie zmieniają fokusu bez interakcji, ani nie zmieniają głównego celu strony). Jeśli zmiany są znaczące, ale nie zmieniają kontekstu, rozważ użycie atrybutu
aria-live
, aby powiadomić czytniki ekranu o aktualizacji. - Karuzele i slidery: Karuzele, które automatycznie przewijają slajdy, mogą być akceptowalne, o ile nie zmieniają fokusu i nie wymagają interakcji użytkownika do ich zatrzymania lub kontrolowania. Zawsze jednak zaleca się zapewnienie przycisków kontrolnych (np. „Następny”, „Poprzedni”, „Pauza”), aby użytkownik mógł wstrzymać automatyczne przewijanie.
Przykłady implementacji
Poprawne (Correct)
Formularz z ręcznym przesyłaniem
Użytkownik klika przycisk „Wyślij”, aby wysłać formularz. Po przesłaniu, strona zostaje odświeżona lub użytkownik jest przekierowywany na stronę potwierdzenia.
Link otwierający w nowej karcie z ostrzeżeniem
Użytkownik jest wyraźnie poinformowany, że link otworzy nową kartę.
Przeczytaj więcej o Wytycznych dla dostępności treści internetowych (WCAG).
Dynamiczna zmiana treści na żądanie
Treść jest ukryta, dopóki użytkownik nie kliknie przycisku, aby ją wyświetlić.
Niepoprawne (Incorrect)
Automatyczne przekierowanie po czasie
Strona automatycznie przekierowuje użytkownika na inną stronę po 5 sekundach, bez jego interakcji i bez możliwości wyłączenia.
Za 5 sekund zostaniesz przekierowany na nową stronę…
Automatyczne przesyłanie formularza po zmianie wartości
Wybranie opcji z listy rozwijanej automatycznie przesyła formularz, bez konieczności kliknięcia przycisku „Wyślij”.
Link otwierający nowe okno bez ostrzeżenia
Link otwiera nowe okno lub kartę, nie informując o tym użytkownika.
Odwiedź Google.
Akcja wyzwalana najechaniem myszą (onmouseover)
Najechaniu myszą na element powoduje zmianę kontekstu (np. przejście na inną stronę), co jest nieprzewidywalne i problematyczne dla użytkowników klawiatury.
Najlepsze praktyki i często popełniane błędy
Dobre praktyki
- Interakcja użytkownika jest kluczem: Zawsze stawiaj na to, aby każda istotna zmiana kontekstu była wynikiem wyraźnej interakcji użytkownika, takiej jak kliknięcie, naciśnięcie klawisza Enter lub spacji na elemencie interaktywnym.
- Jasne komunikaty: Jeśli musisz otworzyć nową kartę lub okno, wyraźnie o tym poinformuj użytkownika za pomocą tekstu (np. „(otwiera się w nowej karcie)” ) lub wizualnej ikony uzupełnionej o odpowiednie atrybuty
aria-label
dla czytników ekranu. - Oferuj kontrolę: Dla wszelkich automatycznie zmieniających się elementów, które nie są 'zmianą kontekstu’, ale mogą być uciążliwe (np. karuzele), zawsze zapewnij mechanizmy kontroli, takie jak przycisk pauzy, nawigacji czy zatrzymania.
- Testuj z różnymi użytkownikami: Regularnie testuj swoją stronę z osobami korzystającymi z czytników ekranu, nawigacji klawiaturą oraz osobami z różnymi niepełnosprawnościami poznawczymi, aby upewnić się, że żadne automatyczne zmiany nie są dla nich problematyczne.
Częste błędy
- Automatyczne przekierowania: Użycie
<meta http-equiv="refresh">
do automatycznego przenoszenia użytkowników na inną stronę. - Automatyczne przesyłanie formularzy: Konfigurowanie formularzy tak, aby przesyłały się automatycznie po zmianie wartości pola (np. po wybraniu opcji z listy rozwijanej
<select>
). - Wyskakujące okna bez żądania: Wyświetlanie wyskakujących okien modalnych lub reklamowych natychmiast po załadowaniu strony lub po krótkim czasie, bez akcji użytkownika.
- Otwieranie nowych okien bez powiadomienia: Linki z
target="_blank"
bez tekstowego lub wizualnego ostrzeżenia, że otwiera się nowa karta/okno. - Zmiana fokusu: Automatyczne przenoszenie fokusu klawiatury na nowo pojawiające się elementy lub na inną część strony bez interakcji użytkownika.
- Zdarzenia
onmouseover
: Używanie zdarzeńonmouseover
do wyzwalania akcji zmieniających kontekst (np. nawigacja na inną stronę), co jest problematyczne dla użytkowników klawiatury i może prowadzić do przypadkowych aktywacji.
Podsumowanie
Kryterium sukcesu WCAG 3.2.5 „Zmiana na żądanie” jest fundamentem budowania przewidywalnych i kontrolowanych interfejsów cyfrowych. Zapewnienie, że użytkownicy mają pełną kontrolę nad istotnymi zmianami kontekstu na stronie, jest niezbędne dla zapewnienia dostępności, szczególnie dla osób z niepełnosprawnościami poznawczymi, ruchowymi i użytkowników technologii wspomagających. Przestrzeganie tych wytycznych nie tylko poprawia dostępność, ale także zwiększa użyteczność i komfort korzystania z witryny dla wszystkich użytkowników.