Cel kryterium - czyli o co chodzi?
Kryterium 3.3.2 (poziom A) wymaga, aby każde pole formularza miało przypisaną etykietę lub instrukcję, która pomaga użytkownikowi w jego poprawnym wypełnieniu. Dzięki temu osoby korzystające z technologii asystujących oraz wszyscy użytkownicy mogą łatwiej wprowadzać dane bez zbędnych trudności.
Kto skorzysta z tego rozwiązania?
Poprawnie opisane formularze pomagają wszystkim użytkownikom, ale szczególnie osobom z niepełnosprawnością wzroku, seniorom oraz tym, którzy mają trudności z przetwarzaniem informacji. Jasne etykiety i podpowiedzi minimalizują błędy i ułatwiają korzystanie z formularzy na stronach internetowych.
Jak poprawnie wdrożyć etykiety i instrukcje?
- Etykiety formularzy:
Każde pole formularza powinno mieć przypisaną etykietę za pomocą znacznika
<label>, który jest powiązany z polem poprzez atrybutyforiid. - Podpowiedzi dla użytkowników:
Jeśli formularz zawiera dodatkowe instrukcje, można je powiązać z danym polem, używając atrybutu
aria-describedby. - Grupowanie pól:
W bardziej rozbudowanych formularzach warto grupować powiązane pola za pomocą elementów
<fieldset>i<legend>, np. „Adres zamieszkania” czy „Dane do faktury”. - Wymagane pola:
Pola obowiązkowe powinny być wyraźnie oznaczone zarówno wizualnie, jak i dla technologii asystujących.
Dlaczego to jest ważne?
Nieprawidłowo skonstruowane formularze to jedna z najczęstszych barier dostępności. Brak jasnych etykiet i instrukcji powoduje frustrację użytkowników, prowadzi do błędów i może skutkować porzuceniem formularza przed jego wysłaniem. Poprawnie wdrożone etykiety ułatwiają interakcję i poprawiają użyteczność strony.
Czy wiesz, że?
Błędy w formularzach należą do najczęściej wykrywanych problemów podczas audytów dostępności. Często wynikają one z braku etykiet, źle przypisanych podpowiedzi lub niewłaściwego oznaczenia pól obowiązkowych.
Dbając o prawidłowe etykiety i instrukcje, sprawiamy, że formularze stają się bardziej intuicyjne i dostępne dla każdego użytkownika.
