WCAG 2.2 pro e-shopy: nová kritéria v praxi
· Čtení na 4 min
WCAG 2.2 přináší pro e-shopy šest nových kritérií na úrovni A a AA: fokus nesmí být zakrytý, tažení musí mít alternativu, klikací cíle musí mít minimální velikost, nápověda musí být na stejném místě, zákazník nemá znovu zadávat stejné údaje a přihlášení nesmí vyžadovat luštění hádanek. Pro e-shop to znamená zkontrolovat hlavně lepící hlavičky, cookie lišty, filtry, malé ikony a pokladnu.
Proč se WCAG 2.2 týká i vás
Evropský akt o přístupnosti a zákon č. 424/2023 Sb. se v praxi opírají o normu EN 301 549, která pro web odkazuje na WCAG. Harmonizovanou verzí je zatím EN 301 549 V3.2.1, která vychází z WCAG 2.1 AA. Dne 2. září 2026 vyšla verze V4.1.1 založená na WCAG 2.2 AA a její citace v Úředním věstníku EU se očekává koncem roku 2026.
Pro e-shop to znamená: pokud dnes opravujete web, cilte rovnou na WCAG 2.2 AA. WCAG 2.2 je zpětně kompatibilní s 2.1 (s výjimkou zrušeného kritéria 4.1.1), takže splněním 2.2 pokryjete i 2.1. Naše kontrola pracuje s WCAG 2.2 AA.
Nová kritéria a co znamenají pro e-shop
2.4.11 Fokus není zakrytý (AA)
Když uživatel klávesnicí přejde na prvek, nesmí ho úplně zakrývat jiný obsah. V e-shopech je typický viník lepící hlavička, cookie lišta nebo lišta s chatem u spodního okraje. Uživatel tabulátorem přejde na odkaz v patičce, ale ten je schovaný pod cookie lištou.
Co zkontrolovat: projděte stránku tabulátorem se zobrazenou cookie lištou a s posunutým obsahem pod lepící hlavičku.
2.5.7 Pohyby tažením (AA)
Funkce, které se ovládají tažením, musí mít alternativu jedním kliknutím. Typicky posuvník ceny ve filtru, karusel produktů ovládaný jen tažením nebo řazení položek přetahováním.
Co zkontrolovat: dá se filtr ceny nastavit i zadáním čísla nebo tlačítky? Má karusel šipky?
2.5.8 Velikost cíle, minimum (AA)
Klikací cíle mají mít alespoň 24 × 24 pixelů, nebo kolem sebe dostatečný odstup. V e-shopech jde o ikony v hlavičce, tlačítka plus a minus u počtu kusů, křížky pro odebrání z košíku, malé barevné vzorky variant a odkazy v drobném textu.
Co zkontrolovat: zvětšete ikony a odstupy v šabloně. Na mobilu to ocení všichni zákazníci.
3.2.6 Konzistentní nápověda (A)
Pokud web nabízí nápovědu (kontakt, chat, telefon, FAQ), má být na všech stránkách na stejném místě. Zákazník v pokladně nemá hledat, kde je kontakt.
Co zkontrolovat: je kontakt v hlavičce nebo patičce na všech stránkách včetně pokladny?
3.3.7 Zbytečné opakované zadávání (A)
Údaje, které zákazník už zadal ve stejném procesu, se mají předvyplnit nebo nabídnout k výběru. Typicky fakturační a doručovací adresa: zaškrtávací pole „Doručit na stejnou adresu“ to řeší.
Co zkontrolovat: projděte pokladnu a sledujte, zda nemusíte nic psát dvakrát.
3.3.8 Přístupné ověření, minimum (AA)
Přihlášení nesmí vyžadovat kognitivní test, například opisování znaků nebo luštění hádanky, pokud neexistuje alternativa. Musí fungovat vkládání hesla a správce hesel.
Co zkontrolovat: nebrání web vložení hesla? Má CAPTCHA alternativu? Funguje přihlášení odkazem nebo kódem?
Proč se nová kritéria vyplatí i bez zákona
Všech šest kritérií zlepšuje nákup pro každého, nejen pro lidi se zdravotním postižením:
- Větší klikací cíle snižují počet omylem stisknutých tlačítek na mobilu, třeba když zákazník chce přidat jeden kus a místo toho položku odebere.
- Předvyplněná adresa zkracuje pokladnu a snižuje počet chyb v doručovacích údajích.
- Nezakrytý fokus a konzistentní nápověda pomáhají zákazníkům, kteří na webu hledají kontakt nebo reklamační formulář.
- Přihlášení bez hádanek a s podporou správců hesel ocení každý, kdo si nepamatuje heslo.
- Alternativa k tažení pomůže lidem s třesem rukou, ale i komukoli, kdo nakupuje jednou rukou v tramvaji.
Pokud se na váš e-shop zákon nevztahuje, například protože jste mikropodnik, jsou tyto úpravy stále rozumnou investicí do použitelnosti. Viz na koho se zákon vztahuje.
Co ve WCAG 2.2 zmizelo
Kritérium 4.1.1 Parsování bylo ve WCAG 2.2 zrušeno, protože moderní prohlížeče a asistivní technologie chyby v syntaxi HTML zvládají. Neznamená to, že na kvalitě kódu nezáleží. Správné role a názvy prvků dál hlídá kritérium 4.1.2.
Co z toho najde automatická kontrola
| Kritérium | Automatika |
|---|---|
| 2.4.11 Fokus není zakrytý | ruční kontrola |
| 2.5.7 Pohyby tažením | ruční kontrola |
| 2.5.8 Velikost cíle | částečně |
| 3.2.6 Konzistentní nápověda | ruční kontrola |
| 3.3.7 Zbytečné opakované zadávání | ruční kontrola |
| 3.3.8 Přístupné ověření | ruční kontrola |
Nová kritéria jsou tedy převážně záležitostí ručního testu. Automatická kontrola zůstává důležitá pro starší kritéria, kde se chyby vyskytují nejčastěji: popisky, alternativní texty, kontrast, názvy tlačítek. Viz nejčastější chyby přístupnosti.
Jak nová kritéria otestovat za hodinu
Na ruční test šesti nových kritérií nepotřebujete speciální nástroje. Stačí prohlížeč, klávesnice a mobil. Projděte jednu cestu nákupu od kategorie přes detail produktu a košík až po poslední krok pokladny. U každého kroku si zapište, zda jste narazili na zakrytý fokus, malé tlačítko, tažení bez alternativy, schovaný kontakt, opakované zadávání nebo problém s přihlášením.
Praktický postup
- Spusťte automatickou kontrolu a opravte nálezy v šabloně.
- Projděte šest nových kritérií ručně podle tohoto článku.
- Zkontrolujte pokladnu na mobilu: velikost tlačítek, předvyplněné adresy, přihlášení.
- Výsledky zapište do známých omezení v informacích o přístupnosti, viz průvodce informacemi o přístupnosti.
- Nastavte pravidelnou kontrolu.
Kompletní seznam najdete ve WCAG 2.2 checklistu. Právní rámec vysvětluje průvodce zákonem 424/2023 Sb..
Naše služba je automatizovaná kontrola, nikoli úplný audit, a není to právní poradenství. Vyzkoušejte bezplatnou kontrolu jedné stránky.
Zdroje
- WCAG 2.2: W3C