Web Accessibility Academy · Lekcja

W tekście, po utracie fokusu czy po wysłaniu: czas ma znaczenie

Sprawdzaj poprawność w momentach, które nie przytłaczają użytkownika.

Lekcja 4 z 413 kroki

W tekście, po utracie fokusu czy po wysłaniu: czas ma znaczenie to bezpłatna lekcja Web Accessibility Academy na CoddyKit. To lekcja 4 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Web Accessibility Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Web Accessibility Academy zawiera 4 lekcji w sumie.

Kiedy przeprowadzasz walidację, ma znaczenie

Ten sam komunikat o błędzie może pomagać lub irytować w zależności od tego, kiedy się pojawia. Moment wyświetlenia to osobna decyzja dotycząca dostępności. ⏱️

Walidacja przy wysłaniu to podstawa

Sprawdzanie wszystkiego podczas wysyłania jest przewidywalne i nigdy nie przerywa pracy. To najbezpieczniejsze ustawienie domyślne dla niemal każdego formularza.

Dlaczego walidacja w tekście może szkodzić

Walidacja przy każdym naciśnięciu klawisza oznacza pole jako niepoprawne, zanim użytkownik skończy pisać. Takie natrętne sprawdzanie na bieżąco frustruje wszystkich.

Walidacja po opuszczeniu pola to złoty środek

Sprawdzanie pola, gdy użytkownik je opuszcza, czyli podczas blur, pozwala mu najpierw skończyć pisanie, a następnie przekazuje informację zwrotną w naturalnym momencie.

input.addEventListener("blur", validateField);

Nie ogłaszaj zbyt wcześnie

Błąd pojawiający się w trakcie pisania może przejąć uwagę użytkownika czytnika ekranu. Przed ogłoszeniem poczekaj na odpowiedni moment, taki jak blur lub wysłanie formularza.

Najpierw potwierdź błąd, potem sprawdzaj na bieżąco

Gdy pole zostało oznaczone jako niepoprawne, a użytkownik je poprawia, ponowna walidacja podczas pisania jest pomocna. Potwierdza, że błąd znika.

Daj czas na ukończenie

WCAG zaleca, aby nie poganiać użytkowników. Unikaj limitów czasu usuwających wprowadzone dane i pozwól użytkownikom wypełnić pole we własnym tempie.

Wymagalność określ z wyprzedzeniem

Z góry oznaczaj wymagane pola za pomocą required i widocznej informacji, aby użytkownicy znali tę zasadę przed wysłaniem formularza, a nie dopiero po nim.

<input required aria-required="true">

Twórz konkretne komunikaty

Niezależnie od momentu wyświetlenia powiedz, co jest nie tak i jak to poprawić. Jasny komunikat jest lepszy niż nieprecyzyjny komunikat wyświetlony nawet w idealnym momencie.

Korzystaj z możliwości przeglądarki

Natywna walidacja HTML jest domyślnie uruchamiana przy wysłaniu formularza. Wbudowane atrybuty, takie jak type i required, zapewniają rozsądny moment walidacji bez dodatkowej pracy.

<input type="email" required>

Zachowaj spójność

Wybierz jedną strategię określania momentu walidacji i stosuj ją w całym formularzu. Przewidywalne zachowanie pozwala użytkownikom nauczyć się schematu i mu zaufać.

Szybkie sprawdzenie

Jaki moment walidacji jest najbardziej dostępnym ustawieniem domyślnym?

Podsumowanie

Przeprowadzaj walidację podczas blur lub wysyłania formularza, a nie przy każdym naciśnięciu klawisza; po rozpoczęciu poprawiania sprawdzaj pole na bieżąco, wcześnie informuj o zasadach i zachowuj spójność. ✅

Bezpłatny start

Ucz się HTML dzięki korepetycjom AI — za darmo

Pisz i uruchamiaj kod w przeglądarce, otrzymuj natychmiastową pomoc od korepetytora AI dostępnego 24/7 i kontynuuj naukę w sieci lub w aplikacji.

Kursy
30
Lekcje
120

Często zadawane pytania

Czy lekcja „W tekście, po utracie fokusu czy po wysłaniu: czas ma znaczenie” jest bezpłatna?

Tak — pełny tekst „W tekście, po utracie fokusu czy po wysłaniu: czas ma znaczenie” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Web Accessibility Academy, przejdź na CoddyKit PRO. Kurs Web Accessibility Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „W tekście, po utracie fokusu czy po wysłaniu: czas ma znaczenie”?

Sprawdzaj poprawność w momentach, które nie przytłaczają użytkownika. Ćwiczysz Web Accessibility Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć Web Accessibility Academy?

Nie wymagamy żadnego doświadczenia. Web Accessibility Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 4 z 4.

Ile czasu zajmuje lekcja „W tekście, po utracie fokusu czy po wysłaniu: czas ma znaczenie”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji Web Accessibility Academy?

Tak. Każda lekcja Web Accessibility Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. Powiązywanie błędów z polami za pomocą aria-describedby
  2. Oznaczanie nieprawidłowego stanu za pomocą aria-invalid
  3. Przenoszenie fokusu do pierwszego błędu
  4. W tekście, po utracie fokusu czy po wysłaniu: czas ma znaczenie
← Powrót do Web Accessibility Academy