Přístupnost

Tým nasadí na web overlay widget, ten slibuje „jeden řádek kódu a jste v souladu", a k tomu axe skener projde na zeleno. Pocit hotovo. Pak přijde uživatel s čtečkou obrazovky, dojede tabulátorem k modálnímu oknu a tam uvízne. Fokus se z modálu nedostane ven, čtečka čte název souboru místo popisu, a tlačítko „odeslat" je <div>, na který se klávesnicí nedá dostat. Skener tyhle věci neviděl. Widget je nespravil.

Ta scénka boří rovnou dva nejčastější mýty. Overlay neopravuje podkladový kód. A automatický skener vidí jen část problémů. Přístupnost není nálepka, kterou na hotový web přilepíš. Je to kvalita obsahu a rozhraní. Jednovětou definici pojmů jako WCAG nebo POUR drží společný slovník, tady je rozvádíme do postupu a uzavíráme právním koncem řetězu, stejně jako sesterská kapitola o právu, soukromí a souhlasu.

POUR jako čtyři otázky, ne checklist

WCAG stojí na čtyřech principech, zkratka POUR. Není to seznam k odškrtání, jsou to čtyři otázky, které si nad každým prvkem položíš.

Perceivable, vnímatelnost. Dostane se obsah ke smyslům uživatele i jinou cestou než tou výchozí? Obrázek má textovou alternativu, video titulky, text dostatečný kontrast. Když to nevidím nebo neslyším, musí to jít vnímat jinak.

Operable, ovladatelnost. Dá se rozhraní ovládat i bez myši? Všechno klikací musí jít obsloužit klávesnicí, fokus musí být vidět a logicky postupovat. Když potřebuju táhnout, musí existovat i varianta jedním klikem.

Understandable, srozumitelnost. Pochopí uživatel, co se děje a co má dělat? Předvídatelná navigace, jasné popisky, srozumitelné chybové hlášky. Tahle vrstva se potkává s informační architekturou: breadcrumb, skip-navigace a srozumitelné popisky, které GOV.UK testovala i s lidmi s kognitivními potřebami, jsou přístupnostní prvky.

Robust, robustnost. Přečte obsah i stroj, který neznám? Validní sémantické HTML, na které navazuje čtečka, hlasový asistent nebo zítřejší technologie. Tahle otázka je důvod, proč sémantika není kosmetika.

WCAG 2.2 (W3C Recommendation z 5. října 2023) tyhle čtyři principy rozpadá do 13 guidelines a měří je třemi úrovněmi shody: A, AA, AAA. Cíl pro běžný web je AA. Ne AAA. AAA má požadavky jako kontrast 7:1, které jsou na obsahový web často nepraktické, a hlavně je to úroveň, kterou po vás nikdo nevyžaduje. AA je to, co chce evropská norma i zákon, ke kterým se kapitola dostane na konci.

Sémantika je předpoklad, ne ozdoba

Robustnost stojí na tom, že HTML říká, čím prvky jsou. Nadpis je <h1> až <h6>, tlačítko je <button>, odkaz je <a>. Čtečka z téhle struktury staví navigaci: uživatel skáče po nadpisech jako po obsahu, vyvolá seznam odkazů, pozná formulářové pole. Když je tlačítko nastylovaný <div>, čtečka neví, že je to tlačítko, a klávesnice se na něj nedostane.

Tady přístupnost ústí přímo do obsahového modelu. Sémantické části místo jednoho bloku jsou předpoklad přístupnosti a alt je strukturované pole, ne dodatečná vrstva. Nadpisy nesmí přeskakovat úrovně, z <h2> se neskáče rovnou na <h4>. Přeskočená úroveň nadpisu je podle WebAIM Million chyba na 41,8 % stránek. A je to současně signál pro SEO, čtečka i Googlebot čtou tutéž strukturu.

Klávesnice a fokus

Test, který nic nestojí: odlož myš a projdi web tabulátorem. Dostaneš se na každý odkaz, tlačítko a pole? Vidíš, kde právě jsi? Postupuje fokus v pořadí, které dává smysl? Když ano, máš pokrytou velkou část ovladatelnosti.

