Centrum proti hybridním hrozbám  

Přejdi na

Státní služba  


Rychlé linky: Mapa serveru Textová verze Rozšířené vyhledávání


 

Hlavní menu

 

 

Přístupný web a jak se vyvarovat chyb

Za přístupný web lze dnes považovat takový web, který bude návštěvník s těžkým zdravotním postižením schopen i přes svůj zdravotní handicap, za pomoci prostředků, které má k dispozici, a způsobem, který mu vyhovuje, efektivně používat a dosáhnout svého cíle.
 
Česká republika se v roce 2008 definitivně zařadila mezi země, které odstraňují bariéry v přístupu těžce zdravotně postižených k informacím prezentovaným prostřednictvím internetu. Dne 28. února 2008 byla ve Sbírce zákonů zveřejněna vyhláška č. 64/2008 Sb., o formě uveřejňování informací souvisejících s výkonem veřejné správy prostřednictvím webových stránek pro osoby se zdravotním postižením (vyhláška o přístupnosti).
 
Přístupnost ovlivňuje celá řada aspektů - zdravotní postižení uživatele, technické zpracování webu, zkušenosti konkrétního uživatele s prací s webem, zkušenosti konkrétního uživatele s prací s asistivní technologií, použitá asistivní technologie, její konfigurace a verze, použitý prohlížeč a preference a zvyklosti konkrétního uživatele. Při tvorbě přístupného webu je tedy velmi vhodné věnovat pozornost všem aspektům, které přístupnost ovlivňují. Jen tak lze docílit toho, že web bude přístupný reálně, a ne jen formálně.
 
Přístupnost bývá bohužel často vnímána a omezována pouze na rovinu technickou, to znamená, jak kvalitní je kód stránky, respektive, zda web vyhovuje pravidlům některé z metodik přístupnosti. Technická rovina je jistě důležitá a přispívá k lepší přístupnosti, je ale velkou chybou přístupnost zužovat pouze na ni, či na doslovný soulad s některou metodikou přístupnosti. Výsledkem takové snahy jsou sice technicky kvalitně zpracované, ale ne vždy reálně přístupné weby, které by mohli zdravotně znevýhodnění uživatelé opravdu efektivně používat. Více informací k tomuto tématu přinesl webový magazín Zdroják v článku nazvaném 7 aspektů, které mají vliv na přístupnost.
 
Co jsou bariéry?
Pro instituce veřejné správy by měl být přístupný web již samozřejmostí. Jednak jim to s platností od 1. 3. 2008 ukládá zákon č. 365/2000 Sb., o informačních systémech veřejné správy, a prováděcí vyhláška č. 64/2008 Sb., o přístupnosti. Zejména však proto, že primárním účelem těchto webů je poskytovat informace všem občanům bez rozdílu.
 
Bohužel, ne vždy se tak děje a zdravotně znevýhodnění návštěvníci na webových stránkách stále narážejí na řadu menších či větších bariér. Pojďme se podívat, jaké jsou nejčastější bariéry a jakým způsobem je odstranit.
 
Nadpisy
Základem moderního pojetí přístupnosti je sémantický kód, v němž výsadní postavení mají korektně vyznačené nadpisy (značky h1 až h6). Web, na němž nejsou v souladu se specifikací používány nadpisy, budou nevidomí návštěvníci považovat za velmi obtížně přístupný, i kdyby všechny ostatní požadavky z hlediska přístupnosti byly naplněny. Nadpisy slouží návštěvníkům stránky jako důležité záchytné body a třeba nevidomí se mohou pomocí funkcí svého screenreaderu na jednotlivé nadpisy velmi rychle přemístit. Nadpisy uvozují jednotlivé části stránky a uživatel tedy ví, že to, co je mezi jednotlivými nadpisy, patří z logiky věci k sobě. Proto je velmi důležité, aby pomocí nadpisů byly uvozeny všechny důležité části stránky. Tedy nejen hlavní obsah stránky, ale i navigační části, vyhledávání atp.
 
