Archiv štítku: Webdesign

Testování přístupnosti webu: doporučené kombinace screen readeru a prohlížeče

Testujete (či se chystáte testovat) přístupnost webových stránek s odečítači obrazovky a zajímá Vás, s jakými konkrétními kombinacemi odečítačů obrazovky a webových prohlížečů dává smysl takové testy dělat? Na základě svých zkušeností, potvrzených nedávnou diskusí na Twitteru, a také na základě výsledků 2016 GOV.UK assistive technology survey, doporučuji pro jednotlivé operační systémy používat následující kombinace.

MS Windows

Na Windows (stále nejpoužívanější platforma) jsou mezi nevidomými uživateli dlouhodobě nejpoužívanější následující dvě kombinace – JAWS s Internet Explorerem a NVDA s Mozilla Firefox. Pokud zatím nejste s prací se screen readerem zcela obeznámeni (či si ji chcete připomenout), doporučuji k prostudování dva návody

Je také dobré vědět, že:

  • i přes 100 % získaných na www.html5accessibility.com, MS Edge bohužel zatím neposkytuje dostatečnou podporu jak pro JAWS, tak NVDA, takže testovat s ním v současné době nedává smysl (byť toto by se mělo v nejbližší době zlepšit a některá z dalších aktualizací JAWSu 18 by měla s Edge spolupracovat).
  • Podobně je na tom Google Chrome, jehož spolupráce se screen readery je stále taková „vachrlatá“.
  • JAWS i NVDA nejsou standardní součástí systému, je potřeba je nejprve nainstalovat. U NVDA je případně možné použít i portable verzi.
  • JAWS nabízí 40 minutovou demoverzi, kterou ale dle licenčních podmínek nelze používat k testování. NVDA je open source odečítač, který žádné takové omezení nemá.
  • JAWS spustíte poklepáním na jeho zástupce na Ploše, ukončíte jej pomocí klávesové kombinace Insert + F4.
  • NVDA spustíte poklepáním na jeho zástupce na Ploše, ukončíte jej pomocí pomocí klávesové kombinace CapsLock + Q.

OS X a iOS

Na zařízeních od Applu, které běží na operačních systémech OS X či iOS, je nejlepší testovat s kombinací VoiceOver a Safari. VoiceOver je nedílnou součástí systému a stačí jej spustit

  • na OS X pomocí Command+F5 (stejnou klávesovou kombinací jej pak lze i ukončit).
  • Na iOS buď přes Nastavení – Obecné – Zpřístupnění, vhodnější je ale nadefinovat si spuštění/ukončení VoiceOveru na trojí stisknutí tlačítka Plochy (více informací viz VoiceOver na iOS (příručka).

Stručný návod v angličtině, jak testovat přístupnost webu s VoiceOverem, je pak k dispozici v článku Using VoiceOver to Evaluate Web Accessibility.

Android

Na zařízeních s Androidem je k testování možné použít screen reader TalkBack s prohlížečem Google Chrome (nebo nejnovějším Firefoxem). TalkBack je – stejně jako VoiceOver – nabízen jako součást operačního systému, takže jej opět stačí jen spustit přes Nastavení – Přístupnost. Bližší informace k různým možnostem spouštění viz Zapnutí aplikace TalkBack, vypnutí TalkBacku se dělá přes Nastavení > Usnadnění > TalkBack.

Při testování na iOS nebo Androidu se vám může hodit Přehled gest pro ovládání mobilních zařízení s odečítači VoiceOver a TalkBack.

Roman Kabelka, lektor workshopu Úvod do tvorby webu v redakčním systému WordPress

Co je třeba umět

Pokud jste dočetli až sem, nejspíš to s testováním přístupnosti pomocí screen readeru myslíte opravdu vážně. Což je z obecného úhlu pohledu dobře, protože seznámení se s potřebami a způsobem práce jedné z cílových skupin určitě není na škodu. Ale pozor, není to tak snadné, jak se může na první pohled zdát. Rozhodně neplatí to, že si vezmete do ruky mobil, spustíte odečítač a začnete testovat – tak jednoduché to bohužel není, viz můj starší článek Má smysl testovat svépomocí přístupnost webu pomocí screen readeru?).