WCAG 2.2 přidalo k fokusu nová kritéria. 2.4.11 Focus Not Obscured říká, že prvek s fokusem nesmí být schovaný za jiným prvkem, typicky za sticky hlavičkou nebo cookie bannerem. 2.4.13 Focus Appearance (AAA) chce indikátor fokusu silný aspoň jako 2px rámeček s kontrastem 3:1 vůči okolí. Časté zlo je outline: none v CSS, který viditelný fokus prostě zruší, aby „nerušil design". Tím se web stane neovladatelný pro každého, kdo nepoužívá myš.

Dvě další kritéria 2.2 míří na dotyk a mobil. 2.5.7 Dragging Movements (AA) vyžaduje, aby každá akce typu „táhni" měla alternativu jedním klikem nebo tapem. A 2.5.8 Target Size (AA) chce klikací cíl minimálně 24×24 CSS px, s výjimkou prvků, které mají kolem sebe dost odstupu. Malá ikonka křížku natěsnaná k jiné ikonce tohle nesplní.

Kontrast jsou čísla, ne pocit

Nejčastější chyba na webu vůbec je nízký kontrast textu. WebAIM Million 2026 ho našla na 83,9 % auditovaných úvodních stránek. Není to vágní „světle šedá na bílé vypadá líp", jsou to konkrétní poměry, které se dají změřit.

Co	AA	AAA
Běžný text	4.5:1	7:1
Velký text (≥ 24px, nebo ≥ 18.66px bold)	3:1	4.5:1
Netextové prvky (ikony, hranice inputů, grafika)	3:1	—

Pro AA tedy běžný text potřebuje aspoň 4.5:1, velký text 3:1. A pozor na poslední řádek, který se přehlíží. Kontrast 3:1 platí i pro netextové prvky. Hranice formulářového pole, ikona, stavová barva, ty musí být vidět taky, jinak uživatel nepozná, kde má psát. Měří se to nástrojem, ne okem.

Alt text: kontext, ne obrázek

Alt text už podrobně rozvádí kapitola o médiích a podkladech, včetně alt Decision Tree, takže ho tady neopisujeme. Stačí princip a tři pasti.

Alt popisuje funkci v kontextu, ne vzhled obrázku. Logo v hlavičce, které je odkazem na úvod, má alt="Přejít na hlavní stránku", ne „Logo XY". Ikona lupy v hledání má alt="Hledat", ne „lupa". Dekorativní obrázek, který nic nesděluje, dostane prázdné alt="", aby ho čtečka přeskočila. A alt="" není totéž jako chybějící atribut: bez alt čtečka často přečte název souboru. Chybějící alt našla WebAIM Million na 53,1 % stránek, a u velké části jde o obrázky, které jsou odkazem, takže výsledkem je rozbitá navigace pro čtečku. Tohle spadá pod WCAG 1.1.1, úroveň A, tedy úplný základ.

Automat vidí 40 %, čtečka 100 %

Tohle je jádro testovací strategie a zároveň konec mýtu „skener prošel, jsme přístupní". Automatické nástroje pokryjí jen zhruba 30 až 40 % kritérií. Najdou chybějící alt, špatný kontrast, nevalidní HTML, chybějící labely. To je užitečné a levné. Ale 60 až 70 % se automatem chytit nedá. Jestli má alt smysl, jestli nadpisy dávají logickou strukturu, jestli fokus postupuje rozumně, jestli se web dá doopravdy ovládat klávesnicí a jestli je obsah srozumitelný.

Že automat nestačí, ukazuje WebAIM Million 2026 v jednom čísle: i přes dostupné skenery mělo 95,9 % úvodních stránek detekovatelné WCAG selhání, průměrně 56,1 chyby na stránku. A to jsou jen ty chyby, které automat vidí. Reálné číslo je vyšší.

Testování má proto vrstvy. Automat běží v CI/CD jako kontrola kvality vedle Lighthouse, hlídá regrese a na úrovni error blokuje merge. To je levná pojistka proti tomu, aby se opravená věc znovu rozbila. Manuální test plus čtečka (NVDA, JAWS, VoiceOver) řeší smysl a ovladatelnost, tedy tu většinu, kterou automat nevidí. A přístupnost není jednorázovka před spuštěním: re-audit patří mezi průběžné úkoly správy a údržby, protože každá nová funkce umí bariéru vrátit.

Overlay widget není řešení

