w3c wai, avagy weblapok akadálymentesítése · 2014-08-04 · dsd pataki máté 5/ 67 w3c magyar...
TRANSCRIPT
![Page 1: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/1.jpg)
DSD
W3C WAI, avagyWeblapok akadálymentesítése
Pataki Máté
![Page 2: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/2.jpg)
DSD
Pataki Máté 2 / 67
Témakörök
n A World Wide Web Consortium (W3C)n W3C Magyar Irodan W3C - Web Accessibility Initiative (WAI)n WCAG 1.0n Célcsoportok
n Fogyatékossággal élőkn Technológiailag megkülönböztetettekn Speciális célcsoportok
n Technológiákn Működés ellenőrzése
![Page 3: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/3.jpg)
DSD
Pataki Máté 3 / 67
A World Wide web Consortium (W3C)
n A webszabványok fejlesztésének nyilvános fóruman Jelszavai: Semlegesség és egyetértésn Hogy kihasználhassuk a Web nyújtotta összes
lehetőséget...n 1994-ben Tim Berners Lee alapította a MIT-nn További anyaintézmények:
n ERCIM (INRIA) – Franciaországn KEIO Egyetem – Japán
n Több mint 400 tag
![Page 4: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/4.jpg)
DSD
Pataki Máté 4 / 67
Egymásra épülő W3C szabványok
![Page 5: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/5.jpg)
DSD
Pataki Máté 5 / 67
W3C Magyar Iroda
n 16 helyi iroda, 2002-től: W3C Magyar Irodan MTA SZTAK-ban működikn Tevékenységeink, szolgáltatásaink:n Magyar nyelvű információk nyújtása
nWeboldal, hírlevél, szóróanyagok…n W3C technológiák népszerűsítésen Konferenciák, workshopok, oktatás szervezése
n Célunk:n Magyar webes élet fejlődésének elősegítésen Nemzetközivel kompatibilis hazai webes
szabványok
![Page 6: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/6.jpg)
DSD
Pataki Máté 6 / 67
W3C - Web Accessibility Initiative (WAI)
n http://www.w3.org/WAI/n Web Content Accessibility Guidelinesn1.0: ajánlás (1999. máj. 5.)n2.0: munkaterv (2007. máj. 17.)
n Részletesebb útmutatón Understanding WCAG 2.0 n Technológiák sokszínűségen Szélesebb közönségnek
![Page 7: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/7.jpg)
DSD
Pataki Máté 7 / 67
WCAG 1.0
n Web Content Accessibility Guidelinesn Priority 1 (must)
n Pl.: szöveges megfelelő biztosítása minden képhez
n Priority 2 (should)n Pl.: style sheet használata (tartalom-megjelenítés)
n Priority 3 (may)n Pl.: fontos linkekhez gyorsbillentyű rendelése
n Gépi és kézi ellenőrzés
![Page 8: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/8.jpg)
DSD
Pataki Máté 8 / 67
WCAG 1.0 Checklist
http://www.w3.org/TR/WAI-WEBCONTENT/full-checklist.html
![Page 9: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/9.jpg)
DSD
Pataki Máté 9 / 67
Fogyatékossággal élők
n Fogyatékossággal élőkn Vakokn Gyengénlátókn Színvakokn Hallássérültekn Mozgássérültekn Értelmi fogyatékosok
![Page 10: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/10.jpg)
DSD
Pataki Máté 10 / 67
Vakok
n Külön lap? Budapest Portáln Más információ a vakoknak?n Többi fogyatékossággal élő?n Ajánlott a tartalom és megjelenítés elkülönítése
![Page 13: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/13.jpg)
DSD
Pataki Máté 13 / 67
Vakok
n Külön lap? Budapest Portáln Más információ a vakoknak?n Többi fogyatékossággal élő?n Ajánlott a tartalom és megjelenítés elkülönítése
n Beszédes linkekn Pl.: a Firefox 1.5 letöltésen Ugyanolyan nevű linkek kerülése
![Page 14: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/14.jpg)
DSD
Pataki Máté 14 / 67
Linkek elnevezése legyen egyedi, és értelmes
![Page 15: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/15.jpg)
DSD
Pataki Máté 15 / 67
Vakok
n Külön lap? Budapest Portáln Más információ a vakoknak?n Többi fogyatékossággal élő?n Ajánlott a tartalom és megjelenítés elkülönítése
n Beszédes linkekn Pl.: a Firefox 1.5 letöltésen Ugyanolyan nevű linkek kerülése
n Képek, appletek, videókn Elnevezés (alt attribútum)n Alternatív tartalom (longdesc vagy a szövegben)
![Page 16: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/16.jpg)
DSD
Pataki Máté 16 / 67
Képek elnevezése
![Page 17: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/17.jpg)
DSD
Pataki Máté 17 / 67
Tartalom és megjelenítés elkülönítése<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" /><title>Antoni Gaudí - Introduction</title><link rel="stylesheet" type="text/css" media="screen" href="name.css" />
</head><body>
<h1>Antoni Gaudí</h1><p>Many tourists are drawn to Barcelona to see Antoni Gaudí's incredible architecture. </p><p>The <a href="http://www.bme.hu">BME</a> celebrates the 150th anniversary of Gaudí's birth in 2002.</p>
<h2>La Casa Milà</h2><p>Gaudí's work was essentially useful. La Casa Milà is an apartment building and <em>real people</em> live there.</p>
<h2>La Sagrada Família</h2><p>The complicatedly named and curiously unfinished Expiatory Temple of the Sacred Family is the <em>most visited</em> building in Barcelona. </p></div></div>
</body></html> CSS:
h1, h2 {color:red}
![Page 18: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/18.jpg)
DSD
Pataki Máté 18 / 67
Tartalom és megjelenítés elkülönítése
![Page 19: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/19.jpg)
DSD
Pataki Máté 19 / 67
Jelöljük a strukturális elemeket
n Jelöljük a dokumentum nyelvét: lang="hu"n A fejezetcímeket jelöljük sorjában: <h1>, <h2>,
<h3>…n Listák legyenek lista típusúak: <ol>, <ul>, <li>n Használjuk rendesen a <noframe> elemet (ne az
legyen ott, hogy az ön böngészője nem támogatja)n Táblázatoknál
n Jelöljük a fejlécet: <th>n Foglaljuk össze a táblázat tartalmát
summary="Munkatársak fizetése"
![Page 20: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/20.jpg)
DSD
Pataki Máté 20 / 67
Táblázatok linearizálása
12Nagy
14Szabó
18Molnár
KorNév
121418Kor
NagySzabóMolnárNév
<table summary=„Gyerekek kora" lang="hu"><tr><th>Név</th><th>Kor</th></tr> <tr><td>Molnár</td><td>18</td></tr> <tr><td>Szabó</td><td>14</td></tr> <tr><td>Nagy</td><td>12</td></tr> </table>
![Page 21: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/21.jpg)
DSD
Pataki Máté 21 / 67
Gyengénlátók
n Nem mindig használnak felolvasóprogramotn Betűméret állítása
n pl.: CSS-ben %-ban megadni, vagyn különböző méretek biztosítása
n Nagy kontraszt (KOPI)
![Page 22: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/22.jpg)
DSD
Pataki Máté 22 / 67
Kis betűméret – Explorer: Medium és Largest
![Page 23: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/23.jpg)
DSD
Pataki Máté 23 / 67
Kis betűméret – Opera: 100% és 200%
![Page 24: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/24.jpg)
DSD
Pataki Máté 24 / 67
Böngésző-használati statisztika
http://marketshare.hitslink.com/report.aspx?qprid=0 (2007. szeptember)
![Page 25: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/25.jpg)
DSD
Pataki Máté 25 / 67
A Firefox Európában sokkal elterjedtebb
http://www.xitimonitor.com/en-us/browsers-barometer/firefox-july-
2007/index-1-2-3-102.html
![Page 26: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/26.jpg)
DSD
Pataki Máté 26 / 67
MVGYOSZ honlapja Explorerben és Operában
http://www.mvgyosz.hu
![Page 27: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/27.jpg)
DSD
Pataki Máté 27 / 67
Színvakok / színtévesztők
n Háttér-betű kontrasztarányn Csak szín ne hordozzon fontos információtn Használjunk színeket, de egyéb módon is legyen
elérhető ugyanaz az információ, pl.:n A piros és csillaggal jelölt mezők kitöltése
kötelezőn Nem színes kijelzők
n Régi gépn Mobiltelefonn PDA
![Page 28: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/28.jpg)
DSD
Pataki Máté 28 / 67
Piros mezők kitöltése kötelező
![Page 29: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/29.jpg)
DSD
Pataki Máté 29 / 67
Piros csillaggal jelölt mezők
![Page 30: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/30.jpg)
DSD
Pataki Máté 30 / 67
n Hang ne hordozzon máshogy nem elérhetőinformációtn Hallássérültekn Zajos környezet (étterem, műhely)n Hangkártya nélküli gépek (munkahely)
n Videó mellett felirat vagy leírásn Hanghoz és zenéhez alternatív szöveges
tartalom
Hallássérültek
![Page 31: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/31.jpg)
DSD
Pataki Máté 31 / 67
Videó és a beszéd teljes szövege
![Page 32: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/32.jpg)
DSD
Pataki Máté 32 / 67
n Alternatív beviteli eszközökn Csak egérn Csak billentyűzetn Láb/szemegér
n Sok gépelés mellőzése (cookie)n Pontos pozícionálás gond lehet
n Kattintható felületek nagyok legyenekn Gyorsbillentyű használata
Mozgássérültek
![Page 33: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/33.jpg)
DSD
Pataki Máté 33 / 67
Speciális billentyűzetek
![Page 34: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/34.jpg)
DSD
Pataki Máté 34 / 67
Speciális billentyűzetek
Fejjel irányítható billentyűzet és egér (http://www.lomakkeyboard.com/)
Lábbal kezelhető
billentyűzet
![Page 35: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/35.jpg)
DSD
Pataki Máté 35 / 67
Billentyűzetkezelő eszközök
![Page 36: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/36.jpg)
DSD
Pataki Máté 36 / 67
Speciális egerek, lábegér, joystick
![Page 37: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/37.jpg)
DSD
Pataki Máté 37 / 67
Szemmozgást észlelő mutatóeszköz
http://nipg.inf.elte.hu/headmouse/headmouse.html
![Page 38: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/38.jpg)
DSD
Pataki Máté 38 / 67
Szívó-fújó irányítóeszköz
![Page 39: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/39.jpg)
DSD
Pataki Máté 39 / 67
Pontos pozícionálás az almenü fekete sávjában
![Page 40: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/40.jpg)
DSD
Pataki Máté 40 / 67
n Vezetni a felhasználót (kikapcsolható)n Mindig tudja hol tartn Visszajuthat a kiindulópontran Ikonok/jelek következetes használata
n Oldaltérképn Részletes súgó
Értelmi fogyatékosok
![Page 41: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/41.jpg)
DSD
Pataki Máté 41 / 67
Oldaltérkép / menütérkép
![Page 42: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/42.jpg)
DSD
Pataki Máté 42 / 67
Technológiailag megkülönböztetettek
n Technológiailag megkülönböztetettekn Eltérő képernyőméretn Elavult böngésző / operációs rendszern Gyenge hardware
![Page 43: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/43.jpg)
DSD
Pataki Máté 43 / 67
Eltérő képernyőméret
n Képernyők >19’’n CNN 220px
n Mobiltelefonn Képernyőn Memórian Lapozás
n PDAn 320x200n 640x480
n Vízszintes görgetésn Kis betűk (nagyítás)
![Page 44: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/44.jpg)
DSD
Pataki Máté 44 / 67
Mobil böngészés előretörése
Forrás: Nokia study, 2005.
A webezés a legnagyobb adatforgalmat genetáló szolgáltatás
![Page 45: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/45.jpg)
DSD
Pataki Máté 45 / 67
Mobil böngészés előretörése
n T-Mobile Web'n'Walk (korlátlan hozzáférés bizonyos szolgáltatásokhoz): n 330 oldaletöltés havonta és felhasználónkéntn 199%-os bevételnövekedés az adatforgalomban (SMS
nélkül)n Forrás: Opera, 2006. április
n BBC n BBC: 2005-ben kétszeresére nőtt a mobil tartalmak iránti
kérések száman Közel 250 millió kérés napontan 28%-a a mobil felhasználóknak csak mobilról használja az
oldalt (PC-ről nem)n Forrás: BBC, 2005. november
![Page 46: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/46.jpg)
DSD
Pataki Máté 46 / 67
Mobil böngészés előretörése
nA felhasználok jelentős részének a készüléke képes a mobil webezésre.nAz aktív webezők száma rohamosan nő, és még csökkenő árak mellett is növekednek az ebből származó bevételek.nForrás: W3C-MWI/Nokia
![Page 47: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/47.jpg)
DSD
Pataki Máté 47 / 67
Mobil böngészés a WC-től a konyháig :-)
![Page 48: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/48.jpg)
DSD
Pataki Máté 48 / 67
A mobiltelefon terjedése
![Page 49: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/49.jpg)
DSD
Pataki Máté 49 / 67
Elavult böngésző / operációs rendszer
n Nem biztos, hogy van:n JavaScriptn Flashn Javan …
n http://www.fkf.hu/n Javascriptteln És nélküle
![Page 50: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/50.jpg)
DSD
Pataki Máté 50 / 67
Gyenge hardware
n Gyenge hardware => elavult softwaren Lassú internet-kapcsolat (modem, mobil)
n Képek legyenek kicsiknKépből kirakott menü méretenHTML-ben átméretezett képek kerülése
n HTML kód tisztítása segíthetn Ajax sokat gyorsíthat
n Lassú processzor, kevés memórian Nagy méretű oldalakat lassan kezelikn Java appletek lassítják
![Page 51: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/51.jpg)
DSD
Pataki Máté 51 / 67
Oldal mérete - letöltési sebesség
4,51457231071index.hu
1,961304567origo.hu
1,652258307microsoft.hu
1,651257664cnn.com
1,340200747bme.hu
1,032158500pannon.hu/egyeni
0,825127430iwiw.hu
0,384147erg.bme.hu
128kb/s ADSL (s)
5kb/s modemmel
(s)
Tömörítettméret (kb)
Főlapmérete (kb)Honlap címe
![Page 52: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/52.jpg)
DSD
Pataki Máté 52 / 67
Speciális célcsoportok
n Speciális célcsoportokn Gyerekekn Idősekn Alacsony (informatikai) képzettségűekn Idegen nyelvek és kultúrák
![Page 53: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/53.jpg)
DSD
Pataki Máté 53 / 67
Gyerekek
n Nem tud olvasni (Manósorozat)
n Sok választási lehetőség nem jó
n Vezetni kelln Könnyen elkalandozik a
figyelmen Mindenre rákattint
(legjobb tesztalany :-)
![Page 54: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/54.jpg)
DSD
Pataki Máté 54 / 67
Idősek / alacsony képzettségűek
n Idősekn Betűméret változtatható legyenn Mozgó ikonok, reklámok, szövegek
n Elvonják a figyelmetn Fárasztják a szemet
n Alacsony (informatikai) képzettségűekn Felugró ablakok félrevezetikn Szakzsargon mellőzésen Súgó (ne informatikus írja, context sensitive)
![Page 55: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/55.jpg)
DSD
Pataki Máté 55 / 67
Idegen nyelvek és kultúrák
n Cégeknél (idegen nyelvű vagy nyelven is)n Fogalmazás (Amazon.com, .de és .jp)n Dátum: 12/03/07 (nap/hó/év), 2007. március 12.n Karakterkészlet, jobbról balra írás
![Page 56: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/56.jpg)
DSD
Pataki Máté 56 / 67
Technológiák
n Flashn Csak a nyitóoldal (FKF)n Alternatív tartalom (Harry Potter)
n JavaScriptn Alternatív lehetőségekn Kliens oldali ellenőrzés (is!)n CSS és/vagy JavaScript: DynDemo
n Applet és ActiveXn Nincs mindig engedélyezven Bizonyos esetekben szükséges (online játék)n Legtöbb esetben elkerülhető
![Page 57: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/57.jpg)
DSD
Pataki Máté 57 / 67
Flash-sel és nélküle
![Page 58: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/58.jpg)
DSD
Pataki Máté 58 / 67
DynDemo Internet Explorerben
![Page 59: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/59.jpg)
DSD
Pataki Máté 59 / 67
DynDemo Lynx szöveges böngészőben
![Page 60: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/60.jpg)
DSD
Pataki Máté 60 / 67
DynDemo Operában, JS nélkül
![Page 61: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/61.jpg)
DSD
Pataki Máté 61 / 67
DynDemo Operában képek nélkül
![Page 62: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/62.jpg)
DSD
Pataki Máté 62 / 67
DynDemo Operában szöveges módban
![Page 63: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/63.jpg)
DSD
Pataki Máté 63 / 67
Működés ellenőrzése
n Próbáljuk ki több böngészőben is:n Internet Explorer (több gépen több verzió)n Opera (több verzió is elmegy egy gépen)n Firefoxn Netscapen Safari (Apple)n Lynx (szöveges böngésző)n Mobiltelefon böngészője
![Page 64: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/64.jpg)
DSD
Pataki Máté 64 / 67
Működés ellenőrzése (IE6, Opera8, Opera5)
![Page 65: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/65.jpg)
DSD
Pataki Máté 65 / 67
W3C Validator
![Page 66: W3C WAI, avagy weblapok akadálymentesítése · 2014-08-04 · DSD Pataki Máté 5/ 67 W3C Magyar Iroda n 16 helyiiroda, 2002-től: W3C Magyar Iroda n MTA SZTAK-banműködik n Tevékenységeink,](https://reader034.vdocuments.mx/reader034/viewer/2022050308/5f7079ef41fae8399d058a07/html5/thumbnails/66.jpg)
DSD
Pataki Máté 66 / 67
W3C Validator