Všechny nadpisy samozřejmě nemusí být viditelné. Ty, které se nehodí do designu stránky, lze vhodným způsobem (absolutní pozicování mimo viditelnou oblast stránky) skrýt. Použít lze například následující třídu:
.skryj {position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden}
 
Důležitá je i hierarchie nadpisů. Jedním z vhodných řešení může být například následující strukturování:
  • h1: Logo, název organizace
  • h2: Hlavní menu
  • h2: Menu sekce
  • h1: Titulek stránky
  • h2 až h6: Strukturování obsahu stránky
Přístupnost z klávesnice
Řada zdravotně znevýhodněných návštěvníků webových stránek - nejen nevidomí, ale třeba uživatelé s motorickým postižením horních končetin - používá k ovládání webu výhradně klávesnici. Proto je velmi důležité, aby web byl plně ovladatelný z klávesnice. Bohužel, ne vždy tomu tak ale je. Na vině jsou zpravidla nejrůznější typy rozbalovacích menu. Některé z nich nejsou z klávesnice přístupné vůbec, u některých je z klávesnice přístupná jenom část položek, u jiných jsou z klávesnice přístupné pouze položky na nejvyšší úrovni nabídky, ale k položkám v rozbalené podnabídce už se z klávesnice dostat nedá. Všechny tři situace jsou nepříjemné, protože v lepším případě se uživatel, ovládající web pouze z klávesnice, dostane jen k některým položkám, v tom horším případě k žádné.
 
Řešení tohoto problému spočívá v použití takového způsobu navigace, který umožňuje přístup z klávesnice i k položkám z podnabídek. Příklady vhodného řešení mohou být web města Buštěhrad nebo stránky města Úštěk. Po potvrzení položky je zobrazena stránka, na níž je obsah nepřístupné podnabídky zopakován a uživatel se tak k ní může bez problémů dostat.
 
Grafická CAPTCHA
Ochrana formuláře pomocí grafické CAPTCHA je další velkou překážkou, na kterou může nevidomý uživatel narazit. I přesto, že už dnes existují nástroje, které mohou grafickou CAPTCHA rozluštit (WebVisum) nebo nabídnout i audio podobu (CAPTCHA API od Seznam.cz), je lepší se tomuto způsobu ochrany formulářů vyhnout a použít nějaký jiný. Nabízí se řešení pomocí logické hádanky, případně skrytí editačního pole v kombinaci s vyplňování JavaScriptem. Toto řešení je k vidění například na stránkách obce Třebihošť v rubrice Kontakty.
 
U alternativních textových popisků grafických prvků obecně není již dnes situace tak kritická jako před několika lety, protože grafické prvky se na důležitých místech stránky (hlavní navigace) většinou nevyskytují. Pravidlo o poskytování textové alternativy pro grafické prvky, nesoucí významovou informaci, ale samozřejmě v platnosti zůstává a dostává se ke slovu tam, kde je obrázek použit jako nosič informace.
 
Formuláře
Nevidomí uživatelé jsou dnes schopni pracovat i s poměrně komplikovanými formuláři za předpokladu, že je dodrženo několik pravidel, která nevidomým práci s formulářem umožní, případně usnadní. Tím základním je korektní vazba mezi formulářovými prvky a jejich popisky pomocí značky label a vazebních atributů for a id, zajišťující spolehlivou identifikaci toho, k čemu formulářový prvek slouží. Složitější formuláře je vhodné rozčlenit do skupin pomocí značek fieldset a legend. Ke správně vytvořenému formuláři dnes také patří upozornění na povinnou položku v textové podobě (ideálně umístěné před prvkem a jako součást jeho popisku) a ošetření chyb při zadávání údajů formuláře.
 
