Radek Pavlíček s Romanem Kabelkou vedli v předvečer letošního WebExpa hodně zajímavý workshop Přístupnost pro kodéry. Za mě prima přiležitost k aktualizaci znalostí od odborníků na slovo vzatých. Teď se vám pokusím předat pár informací, které ve mě utkvěly nejvíc. Protože – jak hezky Radek podotkl – právě frontendisti mohou s přístupností webů pomoci nejvíce.
1) WAI ARIA nekončí základními oblastmi. Nejobyčejnější oblasti stránky (banner, navigation, main, search a další) lze i pro prezentační weby rozšířit „rolemi” pro menší komponenty stránky – zaujalo například menu/menuitem pro vyznačení dropdown navigace, tab/tabpanel pro záložkovou navigaci nebo dialog pro modální okno. Možností jak něco na stránce označit je ale hrozně moc. Studujte na w3.org/TR/wai-aria/roles. Pokud děláte aplikace, je použitelných označení ještě daleko více.
Aktualizace: O WAI-ARIA už mám článek i na Vzhůru dolů. Včetně demonstračního videa.
2) Více navigací na stránce. Žádný problém. Mohu je pro odlišení pojmenovat návěštím (aria-label="…") nebo se ještě lépe odkázat na existující nadpis (aria-labelledby="…"). Někteří znáte ze zdrojáků Bootstrapu.
3) title & alt & longdesc, tři mušketýři. title="" na přístupnost nemá zásadní vliv. Je problematický nepříliš velkou podporou odečítačů, jinak též řečeno slepeckých čteček. Dobrý pomocník hlavně pro lidi co mají myš, u slepců víceméně jen jako dodatečný popisek ve formulářových prvcích. alt="" je naopak důležitý velmi. Prázdný alt="" znamená, že se element bude ignorovat. Obrázek bez atributu alt je nepřístupný. (A nevalidní.) Atribut longdesc umožňuje delší popis u obrázku, pokud by alt překročil 80 znaků.
4) Dva režimy čtečky. Nevěděl jsem, že čtečky umožňují oba módy – pasivně–sekvenční procházení pomocí nadpisové osnovy dokumentu nebo strukturované procházení pomocí WAI ARIA oblastí (role=""). Ten druhý způsob zrakově postižení zatím využívají méně, je ovšem velmi dobře podporovaný a výborně použitelný, takže na WAI ARIA rozhodně nezapomínejte! U aplikací je strukturovaný režim samozřejmě ještě důležitější.
5) U složitějších webů a aplikací nezpomínejte na klávesové zkratky. Je sice blbé, že pro ně neexistuje standard, jejich přítomnost je nicméně vždy vítána. Ideální je vložit skrytý odkaz na ně hned na začátek stránky. Velké české weby se shodly na jakémsi průniku a odkazují na tuto stránku. Najdete třeba v kódu Novinky.cz.
6) A zase – aplikace a prezentační weby jako naprosto odlišné světy. I v přístupnosti. Zatímco u prezentačních webů stačí pro obstojnou přístupnost dodržet dobrou nadpisovou osnovu, nezapomínat na alt="" obsah a přidat WAI ARIA oblasti. Tedy něco co dobře vycvičenému kodérovi nezabere prakticky žádný čás navíc. U aplikací to tak není – dobrá přístupnost si tam vezme dost energie při výrobě.
Teď pozor! Poslední bod vám udělá radost.
7) Ani table pro layout nemusí být prasárna. Pokud ji používáte jen pro formátovací účely, z pohledu přístupnosti může být v pohodě. Stačí přidat kouzelný WAI ARIA atribut presentation.
…
Dozvěděli jste se něco nového? Mám radost. Využijte to hned na aktuálním projektu. Pár minut vaší kóderské práce znamená velký přínos pro znevýhodněné uživatele.
Chcete vědět více? Rád vás odkážu na blog Radka Pavlíčka nebo jeho texty na Zdrojáku:
Komentáře
Máte doplnění, komentář nebo jste našli chybu?
Pro přidání názoru se prosím
přihlaste nebo si zřiďte účet.