7 minut czytania
Lista kontrolna najczęstszych barier w formularzach — od brakujących etykiet po zbyt krótkie limity czasu — z odniesieniami do kryteriów WCAG 2.2.
Dlaczego formularze są krytyczne?
Formularz to zwykle moment, w którym użytkownik chce coś załatwić: kupić, zapisać się, złożyć wniosek. Jedna bariera w tym miejscu potrafi zablokować cały proces — niezależnie od tego, jak dostępna jest reszta serwisu.
Dziesięć najczęstszych błędów
Placeholder zamiast widocznej etykiety pola (1.3.1, 3.3.2).
Błąd sygnalizowany wyłącznie kolorem obramowania (1.4.1).
Komunikat „Niepoprawne dane” bez wskazówki, jak to poprawić (3.3.1, 3.3.3).
Komunikat błędu niepowiązany programowo z polem.
Niewidoczny fokus na polach i przyciskach (2.4.7).
Brak atrybutów autouzupełniania dla danych osobowych (1.3.5).
Wymuszanie ponownego wpisywania tych samych danych (3.3.7 — nowe w WCAG 2.2).
Test poznawczy przy logowaniu bez alternatywy (3.3.8 — nowe w WCAG 2.2).
Zbyt małe pola wyboru i przyciski — poniżej 24 × 24 px (2.5.8 — nowe w WCAG 2.2).
Limit czasu bez możliwości jego przedłużenia (2.2.1).
Wskazówka Dobra praktyka: komunikat błędu mówi, co zrobić dalej.
Zamiast „Błędny format” napisz: „Wpisz kod pocztowy w formacie 00-000”.
Jak przetestować formularz?
Wypełnij formularz wyłącznie klawiaturą, a potem z czytnikiem ekranu (np. NVDA lub VoiceOver). Celowo popełnij błędy w każdym polu i sprawdź, czy komunikaty są ogłaszane i zrozumiałe. Powiększ widok do 200% i 400% — etykiety nie mogą znikać ani nachodzić na pola.
Krótka checklista przed publikacją formularza.
Etykiety: Każde pole ma widoczną, opisową etykietę.
Błędy: Komunikaty wskazują pole i sposób poprawy.
Klawiatura: Cały proces da się przejść bez myszy.
Uwierzytelnianie: Logowanie nie wymaga zapamiętywania ani przepisywania kodów.