WCAG 2.0 - Wytyczna 3.3 Pomoc przy wprowadzaniu danych - 3.3.1 Identyfikacja błędów (A)

Każdy serwis internetowy posiada jakiś formularz, a jeśli nie posiada - to powinien. Bez względu na jego przeznaczenie, czy to będzie wyszukiwarka, newsletter, rejestracja, kontakt itp., w każdym przypadku musimy sprawdzić poprawność wprowadzanych danych. W sytuacji, gdy użytkownik niepoprawnie wypełni pole lub pominie pole wymagane, musimy go o tym fakcie poinformować.

Trudno jednoznacznie określić, jaki sposób jest najodpowiedniejszy, ponieważ charakter komunikatów i ich obsługa będzie się różnić, w zależności od funkcji formularza oraz tego, w jaki sposób nastąpi sprawdzenie poprawności danych, czy po stronie klienta (np. Java Script) czy po stronie serwera (np. PHP).
Jedno jest pewne: informacja musi być skuteczna, intuicyjna i przede wszystkim dostępna dla wszystkich użytkowników, bez względu na to, czy posiadają dysfunkcje czy nie.
Musi pozwolić użytkownikowi jednoznacznie na zidentyfikowanie błędu oraz na łatwe rozwiązanie problemu i powtórne przesłanie danych z formularza.

Na poniższym zrzucie widać jasne komunikaty (walidacja nastąpiła po stronie serwera), które jednoznacznie wskazują, gdzie nastąpił błąd we wprowadzaniu danych.

Komunikaty możemy wyświetlić przy danym polu, ale aby były one czytelne i łatwe do zidentyfikowania przez osoby korzystające z programów czytających, musimy przed formularzem poinformować o wystąpieniu błędu. Następnie, przy każdym źle wypełnionym polu zamieścić informację o błędzie. Nie PO, ale PRZED polem, ponieważ użytkownik musi najpierw uzyskać informację o błędzie a potem wypełnić poprawnie pole. Oczywiście w CSS można dowolnie komunikat sformatować, aby był odpowiednio wyróżniony i umiejscowiony.

Z powodzeniem można przeprowadzić walidację po stronie klienta. Musimy przy tym pamiętać, że komunikaty muszą być dostępne. Możemy użyć popularnej funkcji alert() z Java Script. Jest ona skutecznie obsługiwana przez programy czytające.
Ze stosowaniem wszelkich komunikatów, generowanych za pomocą metod typu innerHTML należy uważać, ponieważ ich nieumiejętne stosowanie skutecznie może utrudnić, a wręcz uniemożliwić obsługę błędów w formularzu. Pamiętając, że programy czytające przetwarzają stronę internetową liniowo, wyobraźmy sobie sytuację, w której użytkownik wypełnia pole daty urodzenia. Myli się w formacie a skrypt przy pomocy innerHTML wkleja kawałek kodu HTML-owego: warstwę div z komunikatem o błędzie ponad miejscem, w którym użytkownik aktualnie się znajduje. Oczywiście, warstwa jest odpowiednio sformatowana w CSS i pojawia się jako okienko na środku ekranu. Użytkownik widzący doskonale błąd zidentyfikuje i odczyta, natomiast dla użytkownika niewidomego nie zaszła żadna zmiana na stronie. Nie wie, że powyżej został dodany jakiś kod HTML.