Archiv štítku: Screen Reader

Jak na jednoduchý audit přístupnosti – otestujte si bezbariérovost svého webu

Schopnost otestovat si, zda web, který vytvářím, neobsahuje žádné zásadní prohřešky proti pravidlům přístupnosti, by měla patřit mezi základní dovednosti každého webdesignéra. S tím, jak si takový jednoduchý audit přístupnosti webu udělat, seznamuje diváky v následujícím videu Rob Dodson. A protože mnou doporučovaný postup vypadá až na drobnosti prakticky stejně, pojďme si ukázat, jak takový jednoduchý audit provést a na co se zaměřit.

How I do an accessibility audit — A11ycasts #11

Jednoduchý audit přístupnosti pokrývá následující stěžejní oblasti

Přístupnost a ovladatelnost prvků webové stránky z klávesnice

První věc, kterou je vhodné zkontrolovat, je přístupnost a ovladatelnost prvků z klávesnice. Klávesnice je nejdostupnější nástroj pro testování přístupnosti webu, protože i přes čím dál větší zastoupení mobilních zařízení se stále jedná o primární vstupní zařízení a každý uživatel ji má po ruce.

Jak na to? Přístupnost z klávesnice velmi jednoduše otestujeme tak, že na klávesnici začneme mačkat tabulátor. Pokud jsme se tímto způsobem schopni dostat na každý prvek a máme možnost jej z klávesnice obsloužit, pak je vše v nejlepším pořádku.

Nezapomeneme také ověřit, zda

  • prvek, který při ovládání z klávesnice získá focus, je dostatečně zvýrazněn a uživatel je tak vizuálně informován o tom, na jakém prvku se právě nachází.
  • na stránce není žádný obsah mimo viditelnou oblast obrazovky, který může nedopatřením získat focus,
  • na stránce jsou k dispozici přeskakovací (skip to) odkazy.

Vyzkoušení jednoduché navigace po webu pomocí screen readeru

Znalost alespoň základní obsluhy některého ze screen readerů by dnes už měla také patřit mezi dovedosti tvůrců webů. Od webového vývojáře se samozřejmě neočekává, že bude znát všechny jejich funkce a bude schopen plnohodnotně nasimulovat práci nevidomého uživatele. Cílem je provést základní otestování, zda na uživatele screen readeru nečeká na webové stránce nějaká past, znemožňující mu práci s ní – tedy zda grafické prvky mají alternativní textové popisky, prvky, které slouží k interakci s uživatelem (tlačítka, rozbalovací seznamy…), je možné obsloužit, či zda dynamicky zobrazený obsah získá focus.

Více informací o tom, jaké kombinace screen readerů a prohlížečů (a jakým způsobem) používat, najdete v článcích

Adam na workshopu JAWS a braille

Strukturování webové stránky – nadpisy, oblasti stránky

Správné strukturování webové stránky korektně vyznačenými nadpisy a oblastmi stránek pomáhá uživatelům screen readerů v porozumění tomu, jak je webové stránka rozvržena. Umožňuje jim také efektivní práci s webem a nabízí možnost rychle se přesunout právě na tu část stránky, kterou potřebují. Dobře vytvořenou strukturu stránky si můžeme představit jako obsah knihy – podobně, jako z obsahu získáme představu o názvech kapitol a díky vazbě název kapitoly–číslo stránky se můžeme rychle v knize přesunout tam, kam potřebujeme, stejnou službu udělá uživateli screen readeru nadpisová osnova a oblasti stránky.

Další informace lze najít v článcích Jak definovat strukturu v HTML a proč jsem začal mít rád HTML5 tagy a Jak přístupně strukturovat webovou stránku pomocí nadpisů – praktický návod.

Otestovat strukturu je možné jak pomocí screen readeru, tak pomocí některého z mnoha rozšíření pro webové prohlížeče (nabízí se například Web Developer).

Bližší informace k testování pomocí screen readerů viz

