WCAG 3.2.2 Podczas wprowadzania danych

Kryterium sukcesu 3.2.2 chroni przed nieoczekiwanymi przeskokami podczas wypełniania formularza. Użytkownicy czytników ekranu, osoby korzystające z klawiatury i osoby z niepełnosprawnościami poznawczymi mogą przeglądać listę wyboru opcja po opcji albo zaznaczyć pole, żeby zobaczyć, co robi. Jeśli już samo to przeładowuje stronę lub wysyła formularz, tracą orientację albo wysyłają coś, czego nie zamierzali. To poziom A, a norma EN 301 549 zawiera je jako punkt 9.3.2.2.

Czego wymaga kryterium

Zmiana ustawienia dowolnego komponentu interfejsu użytkownika nie może automatycznie powodować zmiany kontekstu, chyba że użytkownik został poinformowany o tym zachowaniu, zanim skorzystał z komponentu.

„Zmiana ustawienia” oznacza zmianę wartości: wpisanie tekstu w pole, zaznaczenie pola wyboru, wybranie przycisku opcji lub pozycji na liście wyboru. Zmiana kontekstu to nowa strona, nowe okno, przeniesienie fokusu w inne miejsce lub treść zmieniająca znaczenie strony. Zwykła zmiana treści — pokazanie dodatkowego pola, aktualizacja ceny — jest dozwolona.

Typowe błędy w sklepie internetowym

• lista „Sortuj według” lub wybór waluty przeładowuje stronę, gdy tylko wybierze się opcję, bez ostrzeżenia;
• wybór kraju w procesie zamówienia przenosi fokus lub przeładowuje cały formularz;
• wybór wariantu (rozmiaru, koloru) przenosi pod inny adres URL produktu;
• pole kodu rabatowego lub ilości automatycznie wysyła formularz, gdy zmienia się wartość;
• zaznaczenie pola wyboru otwiera nowe okno, np. stronę regulaminu.

Jak to sprawdzić

Automatycznie: nasz skaner nie ma reguły dla tego kryterium. To, czy zmiana wartości uruchamia nawigację, zależy od skryptów, dlatego potrzebna jest kontrola ręczna.

Ręcznie: używając wyłącznie klawiatury, przejść do każdej listy wyboru, pola wyboru, grupy przycisków opcji i pola tekstowego. Zmienić wartość strzałkami lub wpisując tekst, bez naciskania Enter ani przycisku. Obserwować, czy strona się przeładowuje, otwierają się nowe okna lub karty, formularz zostaje wysłany albo fokus przenosi się gdzie indziej. Jeśli tak się dzieje, poszukać przed elementem tekstu, który o tym ostrzega.

Jak to naprawić

• Dodać przycisk „Zastosuj”, „Przejdź” lub „Aktualizuj” i działać dopiero po jego naciśnięciu.
• Jeśli natychmiastowe działanie musi zostać, poinformować o tym przed elementem, np. „Wybór waluty przeładowuje stronę”.
• Aktualizować treść na miejscu (cenę, stan magazynowy, wyniki filtrowania) bez przenoszenia fokusu i ogłaszać zmianę jako komunikat o stanie.
• Nigdy nie otwierać nowych okien z pól wyboru ani przycisków opcji.

Powiązane kryteria

• 3.2.1 Po otrzymaniu fokusu — sam fokus nie może zmieniać kontekstu.
• 4.1.3 Komunikaty o stanie — ogłaszanie zaktualizowanych wyników bez przenoszenia fokusu.
• 3.3.2 Etykiety lub instrukcje — instrukcje ostrzegające o zachowaniu.

Najczęstsze pytania

Czy lista wyboru może przenosić na inną stronę po zmianie?

Tylko jeśli użytkownicy dowiedzą się o tym, zanim z niej skorzystają, np. z tekstu wyjaśniającego, że wybór opcji otwiera stronę. Wygodniejszym rozwiązaniem jest osobny przycisk „Przejdź” lub „Zastosuj”.

Czy filtry, które aktualizują listę produktów po zmianie, są dozwolone?

Aktualizacja listy to zwykle zmiana treści, a nie kontekstu, i jest dozwolona. Wczytanie nowej strony, otwarcie okna lub przeniesienie fokusu po zmianie to zmiana kontekstu.

Czy 3.2.2 obejmuje przyciski i linki?

Nie. Aktywowanie przycisku lub linku nie jest zmianą ustawienia. 3.2.2 dotyczy zmiany wartości elementów takich jak pola tekstowe, pola wyboru, przyciski opcji i listy wyboru.