Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Pravidla přístupnosti prakticky

1,840 views

Published on

Leden 2009 - SIGCHI

Přednáška Pravidla přístupnosti prakticky. Obsahem je demonstrace dopadů porušení pravidel přístupnosti za použití screen readeru NVDA

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Pravidla přístupnosti prakticky

  1. 1. Pravidla přístupnosti prakticky
  2. 2. Představení <ul><li>Adam Fendrych </li></ul><ul><ul><li>Konzultant projektu Dobrý web </li></ul></ul><ul><ul><li>E-mail: adam .fendrych@ dobryweb .cz </li></ul></ul><ul><ul><li>Telefon: 244 003 337 </li></ul></ul>
  3. 3. Pravidla přístupnosti <ul><li>Zásady zpracování webu s ohledem na hendikepované uživatele </li></ul><ul><li>V ČR je kolem 10 % osob s postižením </li></ul><ul><li>Od 1. 3. 2008 jsou pravidla pro systémy veřejné správy povinná ze zákona </li></ul><ul><li>www.pravidla-pristupnosti.cz , www.pristupnost.cz </li></ul>
  4. 4. Kapitoly pravidel přístupnosti <ul><li>Obsah webových stránek je dostupný a čitelný </li></ul><ul><ul><li>Čitelnost, nezávislost na vybavení </li></ul></ul><ul><li>Práci s webovou stránkou řídí uživatel </li></ul><ul><ul><li>Žádné samovolné akce </li></ul></ul><ul><li>Informace jsou srozumitelné a přehledné </li></ul><ul><ul><li>Srozumitelnost, struktura textu </li></ul></ul><ul><li>Ovládání webu je jasné a pochopitelné </li></ul><ul><ul><li>Navigace, interakce s formuláři </li></ul></ul><ul><li>Kód je technicky způsobilý a strukturovaný </li></ul><ul><ul><li>Sémantika, struktura kódu </li></ul></ul><ul><li>Prohlášení o přístupnosti webových stránek </li></ul>
  5. 5. Kdo jsou hendikepovaní uživatelé <ul><li>Zrakové postižení </li></ul><ul><ul><li>Slabozrací, nevidomí, barvoslepí, dočasně omezení </li></ul></ul><ul><li>Pohybové postižení </li></ul><ul><li>Sluchové postižení </li></ul><ul><li>Alternativní HW a SW </li></ul><ul><li>Kognitivní poruchy </li></ul>
  6. 6. Nevidomý uživatel – kompenzační pomůcky <ul><li>Screen reader (odečítač obrazovky) </li></ul><ul><ul><li>Hlasový výstup </li></ul></ul><ul><ul><ul><li>http://www.pristupnost.cz/screen-readery/ </li></ul></ul></ul><ul><ul><li>Hmatový výstup (Braillský řádek) </li></ul></ul><ul><ul><ul><li>http://www.pristupnost.cz/braillske-radky/ </li></ul></ul></ul>
  7. 7. Příklady dopadu porušení pravidel <ul><li>Využití screen readeru NVDA </li></ul><ul><li>Další scren readery: </li></ul><ul><ul><li>JAWS </li></ul></ul><ul><ul><li>Hal </li></ul></ul><ul><ul><li>WinMonitor </li></ul></ul><ul><ul><li>Window-Eyes </li></ul></ul>
  8. 8. NVDA <ul><li>Screen-reader </li></ul><ul><li>Instalátor i přenosná verze </li></ul><ul><li>Licence GNU GPL </li></ul><ul><li>Hlasový výstup eSpeak </li></ul><ul><li>Podpora: </li></ul><ul><ul><li>Explorer, Internet Explorer, Mozilla Firefox, Adobe Reader </li></ul></ul><ul><li>http://www.nvda-project.org </li></ul>
  9. 9. NVDA <ul><li>Virtuální prohlížeč </li></ul><ul><ul><li>Textové znázornění dokumentu </li></ul></ul><ul><li>Nejlepší podpora – Mozilla Firefox </li></ul><ul><li>Pohyb po stránce pomocí šipek, enteru a klávesových zkratek </li></ul><ul><ul><li>(ukázka – dobryweb.cz) </li></ul></ul>
  10. 10. NVDA <ul><li>Základní zkratky pro urychlení pohybu v dokumentu: </li></ul><ul><ul><li>H – nadpis </li></ul></ul><ul><ul><li>L – seznam </li></ul></ul><ul><ul><li>I – položka seznamu </li></ul></ul><ul><ul><li>K – odkaz </li></ul></ul><ul><ul><li>T – tabulka </li></ul></ul><ul><ul><li>F – prvek formuláře </li></ul></ul>
  11. 11. Obsah webových stránek je dostupný a čitelný <ul><li>Každý netextový prvek nesoucí významové sdělení musí mít svou textovou alternativu. </li></ul><ul><ul><li>http://www.kr-stredocesky.cz/portal/aktuality/zlato-a-stribro-z-danska.htm?pg=1 </li></ul></ul><ul><li>Informace sdělované pomocí skriptů musí být dostupné a web i bez nich ovladatelný </li></ul><ul><ul><li>http://www.mustribro.cz/ </li></ul></ul><ul><ul><li>http://www.cz.o2. com </li></ul></ul>
  12. 12. Obsah webových stránek je dostupný a čitelný <ul><li>Informace sdělované rozmístěním a velikostí prvků musí být dostupné, i pokud uživatel tyto aspekty nedokáže vnímat </li></ul><ul><ul><li>http://www.parfemy.cz </li></ul></ul><ul><li>Informace sdělované barvou jsou dostupné i bez barevného odlišení </li></ul><ul><ul><li>https://booking.juhasz.cz/ </li></ul></ul>
  13. 13. Práci s webovou stránkou řídí uživatel <ul><li>Načtení nové webové stránky či přesměrování musí být možné jen po aktivaci odkazu nebo po odeslání formuláře </li></ul><ul><ul><li>http://www.pristupnost.cz/soubory/refresh.html </li></ul></ul><ul><ul><li>http://google-cz.blogspot.com </li></ul></ul><ul><ul><li>http://fotbal.idnes.cz/db_fotbal.asp?online=7054655 </li></ul></ul>
  14. 14. Informace jsou srozumitelné a přehledné <ul><li>Bloky obsahu, které se opakují na více webových stránkách daného orgánu veřejné správy, je možné přeskočit </li></ul><ul><ul><li>http://www.mzv.eu/wwwo/mzv/default.asp?ido=3&idj=1&amb=1&ikony=False&trid=1&prsl=False </li></ul></ul>
  15. 15. Ovládání webu je jasné a pochopitelné <ul><li>Každá webová stránka musí mít výstižný název odpovídající jejímu obsahu </li></ul><ul><ul><li>http://www.lucas.cz </li></ul></ul><ul><li>Text odkazu musí jasně popisovat jeho cíl </li></ul><ul><ul><li>http://www.mesec.cz/aktuality/ </li></ul></ul>
  16. 16. Kód je technicky způsobilý a strukturovaný <ul><li>Prvky tvořící nadpisy a seznamy musí být korektně vyznačeny </li></ul><ul><ul><li>http://datarecovery.eu/cz/zachrana-dat-hlavni-strana.html </li></ul></ul><ul><li>Obsah všech tabulek musí dávat smysl čtený po řádcích zleva doprava </li></ul><ul><ul><li>http://portal.justice.cz/uvod/justice.aspx </li></ul></ul>
  17. 17. Na shledanou <ul><li>Adam Fendrych </li></ul><ul><ul><li>adam .fendrych@ dobryweb .cz </li></ul></ul><ul><ul><li>244 003 337 </li></ul></ul><ul><li>Dobrý web </li></ul><ul><ul><li>http://www.dobryweb.cz </li></ul></ul><ul><ul><li>[email_address] </li></ul></ul><ul><ul><li>244 003 110 </li></ul></ul>

×