Představu o tom, jak taková nadpisová osnova vypadá třeba zde na Poslepu.cz, si můžete udělat z následujícího screenshotu (uživatelé screen readerů si ji mohou vyvolat pomocí odpovídající funce svého screen readeru 🙂

Poslepu.cz: ukázka nadpisové osnovy

Barvy a dostatečný kontrast

U jednotlivých prvků na stránce musí být zajištěn dostatečný barevný kontrast mezi popředím a pozadím tak, aby prezentované informace byly dobře čitelné. Nástrojů pro otestování dostatečného kontrastu existuje celá řada. Ve videu je doporučováno aXe extension od Deque Systems. Jedná se o jednoduché rozšíření, pomocí nějž je možné provést automatický audit stránky a nechat se upozornit na možné problémy. Jednou z testovaných oblastí je i dostatečný kontrast použitých barev.

Dalším rozšířením, které k testování používám, je Accessibility Developer Tools. Funguje podobně jako aXe extension, kromě upozornění na nedostatečný kontrast ale nabízí i doporučení, jaké barvy použít, aby byly vzájemně dostatečně kontrastní.

Pokud Vám testování kontrastu na úrovni kódu přijde příliš komplikované, doporučuji vyzkoušet Colour Contrast Analyser, který nabízí uživatelsky přívětivější rozhraní.

Testování přístupnosti jako součást vývoje webu

Na závěr videa pak zazní doporučení, se kterým nelze než souhlasit – zahrnout průběžné testování přístupnosti jako nedílnou součást vývoje webu a tím předcházet vzniku bariér.

Závěr

Tento přehled zcela jistě není vyčerpávající a nepokrývá všechny oblasti přístupnosti. Jeho hlavní výhoda a přínos spočívá v tom, že pomocí něj lze odhalit největší překážky v přístupnosti. Po jejich odstranění se tak může z webu, který bude pro uživatele se specifickými potřebami velmi obtížně přístupný, stát web, který bude vyhovovat alespoň základním požadavkům na přístupnost.

E-shopy se mohou přizpůsobit nevidomým. Ty české mají ale stále co dohánět

V Česku je přes 36 tisíc e-shopů, na kterých je možné koupit cokoli od základních potravin přes nejrůznější služby až po luxusní šperky. Když na nich chce ale nakoupit nevidomý, ve většině případů se mu to nejspíš nepodaří. Zpřístupnit stránky pro čtecí zařízení přitom není složitou věcí, tvůrci webů ale mají o tomto problému jen minimální povědomí. „To, že s některým webem nemohou pracovat nevidomí, je způsobeno většinou jen drobnostmi,“ říkají samotní uživatelé.

Nevidomí dnes mohou díky dostupné technice psát e-maily, pohybovat se na internetu a na sociálních sítích, komunikovat s úřady nebo nakupovat online. Vše ale záleží na tom, jak a jestli vůbec jsou konkrétní portály přizpůsobené pro čtecí zařízení. Portálů, které tuto funkčnost dotáhly do konce, je zatím minimum. S přístupností mají přitom problémy i největší tuzemské e-shopy a stejný stav je možné zaznamenat i u portálů státní správy nebo internetových bankovnictví, které tak nevidomým komplikují třeba podnikání nebo vyřizování pro jiné naprosto banálních záležitostí.

Důkazem malého povědomí o důležitosti přístupnosti je i nyní nově udělená výjimka z EET pro zrakově handicapované podnikatele. Kdyby vývojáři více dbali na přístupnost nástrojů pro vydávání účtenek i s ohledem na čtečky, nebyla by tato výjimka nutná. V digitalizaci a přístupnosti je budoucnost. A zvláště pro handicapované, připomíná Karel Giebisch, specialista na přístupnost webů a aplikací, který je od narození nevidomý.

Možnost použití nejrůznějších aplikací přitom může – bez přehánění – znamenat rozdíl mezi životem a smrtí. Plně přístupná nevidomým je například aplikace Záchranka, která dokáže v případě potřeby kontaktovat Zdravotnickou záchrannou službu, oznámit přesnou polohu a další důležité informace.

Stejně tak se dnes čtecí zařízení pro nevidomé bez problémů vypořádají s mobilní aplikací taxislužby Liftago, vyznají se na e-shopech Košík.cz, CZC.cz nebo na cashback portálu Tipli.

Zrakově postižených je v Česku téměř 100 tisíc, přesto většina webových portálů jejich potřeby nereflektuje. Aby byl web přístupný, musí tomu být veškeré prvky přizpůsobené. Vše musí být popsáno textově, aby to byla čtečka schopná rozpoznat. Tudíž ikona lupičky bez popisku ‚hledat‘ je problém, stejně tak nápisy umístěné přímo v grafice, říká Michal Hardyn, zakladatel portálu Tipli, který je jedním z webů, jež potřebám nevidomých vyhověly.

Zpřístupnění webových stránek pro nevidomé nemusí být otázkou velkých investic. Specialisté na přístupnost webů v Česku přitom potvrzují, že často stačí jediná schůzka s vývojáři, během které je představena problematika přístupnosti a příklady již fungujících řešení, a během několika týdnů je znát výrazný posun. Většina společností u nás ale dosud neměla ambici se problémem přístupnosti zabývat.

Udělat web je jedna věc, ale zpřístupnit ho pro čtečky obrazovek je věc druhá, která bohužel v řadě případů zůstává naprosto opominuta, vysvětluje Karel Giebisch.

Největší problém spočívá v tom, že vývojáři a obecně tvůrci webů či mobilních aplikací nemají o problému přístupnosti žádné informace. To, že s některým webem nemohou pracovat lidé se čtečkami obrazovek, tedy nevidomí, je způsobeno většinou jen drobnostmi. Třeba nepodařenou strukturou stránek nebo chybějícími textovými popisky. Čtečka pak nedokáže identifikovat, jestli jste zrovna na košíku, zdali jsou produkty vloženy do košíku, nebo názvy polí, které je třeba vyplnit v objednávkovém formuláři, dodává Karel Giebisch.

Tipli je v současnosti nejrychleji rostoucím cashbackovým portálem u nás. Svým uživatelům vrací za nákupy v partnerských e-shopech až 33 %, což je nejvíce v České republice. Portál Tipli.cz byl spuštěn v říjnu 2016. V tuto chvíli má 150 000 uživatelů a řadí se mezi tři největší cashback portály v Česku, na Slovensku má prvenství. V červnu 2017 Tipli vstoupil na polský trh, do budoucna plánuje rozšířit své působení i v rámci dalších evropských států.

Článek napsala Klára Pirochová.

WebAIM: probíhá 7. průzkum mezi uživateli odečítačů obrazovky

Americký WebAIM minulý týden spustil další ze svých průzkumů mezi uživateli screen readerů (odečítačů obrazovky): Screen Reader User Survey #7. Tento je již v pořadí sedmý, obsahuje 30 jednoduchých otázek a jeho vyplnění by nemělo zabrat více než 15 minut. Průzkum opět probíhá formou webového dotazníku a je otevřen všem zájemcům, kteří z jakéhokoliv důvodu používají při práci s webem odečítač obrazovky.

Cílem průzkumu je zjistit informace o aktuálních požadavcích a problémech uživatelů screenreaderů a sledovat změny oproti výsledkům předchozích průzkumů. Oproti předchozím průzkumům přibylo otázek týkajících se používání mobilních zařízení s odečítačem obrazovky – nově jsou respondenti dotazováni, zda každodenní činnosti raději provádějí v mobilních aplikacích či na webu nebo zda na mobilu pro psaní textu používají externí klávesnici.

Průzkum bude k dispozici do 1. listopadu 2017, výsledky by měly být zveřejněny ke konci roku 2017.

Pro zájemce, kteří by se rádi průzkumu zúčastnili, ale mohla by pro ně být překážkou angličtina, jsem opět připravil překlad všech otázek a odpovědí do češtiny (txt; 4 kB).

Pokud používáte odečítač obrazovky – ať už proto, že musíte, či jen k testování přístupnosti webů – najděte si chvilku a dotazník vyplňte. Pomůžete tím lépe poznat potřeby uživatelů odečítačů obrazovek při práci na webu.