Web může vypadat skvěle a přesto zůstat pro část návštěvníků téměř nepoužitelný. Někdo nepoužívá myš, někdo potřebuje zvětšit text, další čte stránku pomocí hlasové čtečky nebo ji ovládá na telefonu při horším světle. Přístupnost znamená, že obsah a funkce webu dokáže vnímat a ovládat co nejširší okruh lidí, včetně lidí se zrakovým, sluchovým, pohybovým či kognitivním omezením. Zlepšuje také použitelnost pro každého: jasné popisky, přehledná navigace a rychle pochopitelné formuláře pomáhají všem. Níže je deset kroků, které lze začít zavádět hned.
Mezinárodní doporučení WCAG 2.2 třídí přístupnost do čtyř oblastí: obsah má být vnímatelný, ovladatelný, srozumitelný a technicky robustní. Nejde o jednorázovou nálepku ani o automatický certifikát. Je to průběžná součást návrhu, vývoje a redakční práce.
1. Začněte srozumitelnou strukturou
Každá stránka potřebuje logické pořadí. Používejte skutečné nadpisy v hierarchii: hlavní téma jako H1, hlavní části jako H2 a jejich podčásti jako H3. Nadpis nevybírejte jen podle velikosti písma. Rozdělte stránku na sémantické oblasti, například hlavičku, hlavní obsah, navigaci a patičku. Pomáhá to lidem, kteří se po webu pohybují pomocí čtečky obrazovky, ale také návštěvníkům, kteří obsah pouze rychle skenují. Pořadí prvků v kódu by mělo odpovídat tomu, jak má člověk informaci číst.
2. Ověřte ovládání bez myši
Odložte myš a projděte celou stránku klávesou Tab. Zaměřte se na to, zda se dostanete ke všem odkazům, tlačítkům, polím i ovládání menu. Pořadí musí být přirozené a aktuální prvek musí být viditelně označený. Enter obvykle aktivuje odkaz, mezerník tlačítko; Escape může zavřít dialog nebo nabídku. U modálního okna zkontrolujte, že se fokus neztratí pod něj a po zavření se vrátí na místo, odkud bylo okno otevřeno. Pokud některá akce funguje pouze po najetí myší nebo přetažením, nabídněte také ovládání klávesnicí.
3. Zkontrolujte kontrast a význam barev
Text musí zůstat čitelný na pozadí i při slabším zraku nebo na nekvalitním displeji. Pro běžný text stanovuje WCAG na úrovni AA minimální kontrast 4,5:1; pro velký text 3:1. Kontrast se týká také důležitých ovládacích prvků a stavových indikátorů. Nesdělujte význam pouze barvou: chyba formuláře nemá být označena jen červeně, ale také textem nebo ikonou s popisem. Ověřte i barvu odkazu v odstavci a viditelnost fokusu. Kontrola odstínů v designovém nástroji je dobrý začátek, nikoli náhrada za prohlédnutí celé stránky.
4. Myslete na zvětšení a malé obrazovky
Web otestujte při zvětšení textu alespoň na 200 % a na úzkém mobilním zobrazení. Obsah by se měl přeskupit, nikoli zmizet nebo překrývat. U běžných textových stránek se snažte zabránit vodorovnému posouvání; výjimkou mohou být například široké datové tabulky, u nichž je třeba zvlášť promyslet dostupné ovládání. Tlačítka a odkazy musí mít dost místa, aby je šlo pohodlně stisknout prstem. Dlouhá česká slova, chybová hlášení i názvy položek menu se musí vejít do rozvržení, aniž by se ořezávaly.
5. Pište popisné odkazy a tlačítka
Text odkazu má říkat, kam vede nebo co se stane. Samotné „zde“ či „více“ neposkytuje dost informací, zvlášť když si člověk nechá vypsat odkazy ze stránky. Tlačítko označte slovesem popisujícím akci, například „Odeslat poptávku“ místo neurčitého „Pokračovat“. Odkaz použijte pro přechod na jinou stránku, tlačítko pro provedení akce. U ikonových tlačítek doplňte přístupný název, i když vizuálně obsahují pouze symbol. Při změně stránky nebo potvrzení akce musí být výsledek jasný také bez vizuální animace.
6. Přidejte smysluplné alternativy k obrázkům
Fotografie nebo diagram, které nesou informaci, potřebují stručný alternativní text vystihující jejich účel v daném kontextu. Nepopisujte každý detail, pokud nepomáhá porozumění. Dekorativní obrázek, který nepřináší novou informaci, má být pro čtečku skrytý pomocí prázdného alt atributu. Logo má mít název firmy, produktová fotografie může uvést podstatnou vlastnost produktu. Grafy doplňte textovým shrnutím důležitých hodnot. Pokud je obrázek zároveň odkazem, alternativa má vysvětlit cíl odkazu, nikoli jen vzhled obrázku.
7. Udělejte formuláře snadno pochopitelné
Každé pole potřebuje trvale viditelný popisek, který zůstane i po zadání hodnoty; samotný zástupný text uvnitř pole nestačí. Související možnosti seskupte a vysvětlete, která pole jsou povinná. Chybu popište konkrétně, například „Zadejte e-mail ve správném formátu“, a při odeslání vraťte fokus k prvnímu poli, které je třeba opravit. Nevymažte uživatelem vyplněná data. U více kroků ukažte, kde se člověk právě nachází, a před odesláním objednávky či poptávky mu umožněte zadané údaje zkontrolovat.
8. Zpřístupněte video, zvuk i pohyb
Video se zvukem potřebuje titulky, které zachycují řeč i důležité zvukové informace. U obsahu, kde obraz sděluje něco, co není řečeno, pomůže audiopopis nebo textová alternativa. Zvukový záznam doplňte přepisem. Nedovolte, aby se hlasitý zvuk spustil bez varování, a nabídněte přehrávání, pozastavení i ovládání hlasitosti. Automaticky se měnící obsah musí jít zastavit, zejména pokud se pohybuje vedle textu, který člověk právě čte. Vyhněte se blikání a rychlým efektům, které mohou vyvolat nepříjemnou reakci.
9. Pište jasně a používejte předvídatelné vzory
Krátké věty, konkrétní názvy a známé výrazy usnadňují orientaci lidem, kteří čtou pomaleji nebo se učí češtinu. Důležité instrukce nedávejte jen do obrázku či barvy. Menu, tlačítka a odkazy na různých stránkách pojmenovávejte stejně a umisťujte je předvídatelně. Pokud se po výběru možnosti objeví nový obsah, vysvětlete změnu. U každého kroku nákupu nebo formuláře napište, co se stane po odeslání. Srozumitelnost neznamená vynechat podrobnosti; znamená nabídnout je v pořadí, které odpovídá otázkám návštěvníka.
10. Testujte s lidmi, ne pouze nástroji
Automatické kontroly rychle odhalí část problémů, například chybějící alternativní text nebo některé kontrastní kombinace. Nedokážou ale spolehlivě posoudit, zda je text srozumitelný, pořadí navigace logické nebo formulář opravdu snadno opravitelný. Proto kombinujte automatický audit s ručním průchodem klávesnicí, zvětšením stránky, různými prohlížeči a alespoň jednou čtečkou obrazovky. Přizvěte k testování lidi, kteří používají asistivní technologie. Zapište nalezené překážky, určete jejich závažnost a po opravě ověřte, že se problém nevrátil na jiné stránce.
Evropská pravidla přístupnosti od 28. června 2025 pokrývají vybrané výrobky a služby, například některé služby elektronického obchodování. To samo o sobě neznamená, že se každý firemní web řídí stejnou povinností: rozhoduje rozsah konkrétní služby a případné výjimky. Přesné znění a seznam oblastí najdete v evropské směrnici o požadavcích na přístupnost. Technickým základem pro návrh webu jsou doporučení WCAG 2.2; právní rozsah pro konkrétní organizaci je třeba posuzovat samostatně.
Začněte jednou stránkou
Nemusíte předělávat celý web během jediného dne. Vyberte jednu důležitou cestu, například odeslání poptávky, a projděte ji očima různých návštěvníků. Opravte největší překážky, ověřte výsledek a přeneste funkční vzory i na další stránky. Přístupnost přináší největší užitek tehdy, když se plánuje od začátku a pravidelně kontroluje při každé aktualizaci obsahu. Potřebujete-li probrat úpravy svého webu, můžete se obrátit na tým blue.point Solutions prostřednictvím stránky Kontakt.
