Testování přístupnosti webových stránek se screenreaderem NVDA

Úvod

Cílem tohoto článku je pomoci uživatelům, kteří se chtějí seznámit s programem NVDA a jeho základními ovládacími prvky při testování přístupnosti webu. Současně může posloužit občasným uživatelům NVDA jako stručný přehled základních funkcí a kláves. NVDA neboli NonVisual Desktop Access je volně dostupný open source odečítač obrazovky pro operační systém Microsoft Windows. Podporuje přes 20 jazyků a má i portable verzi, což znamená, že jej můžete spustit na jakémkoli počítači z USB disku bez nutnosti instalace na pevný disk.

Testovat přístupnost webového obsahu s odečítačem obrazovky je důležité. Odečítače obrazovky však mohou být pro příležitostné uživatele velmi komplikované programy, a proto se jejich použití mnoho lidí raději vyhne. Nemusí tomu tak ale být. I když jsou odečítače obrazovky komplikované, můžete s nimi testovat přístupnost webového obsahu, aniž byste byli jejich "pokročilými uživateli“.

Při čtení tohoto článku mějte na paměti několik věcí:

• Tento článek neobsahuje vyčerpávající seznam klávesových zkratek NVDA, nýbrž poskytuje seznam základních příkazů, které by měli nováčci nebo začátečníci s NVDA nepochybně znát. Pro vyčerpávající seznam NVDA klávesových zkratek se podívejte na Keyboard Shortcuts for NVDA - externí odkaz anglicky nebo na Seznam klávesových zkratek NVDA - externí odkaz.
• Jste-li nováčci v oblasti odečítačů obrazovky, připravte se na to, že nad tímto článkem a příklady pravděpodobně strávíte více času (možná i několik hodin), než se s NVDA lépe seznámíte. Nenechte se odradit, pokud na vás budou věci působit po několika prvních minutách zmateně. Zpomalte rychlost čtení a nespěchejte.
• Obvykle je jednodušší pracovat s NVDA na standardní klávesnici. Je dostupná i odlišná konfigurace, pokud dáváte přednost klávesnici notebooku, ale ta v tomto článku není zmiňována. Přístupnost obsahu svých webových stránek byste měli vždy testovat s uživateli s různými postiženími včetně uživatelů používajících různé odečítače obrazovky, zejména před tím, než učiníte rozhodnutí o tom, jak budou stránky vypadat.

Začínáme

NVDA je open source software, který můžete stáhnout z Download NVDA - externí odkaz (pouze pro Windows). Jelikož je NVDA relativně nový projekt, jsou některé jeho funkce prozatím dostupné pouze v základním režimu. Jakmile máte NVDA staženo a nainstalováno, můžete jej spustit stiskem kláves Ctrl + Alt + N.

NVDA klávesa je buď Insert (standardně) nebo ji můžete nastavit na CapsLock. Startovní dialogové okno obsahuje zaškrtávací tlačítko, které umožňuje nastavit NVDA klávesu jako CapsLock. Pokud byste chtěli změnit NVDA klávesu později, stiskněte Ctrl + NVDA + K.

Při práci s NVDA mějte na paměti následující pravidla:

• Ačkoliv NVDA podporuje zpřístupnění Windows a mnoha jejich aplikací, my se soustředíme pouze na zpřístupnění webového obsahu.
• Ujistěte se, že máte vypnutý NumLock.
• NVDA budete nejspíš testovat v Mozilla Firefoxu, i když možná není vaším výchozím prohlížečem.
• Nezapomínejte, že typický uživatel odečítače obrazovky nepoužívá myš. Až se budete s NVDA cítit jistější, zkuste používat jen klávesnici.
• Mějte na paměti, že většina klávesových zkratek Firefoxu funguje i při používání NVDA.
• Stránka se během čtení nemusí posouvat, takže můžete slyšet text čtený NVDA, který není vidět na obrazovce.

Čtení

Existují desítky klávesových zkratek, které vám umožňují číst text po řádcích, větách, slovech, znacích atd. Následuje seznam základních klávesových zkratek pro čtení na webu. S jejich pomocí byste měli být schopni projít většinu obsahu.

Numerické +

Čtení od začátku stránky

NVDA +

Čtení od aktuální pozice kurzoru

Ctrl

Zastavení čtení

NVDA + nebo numerická +

Aktuální řádek

Ctrl + / numerická 4/ numerická 6

Předchozí/následující slovo

nebo numerická 7

Předchozí řádek

nebo numerická 9

Následující řádek

/ nebo numerická 1/ numerická 3

Předchozí/následující znak

