Egy díjtáblában minden összeghez meg kell találnod a szolgáltatást, a csomagméretet és a pénznemet. A fejlécek ezeket a kapcsolatokat adják meg, ezért az elrendezés változtatásakor is meg kell őrizni őket. A használati próba konkrét díj megkeresésével és összehasonlításával ellenőrzi, hogy a jelentés követhető maradt-e.
A HTML-táblázat generátor kiindulási szerkezetet adhat, a végeredményt azonban a saját tartalommal kell ellenőrizni. A cikk egy semleges díjtáblán mutatja be a feladatot; az összegek nem valamely szolgáltató valós díjai.
Egy szám önmagában kevés
Legyen két csomagméret és két kézbesítési mód. A kisméretű csomag átvételi pontra 1490 Ft, házhoz 1990 Ft. A nagyméretű csomaghoz 2490 és 2990 Ft tartozik.
| Csomagméret | Átvételi pont, Ft | Házhoz, Ft |
|---|---|---|
| Kicsi | 1490 | 1990 |
| Nagy | 2490 | 2990 |
Az 1990-es cella értelme a „Kicsi” sor és a „Házhoz, Ft” oszlop együttese. A két dimenzió kapcsolata a tartalom része. Ha a fejléceket csak vastag betűs normál cellaként jelölöd, a látvány megmaradhat, a programozott kapcsolat viszont hiányozhat.
Táblázatcím és megfelelő fejlécek
A W3C útmutatója alapján az adattáblázatnak célszerű azonosítható címet adni, a fejléccellákat pedig a megfelelő HTML-szerkezettel összekapcsolni az adatokkal. Egyszerű sor- és oszlopfejléces táblánál a th és a scope jelölés segít kifejezni a viszonyokat.
A példához olyan cím illik, mint „Szemléltető szállítási díjak csomagméret és kézbesítés szerint”. Ez elárulja a tartalom két szempontját és azt is, hogy példaszámok következnek. A „Táblázat 1” önmagában kevés támpontot adna.
A mértékegységet nem szükséges minden számban megismételni, ha az összetartozó oszlop fejlécében egyértelmű. Eltérő pénznemek vagy időegységek viszont külön megjelölést igényelnek.
Mobilos elrendezés
Négy oszlop még elférhet, tizenöt oszlop már könnyen túl széles egy telefonon. A megoldást a feladatból érdemes megválasztani. Lehet vízszintes görgetés, egyszerűbb résztáblákra bontás vagy egy jól megtervezett kártyanézet, amely megőrzi az adat–fejléc kapcsolatokat.
A görgethető régióhoz felismerhető név és billentyűzetes hozzáférés kellhet. A felhasználónak látnia kell, hogy további oszlopok vannak jobbra. A teljes oldal akaratlan széthúzása rosszabb élményt ad, mint a táblázat saját, jól jelzett görgetési területe.
Kártyás átalakításnál az oszlopfejléc ne tűnjön el a szám mellől. A „1990” felirat önmagában kevés, a „Házhoz: 1990 Ft” már értelmezhető. A DOM és a vizuális elrendezés együttes ellenőrzése szükséges.
Üres cella, nulla és nem elérhető érték
Egy üres díjmező jelentheti, hogy nincs adat, nem választható a szolgáltatás vagy még számítás alatt áll. A nulla ezzel szemben valódi szám. A kettőt nem szabad automatikusan felcserélni.
Ha a nagyméretű csomag egy adott módon nem szállítható, írj egyértelmű állapotot, például „Nem választható”. A szín önmagában ne hordozza az információt. A piros háttérhez ugyanúgy szöveges jelentés kell, mint egy zölddel jelzett kedvezményhez.
Egyszerű, megismételhető teszt
Próbáld végig a táblát billentyűzettel, keskeny kijelzőn és nagyított betűmérettel. Válassz ki véletlenszerű adatcellákat, és kérdezd meg: a hozzá tartozó két fejléc és mértékegység egyértelműen megtalálható? Az üres és hosszú szöveges cellákat is teszteld.
Az automatizált ellenőrző találhat hiányzó szerkezeti jelölést, de az adatok érthetőségét nem dönti el teljesen. A generált HTML érvényessége és a használható felhasználói élmény külön vizsgálat marad.
Összehasonlítási feladat a mobilos változaton
A példabeli díjakból két külön kérdést oldj meg a keskeny nézeten. Mennyivel drágább a kicsi csomag házhoz kézbesítése az átvételi pontnál? 1990 − 1490 = 500 Ft-tal. Mennyivel drágább a nagy csomag a kicsinél, ha mindkettőt házhoz kéred? 2990 − 1990 = 1000 Ft-tal.
Az első összehasonlítás ugyanabban a sorban, a második ugyanabban az oszlopban halad. Ha a kártyanézetből valamelyik fejléc eltűnik, a két feladat közül valamelyik nehézzé vagy félreérthetővé válhat. A „Házhoz: 1990 Ft” mező mellett a kártya csomagméretének is azonosíthatónak kell maradnia.
A kézi próbában előbb nevezd meg a keresett méretet és kézbesítést, utána olvasd ki az összeget. Képernyőolvasóval azt figyeld, elérhető-e a cellához tartozó megfelelő sor- és oszlopfejléc. Vizuálisan és billentyűzettel azt is ellenőrizd, hogy a görgetés közben követhető-e, mely adatok vannak elrejtve a látható területen kívül. A sikeres két számolás hasznos tartalmi próba, teljes akadálymentességi megfelelést önmagában nem igazol.
Gyakori kérdések
Jó táblázattal kialakítani az egész oldal elrendezését?
Az itt bemutatott szerkezet összetartozó adatokhoz való. A puszta oldalelrendezést más HTML- és CSS-eszközökkel érdemes megoldani.
Minden táblához szükséges összetett fejléc?
Az egyszerű adathoz egyszerű fejlécrendszer célszerű. Többszintű fejléc csak indokolt tartalmi szerkezetnél segít.
Egy sikeres automatizált teszt elég?
A kézi használati próba és az adatok jelentésének ellenőrzése is szükséges. A technikai megfelelés önmagában nem teljes használhatósági vizsgálat.
Módszertani forrás
W3C WAI – Akadálymentes adattáblázatok
W3C WAI – Sor- és oszlopfejlécek
Záró tudáspróba
Válassz kérdésenként egy választ, és jegyezd fel a betűjelét. Minden helyes válasz 1 pont; a hibás, kihagyott vagy több betűvel jelölt válasz 0 pont. Legfeljebb 3 pontot szerezhetsz. A megoldókulcsot a válaszadás után olvasd el.
1. A kicsi csomag házhoz 1990 Ft, átvételi pontra 1490 Ft. Mekkora a házhoz kézbesítés felára?
- A) 1000 Ft
- B) 1490 Ft
- C) 500 Ft
2. A mobilkártyán csak „Házhoz: 1990 Ft” marad, a csomagméret sehol nem azonosítható. Teljes a jelentés?
- A) Igen, mert a szám félkövér.
- B) Igen, mert szerepel a pénznem.
- C) Nem; a csomagméret kapcsolata hiányzik.
3. A nagy csomaghoz a díjmező üres. Mire cserélheted ellenőrzés nélkül?
- A) Sem ingyenességre, sem nem választható állapotra; előbb tisztázni kell a jelentését.
- B) 0 Ft-ra, mert nincs szám.
- C) A legkisebb díjra.
Megoldókulcs és értelmezés
1. C. 1990 − 1490 = 500 Ft. Ugyanannak a csomagméretnek két kézbesítési módját hasonlítjuk.
2. C. A díjhoz mindkét dimenzió szükséges: a méret és a kézbesítési mód.
3. A. Az üres cella jelentése nincs meghatározva. Az értelmezést a valós adathoz kell kötni, majd szövegesen jelölni.
0–1 pont: A díjtáblán jelöld meg az 1990 Ft-hoz tartozó két fejlécet, majd külön oldd meg a soron és oszlopon belüli összehasonlítást.
2 pont: A hibás vagy kihagyott válasz magyarázata alapján keresd vissza a kapcsolódó számítást, majd oldd meg újra azt a kérdést.
3 pont: A három feladatban helyesen alkalmaztad a cikk összefüggéseit. A saját táblázatodra írj egy soron és egy oszlopon belüli keresési feladatot, és próbáld ki a keskeny nézetet segítő technológiával is. A rövid próba csak ezeket a tanulságokat ellenőrzi.