Jestliže chcete, aby takové testování za něco stálo a obdrželi jste na základě něj relevantní výsledky, je třeba se dobře seznámit s tím, jak screen readery fungují, porozumět principům, na kterých pracují, a naučit se je obsluhovat. Pomoci vám v tom mohou například tutoriály, odkazované na konci tohoto článku. Bez těchto znalostí nedává moc smysl testovat přístupnost webu tímto způsobem, protože můžete

  • za problém v přístupnosti mylně považovat chyby, které ale budou způsobeny vaší neznalosti obsluhy screen readeru,
  • to, že „screen reader něco čte“, vyhodnotit jako potvrzení toho, že kontrolovaný prvek je přístupný (přestože tomu tak v reálu vůbec být nemusí).

Než se tedy do testování přístupnosti pustíte, zkuste si nejprve projít výše odkazované tutoriály a pokud na to máte prostor, tak není ani věci získat širší znalosti o přístupnosti například prostřednictvím některého z MOOCů o přístupnosti, které jsou aktuálně či v dohledné době nabízeny.

Pokud byste měli k testování přístupnosti se screen readery nějaký dotaz, zkuste na něj buď najít odpověď na Testing with Screen Readers – Questions and Answers, nebo jej napište sem do komentářů.

Přehled doporučených kombinací čtečky obrazovky a prohlížeče

  • MS Windows: JAWS + Internet Explorer; NVDA + Mozilla Firefox
  • OS X a iOS: VoiceOver + Safari
  • Android: TalkBack + Google Chrome (eventuálně Mozilla Firefox)

Přehled doporučených studijních materiálů

Na koho se obrátit, když si chci nechat vytvořit skvěle přístupný web

Žádostí o doporučení webdeveloperského studia či freelancera, který umí vytvořit přístupný web, jsem dostal v poslední době několik. Své tipy jsem sepsal, a protože by mohly posloužit i někomu dalšímu, dávám je veřejně k dispozici.

Tak pojďme na to 🙂

Kdybych si chtěl nechat vytvořit přístupný e-shop, oslovil byl buď PeckaDesign, nebo w3w.cz. Co jsem měl možnost seznámit se (a používat) výsledky jejich práce, tak v obou případech se jednalo z hlediska přístupnosti o velmi povedené e-shopy.

Pokud bych potřeboval schopného frontendistu, obrátil bych se buď na Martina Michálka, nebo na Superkodéry, protože je považuju za naprostou špičku v oboru.

Kdybych sháněl webového grafika, který nenahlíží na web jako na sadu plakátů propojených odkazy a neulétává na titěrném a obtížně čitelném písmu, určitě bych oslovil Pavla Kouta z WEBface nebo Daniela Střelce. S Pavlem jsme se potkali u několika projektů a Daniel je mimo jiné autorem obrázku/loga v záhlaví Blind Friendly Webu.

Kdybych byl zastupitel obce nebo města a sháněl dodavatele, který by mi vytvořil přístupný obecní nebo městský web, určitě bych kontaktoval WEBHOUSE. Přístupnosti se věnují dlouhodobě a s jejich redakčním systémem lze bez obtíží vytvořit přístupný web.

Přípravu nového webu (nebo redesign toho stávajícího) bych se určitě nebál svěřit Pixymu, Plaváčkovi, Vítkovi Dlouhému z Nuvio, Michalu Malénkovi nebo Janu Brblovi Bažantovi. Pixy je mimo jiné spoluautorem Dogma W4 i původních českých Pravidel přístupnosti, která vznikla ještě na Ministerstvu informatiky. S Plaváčkem jsme spolupracovali na zpřístupnění webu obce Třebihošť, který dodnes používám na školeních jako příklad toho, jak se to má dělat, s Vítkem na zpřístupnění webu ČÚZK, no a Michal je autorem stávající podoby Blind Friendly Webu (která mimochodem vychází z šablony od Nuvio Templates). S Brblou jsme pak svého času velmi intenzivně spolupracovali na co nejlepším zpřístupnění webu Knihovny digitálních dokumentů.

No a kdybych hledal nějaké open source řešení, jednoznačně bych sáhnul po WordPressu. Přijde mi, že má nejpropracovanější přístupnostní ekosystém (hodně wordpressích vzhledů/themes je accessibility ready) a má přístupný nejen frontend, ale i backend. No a když na něm běží i POSLEPU, tak to určitě nebude špatná volba 🙂

Výčet výše určitě není úplný a je skoro jisté, že jsem na někoho se zkušenostmi v oblasti přístupnosti zapomněl 🙁 Tvoříte weby a berete při tom přístupnost na zřetel? Nenašli jste se v tomto seznamu a chtěli byste v něm být? Připomeňte se mi prosím v komentářích a něco s tím provedeme 🙂

Děkuji.