Dostatečný barevný kontrast
Dostatečný barevný kontrast písma je jeden z poměrně častých prohřešků i přesto, že požadavky na kontrast se v poslední době velmi zmírnily. Aktuálně používaným algoritmem je algoritmus světelnosti a požadované hodnoty jsou minimálně 4,5:1 pro běžné písmo do velikosti 18 bodů nebo tučné písmo do velikosti 14 bodů. Pro měření kontrastu lze použít například výborný desktopový Colour Contrast Analyzer či online Colour Contrast Checker.
 
Zvýraznění prvku, který má focus
S dostatečným kontrastem barev úzce souvisí i dostatečné zvýraznění prvku, který má focus nejen při najetí kurzoru myši, ale i z klávesnice. V mnoha případech je zvýraznění řešeno pouze systémovým rámečkem, což především u stránek s menším písmem a množstvím odkazů nemusí být dostačující. Řešení tohoto problému je přitom poměrně jednoduché - v CSS ke každému :hover přidat ještě dvě stejné definice s :active (pro IE) a :focus (pro moderní prohlížeče). Ideálním zvýrazněním je invertování barvy textu a pozadí odkazu. Procházení z klávesnice je vhodně ošetřeno například na webu obce Petrovice.
 
Alternativní verze vzhledu webu
Alternativní verze webu je používána jako jedno z řešení problémů s nedostatečným kontrastem barev v primární verzi webu. Toto řešení je akceptovatelné v případě, kdy jsou splněny následující požadavky:
  1. Odkaz na alternativní verzi musí být dostatečně výrazný a dostatečně blízko začátku stránky, aby si jej slabozraký uživatel vůbec všiml a mohl alternativní verzi používat.
  2. Alternativní verze musí být obsahově shodná s verzí primární a musí být stejně často aktualizována.
  3. Alternativní verze musí být navržena tak, aby odpovídala požadavkům na přístupnost a současně lahodila oku a zdravotně znevýhodněný uživatel ji tedy byl schopen a ochoten používat.
Ne vždy se tvůrcům webů daří výše uvedené požadavky dodržet. Ideální je snažit se mít co nejvíce kontrastní už primární verzi a tu alternativní nabídnout pouze jako bonus pro ty, kterým primární verze z nějakého důvodu nevyhovuje. Příkladem takového řešení může být web obce Třebihošť.
 
Nezávislost na barevném schématu
Další poměrně častou chybou je špatné zobrazování obsahu stránky při nastavení jiného než standardního barevného schématu vzhledu operačního systému. Slabozrací uživatelé jiné barevné vzhledy velmi často používají, ale v mnoha případech není web či jeho části (typicky formuláře) při nastavení jiného schématu čitelný. Náprava je přitom poměrně snadná - při definicích barev definovat barvu popředí a pozadí, nebo oboje nechat nedefinováno.
Pokud to neuděláte, dochází k nežádoucímu chování: jedna barva je invertována, ale druhá nikoliv a výsledkem je například černý text na černém podkladu. K ověření toho, že váš web tímto problémem netrpí, vyzkoušejte jeho čitelnost a funkčnost ve dvou nejčastěji používaných schématech (vysoký kontrast - černá, a vysoký kontrast - bílá).
 
text Mgr. Radek Pavlíček

 
Další zdroje informací o přístupnosti
Tématikou přístupnosti se v České republice již od roku 2000 zabývá projekt Blind Friendly Web. V jeho rámci v nedávné době mimo jiné vznikly i překlady několika zahraničních materiálů (například část metodiky WCAG 2.0), které vám mohou v implementaci přístupnosti pomoci. Weblog POSLEPU je pak v současnosti prakticky jediným pravidelně aktualizovaným zdrojem, přinášejícím informace z této oblasti.
 
Doporučené nástroje a stránky:
Colour Contrast Analyzer www.paciellogroup.com/resources/contrast-analyser.html
Colour Contrast Checker http://webaim.org/resources/contrastchecker
Část metodiky WCAG 2.0 přeložená do češtiny www.blindfriendly.cz/wcag20/

vytisknout  e-mailem 

MVČR 
internetové stránky Policie ČR