Jó megoldások – akadálymentes webes komponensek, Infoalap logóval

Megfelelően formázott táblázat leírása

Bevezetés

A táblázatok kétdimenziós megjelenítést alkalmaznak. Ez azt jelenti, hogy a cellákban szereplő információkat a hozzájuk tartozó oszlop-, illetve sorfejléccel együtt lehet csak értelmezni. Például, az „április” szó önmagában nem hordoz információt, ahhoz tudni szükséges, hogy az a tulipán virágzási időszakára vonatkozik. Ezek az adatok a táblázat oszlop-, illetve sorfejlécében találhatóak. A látó felhasználók az információkat vizuális úton érzékelik, ám nagyobb táblázatok esetén az azonosítás nehézkessé válik, az adatokat görgetni szükséges, ezért gyakori megoldás például Excelben a fejlécek rögzítése. A képernyőolvasó programok lehetőséget biztosítanak a fejlécek azonosítására és felolvastatására, ám ehhez megfelelően formázott táblázatok alkalmazása szükséges.

Jelen fejezet célja annak bemutatása, hogyan kell egy táblázatot oly módon megadni, amely támogatja a képernyőolvasó programmal történő kényelmes használatot. A komponens gyakorlati példájában egy olyan táblázat szerepel, amely különböző virághagymák jellemzőit (magasság, virágzási időszak, stb.) tartalmazza. A táblázat explicit – nem csak vizuálisan elkülönített – oszlop-, illetve sorfejlécet, összegzést és címet foglal magában.

A példa áttekintése

<table align="center" border="1" cellpadding="5" cellspacing="1" summary="Táblázat, amelynek oszlopfejlécében a virághagymák nevei, sorfejlécében pedig a különböző jellemzők megnevezései szerepelnek.">

A táblázat fejléce. A summary="Táblázat, amelynek oszlopfejlécében a virághagymák nevei, sorfejlécében pedig a különböző jellemzők megnevezései szerepelnek." attribútum tartalmazza a táblázat leírását. Ez az információ vizuálisan nem jelenik meg, viszont a képernyőolvasó program felolvassa, így az azt használó felhasználó anélkül tud tájékozódni a táblázat jelentéséről, hogy azt be kellene járnia.

<caption><h2>Virághagymák jellemzői</h2></caption>

A táblázat címe. A cím vizuálisan is megjelenik, általában a táblázat előtt található.

Megjegyzés: A <h2> címke csak megjelenítési, elkülönítési célt szolgál.

<th style="width: 20%; text-align: center" scope="col">Tulipán</th>

A táblázat egyik oszlopfejléce. A <th> címke és a scope="col" tulajdonság alkalmazása jelzi a képernyőolvasó programnak, hogy a cella oszlopfejléc. Ha <th> helyett <td> szerepelne, és a fejléc megjelölése csak vizuálisan, például félkövér kiemeléssel lenne megoldva, akkor a képernyőolvasó program adatmezőként azonosítaná a cellát.

<th scope="row">Magasság</th>

A táblázat egyik sorfejléce. A <th> címke és a scope="row" tulajdonság alkalmazása jelzi a képernyőolvasó programnak, hogy a cella sorfejléc.

Billentyűzet-támogatás

Megjegyzés: A fenti parancsok képernyőolvasó program használata esetén alkalmazhatóak, a táblázat rétegbe történő belépést követően. A JAWSGOMB a JAWS módosítóbillentyűjét jelöli, amely általában az Insert vagy a Caps Lock.


www.infoalap.hu