Określanie przeznaczenia pola wprowadzania danych
Pola formularzy zbierające typowe dane osobowe — imię, e-mail, telefon, adres, karta płatnicza — muszą programowo deklarować swoje przeznaczenie za pomocą atrybutu HTML autocomplete. Umożliwia to automatyczne uzupełnianie przez przeglądarkę oraz dostosowanie interfejsu przez technologie wspomagające.
Czego wymaga kryterium
Dla każdego z 53 konkretnych pól z danymi użytkownika wymienionych w WCAG (imię, e-mail, tel, adres, numer karty, data urodzenia, kraj itd.) pole wejściowe musi zawierać odpowiedni token autocomplete. Celem nie jest wygoda automatycznego uzupełniania przez przeglądarkę — chodzi o to, by narzędzia wspomagające (klawiatury z zestawem symboli, aplikacje AAC, warstwy wsparcia poznawczego) mogły zastąpić etykiety formularza ikonami, tłumaczeniami lub alternatywnymi trybami wprowadzania, lecz wyłącznie wtedy, gdy przeznaczenie pola jest odczytywalne maszynowo.
Jak spełnić kryterium
- Należy dodać
autocomplete="email"do pól e-mail,autocomplete="given-name"do pól imienia,autocomplete="family-name"do pól nazwiska. - Należy używać
autocomplete="tel"dla telefonu,autocomplete="street-address",autocomplete="postal-code",autocomplete="country". - W formularzach płatności należy stosować
autocomplete="cc-name",cc-number,cc-exp,cc-csc. - Pełna lista tokenów znajduje się w specyfikacji HTML — są to wartości normatywne.
- Należy łączyć z
<input type="email">,type="tel",type="url">dla poprawnych klawiatur ekranowych. - W polach nieosobowych (wyszukiwarka, ocena niestandardowa) token autocomplete nie jest wymagany — kryterium obejmuje wyłącznie 53 typy danych osobowych.
Typowe błędy
autocomplete="off"dla całego formularza logowania „ze względów bezpieczeństwa” — aktywnie uniemożliwia spełnienie kryterium i blokuje menedżery haseł.- Pole e-mail bez tokenu autocomplete, przez co użytkownicy klawiatur symbolicznych nie otrzymują dostosowanego pola wprowadzania.
- Pola adresowe z etykietą „Linia adresu 1”, ale bez
autocomplete="address-line1". - Pola kart płatniczych z niestandardowym automatycznym uzupełnianiem w JavaScript zamiast natywnego tokenu.
- Formularz rejestracyjny z polem „imię i nazwisko” bez
autocomplete="name".
Dlaczego to ważne
Kryterium jest powszechnie pomijane, bo błąd jest niewidoczny — formularz działa dla typowych użytkowników, ale osoby korzystające z adaptacyjnych metod wprowadzania danych otrzymują ogólny interfejs. Dodanie tokenów autocomplete to zadanie na 30 minut w większości formularzy rejestracyjnych, które jednocześnie poprawia komfort typowych użytkowników (lepsza obsługa automatycznego uzupełniania przez przeglądarkę).