Mýtus „nasadíme overlay a je to vyřešené" je nejsilnější a nejdražší ze všech. Overlay je JavaScript, který se snaží přístupnost dolepit zvenčí za běhu stránky. Neopravuje podkladový kód, a často aktivně škodí: koliduje s čtečkou, kterou už uživatel má, a rozbíjí navigaci.

Čísla jsou jednoznačná. FTC v roce 2025 uložila firmě AccessiBe pokutu 1 milion dolarů za klamavou reklamu kolem automatické nápravy přístupnosti. Národní federace nevidomých označila overlaye za „škodlivé". A weby, které overlay nasadily, byly přesto žalovány, 800+ případů. Widget nebyl účinná obrana. Když si máš odnést jednu větu: overlay je marketing, ne náprava.

Curb cut: děláš to pro všechny

Než někdo namítne „to je charita pro pár lidí, zbytečnost pro náš web", obrať to. Funkce dělané pro lidi s postižením používá nakonec každý. Říká se tomu curb cut effect, podle obrubníkových nájezdů, které měly pomoct vozíčkářům a používá je každý s kočárkem, kufrem nebo nákupem. Titulky čtou lidé v hlučném baru i v tiché kanceláři bez sluchátek. Klávesnicovou ovladatelnost milují pokročilí uživatelé. Dobrý kontrast zachrání čitelnost na mobilu na přímém slunci.

A není to malá skupina. Podle WHO žije se závažným postižením asi 1,3 miliardy lidí, 16 % populace. Přesah se SEO taky není náhoda. Sémantické nadpisy a alt text jsou sdílený signál pro čtečku i pro Google. Přístupné je lépe indexovatelné. Přístupnost není daň navíc, je to UX pro širší publikum.

Legislativní konec řetězu

Stejně jako právní kapitola končí souladem s pravidly, končí tahle vymáhatelným řetězem. Evropská norma EN 301 549 definuje technické požadavky na přístupnost digitálních produktů a služeb a jako základ odkazuje na WCAG 2.2 úroveň AA. To je ten důvod, proč je cílem AA a ne AAA: AA je to, co norma vyžaduje.

Nad normou stojí European Accessibility Act (směrnice 2019/882), který platí od 28. června 2025. V Česku ho provádí zákon č. 424/2023 Sb. o požadavcích na přístupnost některých výrobků a služeb, účinný k témuž datu. Dozor vykonává Česká obchodní inspekce, gestorem je MPO, a pokuta dosahuje až 10 milionů Kč. Týká se hlavně e-shopů, bankovnictví, e-knih, dopravy a audiovizuálních služeb.

Výjimky existují, ale nejsou tak široké, jak se doufá. Mikropodniky poskytující služby a čistě B2B jsou z velké části vyňaty a lze uplatnit výjimku „nepřiměřená zátěž", k níž patří čestné prohlášení, že na přístupnost nebyla čerpána dotace. Hranice mikropodniku nebo B2B ale u e-shopu není triviální. K tomu patří accessibility statement s mechanismem zpětné vazby: kontakt a formulář pro nahlášení bariéry, reakce typicky do 15 pracovních dnů, prohlášení aktualizované aspoň jednou ročně.

Že web spadá pod zákon i bez evropské směrnice, předvedly USA už dřív. V kauze Robles v. Domino's Pizza nevidomý zákazník nemohl přes čtečku objednat pizzu. Soud v roce 2019 rozhodl, že protidiskriminační zákon ADA dopadá i na web, a Nejvyšší soud USA v říjnu 2019 odmítl věc převzít, čímž rozsudek potvrdil. Precedent zní: web je veřejné prostranství.

Není to zbytečné pro malý web?

„Čtečka, manuální audit, accessibility statement, to je aparát pro korporát, my máme pětistránkovou vizitku." Zčásti to sedí. Plný audit s NVDA na pět stránek nemusíš dělat každý týden a část právních povinností tě jako mikropodnik mine.

Co se neškáluje dolů, jsou otázky. Projdu web tabulátorem od shora dolů? Má text kontrast aspoň 4.5:1? Má každý obrázek smysluplný alt, nebo dekorativní alt=""? Jsou nadpisy <h1>–<h6> v logickém pořadí a tlačítka opravdu <button>? Tyhle platí pro vizitku stejně jako pro velký web a většinu zvládneš sám za odpoledne. Inventuru toho, co web reálně obsahuje, odhalí už discovery, a nepřístupné UI je legitimní důvod redesignu. A cookie banner z právní kapitoly musí být sám přístupný, tedy ovladatelný klávesnicí a s dostatečným kontrastem. Tady se obě kapitoly o souladu s pravidly potkávají. Škáluje se aparát, ne otázka.

