WCAG 2.2: co się zmieniło dla sklepów internetowych
· 5 min czytania
WCAG 2.2 dodało dziewięć nowych kryteriów sukcesu, a sześć z nich dotyczy poziomów A i AA, czyli tego, czego zwykle wymaga się od sklepów internetowych. Najważniejsze dla sklepów: przyciski i linki muszą być wystarczająco duże (co najmniej 24×24 piksele CSS lub z odpowiednim odstępem), fokusu nie wolno chować pod przyklejonymi paskami, w koszyku i przy składaniu zamówienia nie można zmuszać do dwukrotnego wpisywania tych samych danych, a logowanie do konta nie powinno wymagać rozwiązywania łamigłówek. Poniżej każda zmiana z przykładami z e-commerce.
WCAG 2.2 i EN 301 549: co jest teraz obowiązkowe
W UE dostępność stron internetowych w ramach EAA mierzy się europejską normą EN 301 549. Stan na październik 2026 r.:
- EN 301 549 V3.2.1 opiera się na WCAG 2.1 AA i nadal jest wersją zharmonizowaną.
- EN 301 549 V4.1.1 opiera się na WCAG 2.2 AA. Opublikowano ją we wrześniu 2026 r., a odesłanie w Dzienniku Urzędowym UE spodziewane jest pod koniec 2026 r.
WCAG 2.2 jest wstecznie zgodne z 2.1: strona spełniająca 2.2 AA automatycznie spełnia też 2.1 AA (z wyjątkiem przestarzałego kryterium 4.1.1, o którym niżej). Dlatego sprawdzamy według WCAG 2.2 AA: sklep przygotowuje się do nowej wersji normy i nic nie traci według starej. Więcej o samych przepisach w przewodniku po EAA.
Co zmieniło się w WCAG 2.2 dla sklepów internetowych: nowe kryteria A i AA
2.4.11 Fokus niezasłonięty (minimum), AA
Gdy użytkownik przechodzi po stronie klawiszem Tab, element z fokusem nie może być całkowicie zasłonięty inną treścią. Typowy problem w sklepach to przyklejony nagłówek, baner cookies lub przycisk „Czat z obsługą”, pod którym znika aktywny link lub pole.
Co zrobić: sprawdź stronę wyłącznie klawiaturą; dodaj scroll-padding-top, aby aktywny element nie lądował pod przyklejonym nagłówkiem; baner cookies nie może zasłaniać treści po zamknięciu.
2.5.7 Przeciąganie, AA
Jeśli coś da się zrobić tylko przeciąganiem (suwak ceny w filtrze, sortowanie, suwak „przed / po”), musi istnieć sposób, aby zrobić to samo pojedynczym kliknięciem lub dotknięciem.
Co zrobić: do suwaka zakresu ceny dodaj pola „od” i „do”; do karuzeli przyciski „wstecz” i „dalej”.
2.5.8 Rozmiar celu (minimum), AA
Obszary dotyku muszą mieć co najmniej 24×24 piksele CSS lub mieć wokół siebie tyle wolnego miejsca, aby okrąg o średnicy 24 pikseli nie nachodził na sąsiedni cel. Są wyjątki, np. linki wewnątrz tekstu.
W sklepach najczęściej chodzi o: małe przyciski „+” i „−” przy liczbie sztuk, ikony „usuń z koszyka”, kropki slidera, kółka wyboru koloru.
Co zrobić: powiększ obszar dotyku za pomocą padding lub min-width/min-height, nawet jeśli sama ikona pozostaje mała.
3.2.6 Spójna pomoc, A
Jeśli na kilku stronach jest sposób uzyskania pomocy (telefon, e-mail, czat, strona FAQ), musi on być w tym samym względnym miejscu. Na przykład link „Pomoc” zawsze w nagłówku albo zawsze w stopce.
Co zrobić: nie przenoś kontaktów i czatu między szablonami stron; szczególnie sprawdź strony składania zamówienia, które często mają osobny szablon.
3.3.7 Zbędne wprowadzanie danych, A
Informacje, które użytkownik już wprowadził w ramach tego samego procesu, trzeba uzupełnić automatycznie lub dać do wyboru. Klasyczny przykład to adres dostawy i adres rozliczeniowy.
Co zrobić: dodaj pole wyboru „Adres rozliczeniowy taki sam jak adres dostawy”; nie pytaj ponownie o e-mail, który został już wpisany w poprzednim kroku.
3.3.8 Dostępne uwierzytelnianie (minimum), AA
Logowanie nie może wymagać testu poznawczego: zapamiętania, przepisania czy rozwiązania czegoś, jeśli nie ma alternatywy. Wklejanie hasła z menedżera haseł musi działać, podobnie jak logowanie przez link w e-mailu lub klucz dostępu.
Co zrobić: nie blokuj wklejania w polu hasła i kodu; sprawdź, jak działa Twoja CAPTCHA i czy ma dostępną alternatywę.
Nowe kryteria poziomu AAA w skrócie
- 2.4.12 Fokus niezasłonięty (rozszerzone): fokus nie jest zasłonięty nawet częściowo.
- 2.4.13 Wygląd fokusu: wymagania dotyczące rozmiaru i kontrastu wskaźnika fokusu.
- 3.3.9 Dostępne uwierzytelnianie (rozszerzone): surowsza wersja 3.3.8.
Poziomu AAA zwykle nie wymaga się dla całej strony, ale 2.4.13 to przydatny punkt odniesienia przy projektowaniu widocznego fokusu.
4.1.1 „Poprawność kodu” stało się przestarzałe
W WCAG 2.2 kryterium 4.1.1 (Parsing) uznano za przestarzałe i usunięto: współczesne przeglądarki i technologie wspomagające same radzą sobie z błędami znaczników. Dla sklepu oznacza to, że zduplikowane atrybuty id nie są już osobnym wymaganiem, ale nadal mogą psuć etykiety pól i powiązania ARIA. Dlatego te problemy warto dalej naprawiać.
Co z tego znajdzie automatyczna kontrola
| Kryterium | Automatycznie | Potrzebna kontrola ręczna |
|---|---|---|
| 2.4.11 Fokus niezasłonięty | nie | tak, przejście klawiaturą |
| 2.5.7 Przeciąganie | nie | tak |
| 2.5.8 Rozmiar celu | częściowo | tak, w trudniejszych przypadkach |
| 3.2.6 Spójna pomoc | nie | tak |
| 3.3.7 Zbędne wprowadzanie danych | nie | tak, w koszyku i przy zamówieniu |
| 3.3.8 Dostępne uwierzytelnianie | nie | tak |
Większość nowych wymagań WCAG 2.2 dotyczy więc zachowania interfejsu, którego automat nie widzi. Automatyczna kontrola to nie pełny audyt i nie porada prawna: dobrze wyłapuje kontrast, teksty alternatywne, etykiety pól i puste przyciski, a nowe kryteria trzeba uzupełnić ręcznym przejściem. Praktyczną listę do samodzielnego sprawdzenia znajdziesz w liście kontrolnej WCAG 2.2.
Plan dla sklepu na jeden sprint
- Przejdź ścieżkę „strona główna → produkt → koszyk → płatność” wyłącznie klawiaturą. Szukaj zasłoniętego fokusu (2.4.11).
- Znajdź wszystkie małe przyciski-ikony i powiększ ich obszary dotyku (2.5.8).
- Dodaj alternatywę dla suwaków i karuzel (2.5.7).
- Sprawdź, czy adres i e-mail nie są wpisywane dwa razy (3.3.7).
- Ustal jedno miejsce linku do pomocy we wszystkich szablonach (3.2.6).
- Sprawdź logowanie: wklejanie hasła, CAPTCHA, logowanie przez link (3.3.8).
- Uruchom automatyczną kontrolę, aby usunąć typowe błędy: zob. 10 najczęstszych błędów w Shopify i WooCommerce.
Czy Twój sklep w ogóle podlega EAA, pomoże ustalić filtr z trzech pytań.
Odpowiedzi na częste pytania
Ile nowych kryteriów jest w WCAG 2.2? Dziewięć: sześć na poziomach A i AA oraz trzy na poziomie AAA. Kryterium 4.1.1 uznano za przestarzałe.
Czy WCAG 2.2 jest już obowiązkowe? Zharmonizowana jest nadal EN 301 549 V3.2.1 (WCAG 2.1); V4.1.1 (WCAG 2.2) opublikowano we wrześniu 2026 r., a odesłanie w Dzienniku Urzędowym UE spodziewane jest pod koniec 2026 r.
Czy automat znajdzie wszystko, co nowe? Nie, większość nowych kryteriów sprawdza się ręcznie.
Sprawdź bezpłatnie jedną stronę swojego sklepu i zobacz, od czego zacząć.