WCAG 3.2.3 Konzistentní navigace

Kritérium úspěšnosti 3.2.3 pomáhá lidem, kteří se na webu orientují podle paměti a zvyku: uživatelům čteček obrazovky, kteří poslouchají menu postupně, lidem se zvětšovacím softwarem, kteří vidí jen část stránky, a lidem s kognitivním postižením. Pokud je „Košík“ na jedné stránce třetím odkazem a na jiné šestým, musí ho pokaždé hledat znovu. Jde o úroveň AA a v normě EN 301 549 je uvedeno jako článek 9.3.2.3. Na harmonizovanou normu EN 301 549 odkazuje i český zákon č. 424/2023 Sb.

Co kritérium vyžaduje

Navigační mechanismy, které se opakují na více webových stránkách v rámci jedné sady webových stránek, musí být při každém opakování ve stejném relativním pořadí, pokud změnu nevyvolá sám uživatel.

• Sada webových stránek je soubor stránek se společným účelem, který vytvořil stejný autor nebo organizace — typicky jeden e-shop. Různé jazykové verze se počítají jako různé sady.
• „Stejné relativní pořadí“ dovoluje položky přidávat nebo odebírat. Rozbalující se podmenu nebo odkaz navíc na některých stránkách nevadí, pokud ostatní položky zachovají své pořadí.
• Jedinou výjimkou je změna, kterou vyvolá uživatel, například vlastní pořadí položek menu, které si sám zvolil.

Typické chyby v e-shopu

• záhlaví na úvodní stránce používá jinou šablonu než stránky kategorií a produktů a odkazy jsou v jiném pořadí;
• pokladna používá zjednodušené záhlaví, ve kterém jsou zbývající odkazy přeházené;
• ikony účtu, vyhledávání a košíku si na blogu nebo na landing pages z page builderu vymění místa;
• pořadí odkazů v patičce se liší mezi stránkami e-shopu a stránkami, které obsluhuje aplikace;
• pořadí mobilního menu se liší mezi stránkami při stejné šířce obrazovky.

Jak to zkontrolovat

Automaticky: náš nástroj pro toto kritérium nemá pravidlo. Je třeba porovnat navigaci napříč stránkami, což je ruční kontrola.

Ručně: vyberte pět nebo šest typů stránek — úvodní stránku, kategorii, produkt, košík, pokladnu, blog, obsahovou stránku. Na každé si zapište pořadí hlavního menu, ikon v záhlaví, drobečkové navigace a odkazů v patičce, nebo je projděte klávesou Tab. Seznamy porovnejte. Udělejte to při šířce pro počítač a znovu při šířce telefonu, protože každé rozvržení se porovnává samo se sebou.

Jak to opravit

• Záhlaví a patičku sestavte z jedné sdílené komponenty nebo sekce šablony, místo abyste je kopírovali do jednotlivých šablon.
• Když stránka potřebuje méně položek (jako pokladna), položky odeberte, ale zbytek nepřeskupujte.
• Ikony v záhlaví (vyhledávání, účet, košík) držte v jednom pevném pořadí v kódu, nejen vizuálně.
• Landing pages z page builderu před zveřejněním porovnejte s hlavní šablonou.

Související kritéria

• 3.2.4 Konzistentní identifikace — stejné funkce jsou pojmenovány stejně.
• 3.2.6 Konzistentní nápověda — odkazy na nápovědu zůstávají ve stejném pořadí.
• 2.4.1 Přeskočení bloků — způsob, jak opakovanou navigaci přeskočit.

Časté otázky

Musí menu vypadat na každé stránce úplně stejně?

Ne. Opakované položky musí zachovat stejné relativní pořadí. Položky můžete přidávat nebo odebírat, například rozbalit podmenu na stránce kategorie, pokud zbývající položky zůstanou ve stejném pořadí.

Počítají se jazykové verze webu jako jedna sada stránek?

Ne. WCAG považuje různé jazykové verze za různé sady webových stránek, takže anglické a německé menu se porovnávají zvlášť.

Dokáže konzistentní navigaci otestovat automatický nástroj?

Spolehlivě ne. Je potřeba porovnat navigaci na mnoha stránkách, proto se kontroluje ručně.