Přístupný web v praxi · BUMeeting · 7. 11. 2026
Přihlaste dítě.
Bez myši.
Našli byste na školním webu termín zápisu
a cestu k přihlášce?
Web funguje.
Pro koho?
Když se rodič nedostane k přihlášce,
krásný web svůj úkol nesplnil.
Bariéra na webu má důsledek mimo obrazovku.
Kdo vás dnes provede
Jan Polzer
Tvořím weby. Školím.
Pomáhám hledat, co nefunguje.
25 let s weby · Drupal · WordPress
přístupnost · použitelnost · kvalita
Dnes si odnesete
tři schopnosti.
- Poznat běžnou bariéru.
- Prověřit ji jednoduchým pokusem.
- Popsat dodavateli konkrétní opravu.
Na závěr se můžeme podívat i na váš web. Dobrovolně.
Stejný web.
Různé způsoby použití.
Bez myši
Najdu přihlášku?
Se čtečkou
Co je na plakátu?
Se zvětšením
Přečtu jídelníček?
Na slunci
Vidím odkaz?
Kam se poděl
můj focus?
Špatně
Nabídka jen po najetí myší.
Tabulátor „někam“ skáče.
Aktivní prvek není vidět.
Správně
Ovládání klávesnicí.
Logické pořadí.
Jasně viditelné zvýraznění.
TabShift + TabEnterEsc
Vyzkoušet živě ↗Klávesnice · vyskakovací okna
Popup je nahoře.
Focus zůstal dole.
Špatně
Tab putuje za překryvem.
Zavírání funguje jen myší.
Po zavření nevím, kde jsem.
Správně
Focus vstoupí do dialogu.
Tab zůstává uvnitř.
Esc zavře a focus se vrátí.
Velké písmo
ještě není nadpis.
Špatně
Zápis do první třídy
Nadpis vytvořený pouze
zvětšením a tučným písmem.
Správně
H1 Zápis do první třídy
H2 Termín a místo
H2 Co přinést
V editoru vybírejte úroveň nadpisu podle struktury.
„Zde“ vám
nic neřekne.
Špatně
Informace najdete zde.
Přihlášku stáhnete zde.
Podrobnosti jsou zde.
Správně
Termín a průběh zápisu
Přihláška k zápisu (PDF)
Kontakty na školu
Popište cíl odkazu. Usnadníte hledání všem.
Termín zápisu
nesmí zmizet s obrázkem.
Špatně
12. DUBNA
14–17 hodin
Jediný zdroj informací: obrázek.
Správně
Zápis do 1. třídy
12. dubna, 14–17 hodin
Budova školy, hlavní vchod
Podstatné informace také jako text na stránce.
Atribut alt ano.
Popis ne vždy.
Stručná náhrada podle účelu obrázku.
alt="" — čtečka obrázek přeskočí.
Název musí vyjádřit jeho funkci.
Prázdný alt není totéž co chybějící alt.
Porovnat konkrétní příklady ↗Přečtete to
i ze zadní řady?
Termín zápisu do první třídy
Příliš světlý text na bílém pozadí.
Přečtete to
i ze zadní řady?
Termín zápisu do první třídy
Čitelnost ověřujte měřením i v reálném použití.
Zvětšete stránku na 200 %. Zůstává dostupný text i ovládání?
Vyzkoušet živě ↗Červený rámeček
není návod.
Špatně
Popisek zmizí při psaní.
Chyba je jen červený okraj.
„Špatně vyplněno.“
Správně
Popisek zůstává vidět.
Chyba je popsaná textem.
„Zadejte e-mail ve tvaru
jmeno@domena.cz.“
Co opravíte vy.
Co zadáte dál.
Redakce
Nadpisy a texty odkazů
Smysluplné alternativy
Informace také v textu
Dodavatel
Ovládání klávesnicí
Dialogy a práce s focusem
Šablona a formuláře
Kontrast a dokumenty často vyžadují spolupráci.
„Opravte přístupnost“
je málo.
Na stránce Zápis se pomocí Tab nedostanu
na tlačítko Přihláška. Otevřený popup
navíc zakrývá aktivní odkaz.
Přiložte adresu, postup, očekávaný výsledek
a snímek nebo krátký záznam.
První kontrola
za pět minut.
- Najdu důležitý úkol bez myši?
- Vidím vždy, kde právě jsem?
- Dávají smysl nadpisy a odkazy?
- Zůstane stránka použitelná po zvětšení?
- Rozumím formuláři i jeho chybám?
WAVE: kde začít
hledat problém.
Vložíte adresu veřejné stránky.
Prohlédnete konkrétní nález.
Ověříte jeho význam v kontextu.
Nula chyb v nástroji ≠ přístupný web.
Měřte kontrast.
Zkoušejte chování.
WebAIM Contrast Checker
webaim.org/resources/contrastchecker ↗
Accessibility Insights · pro zájemce
accessibilityinsights.io ↗
Klávesnice a zvětšení prohlížeče jsou po ruce hned.
Kdo nám půjčí
svůj školní web?
Jeden úkol. Pár minut.
Co funguje — a kde začít s opravou.
Dobrovolně. Bez žebříčku, bez přihlašování.
Záložní ukázka, pokud se nikdo nepřihlásí ↗V pondělí:
zápis, kontakty, jídelníček.
- Projděte je bez myši.
- Opravte jednu chybu v obsahu.
- Pošlete jeden konkrétní požadavek.