Nowa norma EN 301 549 V4.1.1 opiera się na WCAG 2.2, które dodaje sześć wymagań. Trzy z nich możesz wstępnie sprawdzić sam w kilka minut: rozmiar przycisków na telefonie, widoczność kursora klawiatury i sposób logowania. Pełną ocenę da dopiero badanie całego serwisu.
Sześć nowych wymagań w języku klienta
| Wymaganie | Co to znaczy dla Twojego klienta |
|---|---|
| Rozmiar celu (2.5.8) | Trafi palcem w przycisk za pierwszym razem |
| Fokus niezasłonięty (2.4.11) | Poruszając się klawiaturą, widzi, gdzie jest na stronie |
| Ruchy przeciągania (2.5.7) | Ustawi suwak ceny lub kolejność bez przeciągania |
| Spójna pomoc (3.2.6) | Znajdzie kontakt i pomoc zawsze w tym samym miejscu |
| Zbędne wprowadzanie danych (3.3.7) | Nie wpisze drugi raz tego samego adresu w zamówieniu |
| Dostępne uwierzytelnianie (3.3.8) | Zaloguje się bez przepisywania kodów z pamięci |
Każde z tych wymagań dotyczy stron, a przez tę samą normę także dokumentów i oprogramowania. Poziom AA mają kryteria rozmiaru celu, fokusu, przeciągania i uwierzytelniania. Spójna pomoc i zbędne wprowadzanie danych są na poziomie A.
Test 1: przyciski na telefonie
Otwórz swoją stronę na telefonie i spróbuj kciukiem trafić w ikony w nagłówku, krzyżyk zamykania okienka, strzałki w galerii i linki w stopce. Jeśli choć raz trafisz w sąsiedni element, masz sygnał, że cele mogą być za małe lub za blisko siebie. WCAG 2.2 wymaga co najmniej 24 × 24 pikseli CSS albo odstępu, przy którym koło o średnicy 24 pikseli wokół celu nie nachodzi na inny cel.
Chcesz wiedzieć, ile takich miejsc jest w serwisie? Trop Skan sprawdza 10 podstron, które dobieramy w Twoim serwisie, i przysyła raport do godziny. Kosztuje 390 zł netto.
Test 2: nawigacja klawiaturą
Na komputerze kliknij w pasek adresu, a potem naciskaj klawisz Tab. Za każdym naciśnięciem podświetla się kolejny link lub przycisk. Sprawdź, czy zawsze widzisz, co jest podświetlone, zwłaszcza gdy strona się przewija, a u góry wisi przyklejone menu albo na dole baner ciasteczek. Jeśli podświetlenie znika pod menu, to błąd kryterium 2.4.11.
Test 3: logowanie
Wyloguj się i zaloguj ponownie. Sprawdź, czy w pole hasła można wkleić tekst, czy przeglądarka lub menedżer haseł uzupełnia dane i czy CAPTCHA ma alternatywę. Jeśli logowanie wymaga przepisania kodu z SMS-a, sprawdź, czy kod da się wkleić albo uzupełnić automatycznie.
Najprostsza poprawka dla przyklejonego menu to nie nowy komponent, tylko miejsce na fokus. W CSS wystarczy
scroll-padding-topalboscroll-marginrówne wysokości menu, żeby przeglądarka dosuwała podświetlony element poniżej paska. Przy za małych ikonach zaczynam odmin-widthimin-height24 pikseli oraz odstępu między sąsiadami. Automat pokaże część tych miejsc. Nie powie, czy wyjątek z normy naprawdę tu pasuje. To już oględziny.Wojciech Waluś, programista i tester dostępności
Co sprawdzi Trop, a co audytor
Automatyczne badanie Trop dobrze wychwytuje część problemów z rozmiarem przycisków i wiele błędów z wcześniejszych wersji WCAG, na przykład brak opisów obrazków czy za słaby kontrast. Nie oceni, czy logowanie opiera się na pamięci, czy pomoc jest w stałym miejscu, ani czy formularz każe wpisywać dane dwa razy. To sprawdza audytor w Trop Audyt, przechodząc kluczowe ścieżki klawiaturą i czytnikiem ekranu. Pakiet obejmuje do 15 widoków i 3 ścieżki, a całość trwa 3–7 dni. Cena to 2 490 zł netto.
Kontekst normy jest w tekście Nowa norma dostępności EN 301 549: 5 rzeczy, które musisz wiedzieć. Szczegóły każdego wymagania opisujemy też na AccessibilityTeam.eu.
Sprawdź serwis z Trop Skan za 390 zł netto. Masz logowanie, formularze lub sklep? Wybierz Trop Audyt z weryfikacją audytora.
Drużyna Dostępności