Web design Accessibility
A Web • Az egyik definíció szerint a Web: – minden ember számára (fizikai és technológiai szinttől és lehetőségektől függetlenül) információt közlő médium
• Látás- és hallássérültek is tudják használni • Mozgás koordinációs problémáktól szenvedők is • Követelmények és szabályok – Web Accessibility Initiative (WAI) – USA, Section 508 of the Rehabilitation Act, 1973
Problémák vakok esetén • Képek melyeknek nincs alternatív szövege • Komplex képek, melyek nincsennek megfelelően elmagyarázva • Video szöveg nélkül • Táblázatok melyeknek nincs értelme ha sorba olvassuk a mezőket • Keretek (FRAME) melyeknek nincs NOFRAME alternatívája
Problémák látási probléma esetén • Fix méretű betűk, melyeket nem lehet skálázni • Web oldalok, melyeket ha nagyban nézünk szétesik a szerkezete • Kis szín kontrasztokat használó oldalak • Szövegek melyek képként jelennek meg – Nagyítás esetén nincs elválasztás
Problémák színvakság esetén • Csak színnel jelölni valamilyen szöveget • Szöveg és háttérszín között kicsi a kontraszt • Browser, amely nem támogatja „Style Sheet” felülírását
Problémák süketek esetén • Audio file-ok nem megfelelő címkézése • Tartalomhoz kapcsolódó képek hiánya, csak szöveg – Az ember első nyelve valószínűleg a jelnyelv !!!
• Világos, egyszerű nyelv hiánya • Hang bemenet egy oldalon
Problémák motorikus betegség esetén • Időkorlátozott válasz megkövetelése egy web oldalon • Browser mely nem támogatja a billentyűről történő navigálást • Form-ok, amelyeken nem lehet a TAB-al lépkedni
Problémák szellemi fogyatékosok esetén • • • •
Szükségtelenől komplex web oldalak Grafika hiánya Konzisztens szerkezet, oldalak hiánya Vizuális és audio zavaró elemek az oldalon
Problémák rohamot kiváltó betegség esetén • Olyan vizuális vagy audio elem használata (adott frekvencia) mely kiválthatja a rohamot
Megközelítés • W3C – Web Accessibility Initiative – http://www.w3.org/WAI
• Ajánlások – Web content: WCAG – Authoring tool: ATAG – User agent: UUAG
Megközelítés tartalom
fejlesztők
felhasználók
Alapkoncepció • Ha szövegen kívűl bármilyen formában közlünk valamilyen információt, akkor biztosítani kell egy másik lehetőséget is • HTML-nél már gondoltak erre – ALT tag, amit a speciális szoftverek fel tudnak olvasni – Akkor is használható, ha szöveges browsert használunk, vagy a képek letöltését kikapcsoljuk
Megoldások • A nem képi elemeknek szöveges megfelelője legyen • Repetitív navigációs linkek elkerülhetők legyenek • Plug-in -ek és applet -ek is megfeleljenek a követelményeknek • Minden multimédiás elemen a képi információt összhangba hozni az aláírásokkal
Színek • Győződjünk meg róla, hogy ha valamit a színekkel közlünk az színek nélkül is elérhető legyen – Férfiak kb. 8%-a színtévesztő – Nők kb. 0.5%-a színtévesztő – Legtöbb probléma a zöld színek tartományában van
Képek • Minden nem szöveges információnak legyen szöveges megfelelője (HTML ALT tag)
Akár teljes képmagyarázat
Képek
ALT tag • Jó alternatív szöveget írni nagyon nehéz • Ne csak azt írjuk le hogy – mi van a képen – hanem hogy esetleg mire való • Pl. szerepe a navigálásban
GIF spacer • Ha GIF képet használunk az elemek közötti távolság meghatározására, vagy aminek nincs szerepe (bullet point), üres ALT tag-et használjunk: – Így a felolvasó szoftverek nem fogják figyelembe venni – Egyébként azt olvassa „image, image, image ...”
Csak szöveges oldalak • Alternatívaként legyen lehetőség olyan oldalakra amelyek csak szövegesek és ugyanazt az információt tartalmazzák Oldal teteje
Oldal alja
Eszközök • • • •
Szöveges browser Speciális billentyűzet Braille írást megjelenítő, mely a képernyőről olvas Képernyő nagyító