A web mindenkié, avagy web accessibility

Számos alkalommal tapasztalom a webet böngészve, hogy az egyes weboldalak szeparált akadálymentes verzióval, vakbarát változattal rendelkeznek, ami igazából nem más, mint hátrányos megkülönböztetés, ráadásul az ilyen megoldások teljesen értelmetlenek.

Univerzális design és nem vakbarát

Nagyon sokan azt hiszik, hogy az akadálymentesített weboldal sérült embereknek készül. Nem. Szimplán csak embereknek. Neked, nekem, a barátaidnak, az ő barátaiknak, mindenkinek. Egy website attól lesz akadálymentes (univerzális), hogy bárki, a legkülönfélébb élethelyzetekben is gond nélkül tudja használni azt és nem pedig attól, hogy megcsinálod a fekete háttéren nagy sárga betűs változatát is.

Remek lehetőség

Az fps teljes támogatásával társadalmi munkában fejlesztjük a Baráthegyi Vakvezető Kutya Iskola honlapjának megújítását, mely hamarosan elérhető lesz a nagyközönség számára is. És miért írok minderről? Mert a projekt kapcsán végre lehetőségünk volt látássérült felhasználóval is felhasználói tesztelést végezni. Ez a lehetőség számos tapasztalattal szolgált a későbbiekre nézve is.

A weboldal célja, hogy rajta keresztül minél több látássérült ember juthasson speciális vakvezető kutyához, valamint számtalan hasznos információval, hírekkel szolgál a látogatók számára.

„Küldetésünk, hogy minél több rászoruló élhessen függetlenebb, önállóbb és biztonságosabb életet vakvezető kutyával az oldalán.”

Sajnos nekem csak elvétve volt szerepem a weboldal tervezésében és fejlesztésében, viszont ott lehettem a felhasználói tesztelésen, amikor is Vida Zoltán először próbálhatta ki az oldalt.

Zoli a weboldal tesztelése során a saját számítógépét használta, egy a látássérülteknek fejlesztett felolvasó szoftverrel (Jaws) úgy, mintha csak otthon a kanapén ült volna.

Tapasztalataink

Zoli elmondása szerint sikerült úgy elkészítenünk a site-ot, hogy ő, mint gyakorlott felhasználó csak egy-két ponton ütközött problémába.

A kevés probléma annak köszönhető, hogy a sitebuilder logikusan építette föl az oldal HTML szerkezetét ugyanis, a felolvasó szoftver magán a nyers HTML szerkezeten (DOM) megy végig sorról sorra és emeli ki az egyes részeket úgy, hogy a látható felületet nyilvánvalóan nem veszi figyelembe.

Ez azért jó hír, mert egy responsive site esetén - mint ez is -, semmiben sem módosul az oldal szerkezete (DOM), mindössze a különböző méretű kijelzőkhöz vizuálisan alkalmazkodik a megjelenítés.

A szabványok betartása, a W3C szerint is valid kód nem csak a SEO és a megjelenítés miatt fontos. A megfelelő sitebuild elkészítéséhez tartozik az is, hogy minden lényeges elemet, legyen az egy link, egy gomb, vagy akár egy kép, el kell látni a megfelelő tulajdonsággal. Ilyen például a title és az alt, melyek közül előbbi a linkek, utóbbi pedig a képek fölcímkézésére szolgál. Ha például egy linknek nem adsz title-t, akkor a felolvasó szoftver gond nélkül felolvassa az adott link URL paraméterének értékét, alt nélküli képek esetében pedig annyit mond, hogy itt egy ábra található. Létezik egy úgynevezett WAI-ARIA szabvány, mely lehetőséget biztosít, hogy fölcímkézz és besorolj olyan jelölő elemeket, mint például a div vagy span, melyek önmagukban nem hordoznak különösebb jelentéstartalmat, mint mondjuk a H2 (második szintű címsor). Többek között ezekről és további hasznos dolgokról Szántai Károly WIAD-on tartott előadásában hallhatsz bővebben.

Egy másik fontos dologra is odafigyelünk az oldalak készítésekor, mégpedig arra, hogy egér nélkül, kizárólag billentyűzet használatával is végigjárhatóak legyenek az egyes oldalak és azok alrészei.

Problémaként merült föl, hogy mikor Zoli kiválasztott egy cikket és a böngésző átirányította a kiválasztott cikk oldalára, akkor a felolvasó szoftver az oldal legtetején kezdte a felolvasást és nem pedig a cikk elején. (Ugyanis a szoftver lineáris blokkonként halad sorba az oldal felolvasásakor.) Úgy kell ezt a problémát feloldani, hogy a szöveges tartalmakra mutató linkekhez hozzá kell fűzni egy horgonyt, mely az átirányítás után egyből az adott szöveghez irányítja a felolvasó programot, így nem kell minden egyes oldalváltáskor végigugrálni a megfelelő tartalomig.

Volt még néhány olyan pontja az oldalnak, melyeket a szokástól eltérő módon kellett kialakítanunk. Ilyen volt az űrlapok megjelenítése és kezelése. Az esetleges hibaüzeneteket nem a mezők alatt kell strukturálni kódszinten (DOM), hanem már azok előtt, valamint küldéskor az űrlapok tetején fel kell tüntetnünk azt is, hogy sikeres volt az elküldés, vagy hibák léptek fel, és ha igen, melyek ezek. Ezeken felül, másik fontos dolog volt, hogy a kötelező mezőket nem elég egy csillaggal jelölni, hanem oda kell írni, hogy kötelező megadni.

Hasznos linkek

A fejlesztés során mindig figyelembe vesszük a W3C WCAG 2.0 ISO 40500 szabványt, mely nagy segítséget nyújt, hogy a weboldalak akadálymentesek legyenek. Szántai Károly web akadálymentesítési szakértő munkássága is sokat segít a fejlesztéseink során. Károly blogját érdemes nyomon követni, számos hasznos és érdekes információval szolgálhat mindazoknak, akik számára szintén fontos, hogy minden web site akadálymentes lehessen.

A projekt során szerzett tapasztalatainkat a későbbiekben is kamatoztatni fogjuk, ráadásul abban a szerencsés helyzetben vagyunk, hogy Zolival együttműködhetünk a továbbiakban is, ha tesztelésről van szó és mint mindig, úgy most is egy lépéssel közelebb kerültünk egy boldogabb világhoz.

Végül álljon itt Zoli néhány mondata a teszteléssel kapcsolatban:

„Hogy őszinte legyek az elején egy kicsit izgultam, hisz még sosem csináltam ilyet. Viszont nagyon tetszett, mert szeretem az elgondolkodtató és kihívást jelentő feladatokat. Emellett örülök, hogy segíthettem a Baráthegyi Vakvezető Kutya Iskolának. Vakként nagyon fontosnak tartom, hogy a weboldalak akadálymentesek legyenek, mert nincs annál dühítőbb, mint mikor valamit nem tudok önállóan megoldani az interneten. Az fps-nél jól éreztem magam, mert amellett, hogy érdekes és hasznos feladatot csináltam, figyeltek rám, minden apró észrevételemet komolyan vették. Ha olyan hibát találtam azonnal kijavították. Az elkészült oldallal kapcsolatban maximálisan pozitív élményeim vannak. Nagyon ritkán találkozom ennyire profin elkészített oldallal.”