F5 / Ctrl + F5

Obnovení stránky/znovu obnovení stránky. Pokud se ztratíte, je to rovněž způsob, jak se vrátit na začátek stránky.

NVDA + Ctrl + /

Zvýšení/snížení rychlosti řeči

Čtení si můžete hned vyzkoušet na obsahu této stránky. Mějte na paměti, že na začátku je odkaz pro přeskočení k hlavnímu obsahu (více o skip to odkazech na WebAIM.org).

Navigace

Vidící uživatelé se orientují v obsahu webových stránek mnoha způsoby. Hledají zrakem nadpisy, seznamy, tabulky apod. Většina těchto metod je přístupná i pro uživatele odečítačů obrazovky, pokud má stránka korektní strukturu a vhodné uspořádání. Přesun vzad a vpřed po odkazech a prvcích formulářů na stránce provádíme pomocí Tab a Shift + Tab. Další klávesové zkratky jsou uvedeny níže.

Pro procvičení čtení a navigačních příkazů zkuste znovu načíst stránku a dostat se do této kapitoly. Je několik způsobů, jak to lze provést - přejděte k obsahu článku, aktivujte odkaz této kapitoly a potom začněte číst nebo přecházejte po větách, nadpisech (H), seznamech (L), hledejte, čtěte po řádcích (/ ).

Obrázky

Každý obrázek na stránce potřebuje alternativní popisek – odkaz na WebAIM.org. Pokud obrázek popisek nemá, odečítač ho zpravidla ignoruje, ale chování se může lišit v závislosti na nastavení odečítače.

Obrázky - příklady na procvičení

Datové tabulky

Tabulky na webových stránkách se používají hlavně ze dvou důvodů: vzhled - externí odkaz a uspořádání dat - externí odkaz. Pro přesun k další tabulce stiskněte klávesu T. Pro přesun mezi buňkami tabulky použijte Ctrl + Alt + / .

Tabulky - příklady na procvičení

Formuláře

Formuláře – odkaz na WebAIM.org se používají k interakci.Používejte značku label pro svázání formulářových prvků a jejich popisků. NVDA pak při procházení formuláře tento popisek formulářového prvku přečte. Pokud formulářový prvek nemá popisek, NVDA nebude schopno identifikovat účel tohoto formulářového prvku. Používejte značku fieldset k seskupování souvisejících formulářových prvků. Obvykle se tímto způsobem seskupují zaškrtávací políčka a přepínače, lze jej však použít i pro jiné prvky. NVDA typicky čte obsah značky legend prvků, seskupených pomocí značky fieldset.

Pro navigaci ve formulářích a pro práci s jejich prvky použijte následující klávesové zkratky:

• Jakmile vstoupíte na formulářový prvek, NVDA přejde do tzv. formulářového režimu. V tzv. formulářovém režimu můžete psát text, aniž by byly aktivní rychlé klávesy a další klávesové zkratky. Můžete stisknout Enter nebo NVDA + mezerník pro vstup do formulářového režimu.
• Stiskem NVDA + mezerník opustíte formulářový režim a vrátíte se do tzv. režimu prohlížení.
• Jakmile jste ve formulářovém režimu, můžete použít Tab a Shift + Tab k pohybu po prvcích formuláře.
• Použijte mezerník k zaškrtnutí/odškrtnutí zaškrtávacích tlačítek.
• Použijte / pro výběr ze skupiny přepínačů.
• Použijte / nebo první písmeno pro výběr prvku v rozbalovacích seznamech.
• NVDA automaticky opouští formulářový režim, pokud stisknete Enter při odeslání formuláře, při přechodu na novou stránku nebo potvrzení tlačítka.

Formuláře - příklady na procvičení

Cvičení

• Projděte si pomocí odečítače tuto stránku kapitolu po kapitole. Na konci každé z nich se vraťte nahoru a přecházejte do dalších kapitol různými způsoby. Například:
  • Použijte Obsah článku.
  • Použijte Ctrl + F pro otevření vyhledávacího dialogu.
  • Přecházejte po nadpisech (buď H nebo 1 až 3).
  • Na této stránce je několik prvků, které jsou neviditelné a které slouží k tomu, aby se uživatel odečítače na stránce lépe orientoval. Schválně, jestli je dovedete rozpoznat. (Tip: jeden je těsně před a druhý těsně za sekcí s hlavním obsahem stránky).
  • Přihlaste se k odběru novinek WebAIM.org, aniž byste použili myš. (Tip: na této stránce je k tomu odkaz).
  • Vypněte monitor a zkuste zopakovat některé z těchto úkonů.