Praktický checklist

• POUR jako čtyři otázky nad každým prvkem: vnímám, ovládám, rozumím, přečte to stroj.
• Cílem je WCAG 2.2 úroveň AA (to chce EN 301 549 a EAA), ne AAA.
• Sémantické HTML: nadpisy <h1>–<h6> bez přeskoků, tlačítka <button>, odkazy <a>.
• Celý web projde tabulátorem; fokus je vidět (žádné outline: none) a postupuje logicky.
• Kontrast textu aspoň 4.5:1 (velký text 3:1), netextové prvky 3:1, měřeno nástrojem.
• Klikací cíle aspoň 24×24 px; akce „táhni" mají alternativu jedním klikem.
• Alt text podle funkce v kontextu; dekorativní alt="", nikdy chybějící atribut.
• Automat běží v CI jako brána proti regresím; smysl a ovladatelnost testuje člověk s čtečkou.
• Re-audit je průběžný, ne jednorázový před spuštěním.
• Tam, kde to zákon žádá, existuje accessibility statement a mechanismus pro nahlášení bariéry.

Typické chyby

• Overlay widget jako řešení. Neopravuje kód, často škodí; FTC pokuta 1 mil. USD, 800+ žalob webů s overlayem.
• „Skener prošel, jsme přístupní." Automat pokryje 30–40 %; smysl altu, logika fokusu a ovladatelnost jsou manuální.
• AAA jako cíl. Pro běžný web nepraktické; vyžaduje se AA.
• outline: none. Zruší viditelný fokus a znepřístupní web pro klávesnici.
• Nízký kontrast. Nejčastější chyba na webu, 83,9 % stránek; je to měřitelné číslo, ne vkus.
• Chybějící alt místo alt="". Čtečka přečte název souboru, hlavně u obrázků-odkazů to rozbíjí navigaci.
• Přístupnost na konci projektu. Drahé opravy zpětně; sémantika a alt patří do obsahového modelu a CI od začátku.

Zdroje

• W3C WAI — WCAG 2.2 (Recommendation 5. 10. 2023), POUR, úrovně A/AA/AAA, Easy Checks, alt Decision Tree.
• WCAG 2.2 nová kritéria: 2.4.11 Focus Not Obscured, 2.4.13 Focus Appearance, 2.5.7 Dragging Movements, 2.5.8 Target Size, 3.3.8 Accessible Authentication.
• WebAIM — Million 2026 a 2025 (95,9 % stránek se selháním, kontrast 83,9 %, alt 53,1 %, nadpisy 41,8 %), Contrast (poměry AA/AAA).
• Deque — automatické pokrytí ~30–40 % kritérií.
• EN 301 549 (odkaz na WCAG 2.2 AA); EAA, směrnice 2019/882 (platnost 28. 6. 2025).
• Zákon č. 424/2023 Sb.; dozor ČOI, gestor MPO, pokuta až 10 mil. Kč; výjimky pro mikropodniky a B2B.
• Robles v. Domino's Pizza (9. obvod 2019, Nejvyšší soud USA odmítl převzít, říjen 2019).
• FTC vs. AccessiBe (2025, 1 mil. USD); NFB stanovisko k overlayům.
• WHO — 1,3 miliardy lidí (16 %) se závažným postižením; curb cut effect.

Tahle kapitola je přístupnostní konec řetězu, který zbytek wiki rozehrává. Definici WCAG a POUR drží slovník, alt text a titulky podrobně rozvádí média a podklady, sémantiku a alt jako pole zakládá obsahový model. Navigaci a srozumitelnost sdílí s informační architekturou, automatické kontroly v CI s CI/CD, re-audit se správou a údržbou. Se SEO sdílí sémantické signály, s redesignem důvod přepsat nepřístupné UI, a s právem, soukromím a souhlasem jak právní strukturu, tak přístupný cookie banner. Inventuru toho, co web obsahuje, zakládá discovery.