Screen readery a sémantika

Jedno z pravidel přístupnosti vyžaduje správné používání sémantických značek pro vyjádření významu daných prvků (nadpis, citace, atp.). Podívejme se na to, jaké značky umí dnešní screen readery zpracovat a zpřístupnit tak jejich význam i svým uživatelům.

Jako referenční si vezměme screen reader JAWS, který patří mezi nejrozšířenější screen readery na celém světě a je v této oblasti de facto nepsaným standardem.

Titulek stránky a nadpisy

JAWS je schopen vyčíst informaci o titulku stránky (značka <title>) a o nadpisech všech úrovní (značky <h1> až <h6>). JAWS je schopen podat informaci o úrovni nadpisu, umožňuje rychlý přesun na následující/předchozí nadpis (nezávisle na úrovni) a také na následující/předchozí nadpis určené úrovně v aktuální sekci.

Ukázka výpisu seznamu nadpisů titulní stránky Aktuálně.cz

Odstavce, odkazy, citace, zkratky, akronymy

JAWS umožňuje rychlý přesun mezi odstavci, pokud jsou vyznačeny značkou <p> - proto je nutné pro vyznačování odkazů použít právě značku <p> a ne například <div> či <br>< br>. JAWS umí pracovat s odkazy (<a href="cíl">) a uživatele informovat i o typu odkazu (standardní odkaz, poštovní odkaz, odkaz při přechodu myší, atp.). JAWS informuje také o citacích, které jsou vyznačeny značkou <blockquote>. Pokud si uživatel zapne funkci Rozvíjet zkratky/akronymy, budou mu čteny v rozvinuté formě zkratky a akronymy, vyznačené pomocí značek <abbr> a <acronym>.

Ukázka výpisu odkazů z titulní stránky Aktuálně.cz

Tabulky

JAWS ohlašuje informaci o tom, že následuje tabulka (značka <table>) spolu s informací o počtu řádků a sloupců. Automaticky také vyčítá informace z atributu summary, pokud je tento atribut přítomen. JAWS umí pracovat se záhlavím řádků/sloupců (značka <th>). Pokud značky <th> nejsou použity, považuje JAWS za záhlaví řádku/sloupce obsah první buňky řádku/sloupce. JAWS také podporuje atribut headers u značky td, který - obzvlášť u složitějších tabulek - umožňuje v kombinaci s id u značek <th> přiřadit konkrétní buňce tabulky odpovídající záhlaví.

Seznamy

JAWS při přemístění na seznam informuje o tom, že se jedná o seznam, kolik má položek a o případných vnořených seznamech (značky <ul>, <ol>, <li>). JAWS informuje také o definičním seznamu a jeho položkách (značky <dl>, <dt>, <dd>).

Grafika

Při přechodu na grafický prvek (značka <img>) informuje JAWS o této skutečnosti hláškou grafika. Pokud je u grafického prvku definován alternativní textový popisek (atribut alt), je tento popisek přečten.

Formuláře

U formulářů (značka form) umí JAWS informovat o následujících prvcích:

• editační pole (značka <input type="text">),
• textové pole (značka textarea>),
• přepínač (značka <input type="radio">) včetně ohlášení stavu,
• zaškrtávací políčko (značka <input type="checkbox">) včetně ohlášení stavu,
• tlačítko (značky <input type="submit"> nebo <input type="image">),
• rozbalovací seznam (značky <select>, <option>).

Každý formulářový prvek samozřejmě musí být svázán se svými relevantním popiskem pomocí značky <label> a vazebních atributů for a id. Pokud sdružíte formulářové prvky do logických celků pomocí značek <fieldset> a <legend>, JAWS před každým formulářovým prvkem v daném celku přečte informaci, definovanou značkou <legend>.

Rámce

Pokud jsou stránky vytvořeny pomocí rámců (značka <frame>), JAWS umí informovat o počtu rámců, umí vyčíst jejich název (atribut name), případně titulek (atribut title). JAWS ohlášuje přechod mezi jednotlivými rámy, tzn. uživatel ví, kdy opouští jeden rám a dostává se do dalšího.

Cílové místo (kotva na stránce)

JAWS také umí uživateli zpřístupnit seznam míst na stránce, které jsou definovány pomocí tzv. kotev (značka <a> s atributem name). Do seznamu cílových míst nejsou zahrnuta místa, která jsou definována pomocí id.

Tabulka s přehledem prvků stránky a odpovídajících značek

Prvek stránky	Značka
Titulek stránky	<title>
Nadpis	<h1> až <h6>
Odkaz	<a href="cíl">
Odstavec	<p>
Citace>	<blockquote>
Zkratka, akronym	<abbr>, <acronym>
Tabulka	<table>, <th>, <td>, <caption>
Seznam	<ul>, <ol>, <li>, <dl>, <dd>, <dt>
Grafika	<img src="">
Textové pole	<textarea>
Editační pole	<input type=“text“>
Přepínač	<input type=“radiobutton“>
Zaškrtávací políčko	<input type=“checkbox“>
Tlačítko	<input type=“submit“> <input type=“image“>
Rozbalovací seznam	<select>, <option>
Rámec	<frame>
Cílové místo (kotva) na stránce	<a name=“nazev“>

Uživatelé JAWSu se mohou po jednotlivých prvcích pohybovat vpřed/zpět nejen pomocí horkých kláves, ale mohou si prvky nechat zpřístupnit i ve formě seznamu, který má následující výhody:

• uživatel pracuje v jednu chvíli pouze s prvky vybraného typu (nadpisy, odkazy, přepínače, atp.),
• pro rychlý pohyb mezi prvky může použít počáteční písmena,
• v některých případech (například u nadpisů) si může výpis dále upravovat dle potřeby (například si nechat zobrazit jen nadpisy druhé úrovně).

Pokud by byl zájem, mohu některé pasáže rozpracovat více či je doplnit audio/video ukázkou. Případné požadavky pište do komentářů. Děkuji.