Prezentace se nahrává, počkejte prosím

Prezentace se nahrává, počkejte prosím

Přístupnost webových stránek David Špinar, Dobrý web.

Podobné prezentace


Prezentace na téma: "Přístupnost webových stránek David Špinar, Dobrý web."— Transkript prezentace:

1 Přístupnost webových stránek David Špinar, Dobrý web

2 Obsah prezentace  Co je to přístupnost a k čemu je dobrá  Pro koho a proč je přístupnost důležitá  Legislativa v oblasti přístupnosti  Zásady přístupného webu ► Zákon č. 365/2000 Sb. o ISVS ► Další metodiky (WCAG, Section 508)  Testování přístupnosti webu

3 Co je to „přístupnost“ ► V angličtině „accessibility“ ► Několik definic:  Přístupná webová stránka je použitelná pro každého uživatele Internetu, a sice nezávisle na jeho postižení, schopnostech, znalostech, zkušenostech či zobrazovacích možnostech.  Přístupná webová stránka nestaví svým potenciálním uživatelům do cesty překážky, které by jim znemožnily danou stránku efektivně použít.  Přístupná webová stránka respektuje své uživatele a předpokládá vysokou variabilitu možností a schopností svých uživatelů. ► Přístupnost je jeden ze základních kamenů tvorby webových stránek (jako další se uvádějí např. použitelnost, dobrá informační architektura či SEO)

4 Proč je přístupnost tak důležitá? Existují dva základní důvody (premisy): 1. Všichni uživatelé Internetu nejsou stejní. Všichni stejně nevidí, stejně neslyší, nemluví stejným jazykem, nemají stejnou schopnost používat horní končetiny, nemají stejné hardwarové vybavení, znalosti a zkušenosti v používání Internetu apod. 2. Každý takto "specifický" uživatel má většinou i "specifické" potřeby, které není schopen překročit či obejít.

5 Kdo tedy má „specifické“ potřeby? ► Uživatele se „specifickými“ potřebami budeme nazývat „hendikepovaným“. ► „Hendikepovaný uživatel“ je v našem kontextu tedy:  uživatel, u kterého lze důvodně předpokládat, že mu nevhodně vytvořená webová stránka bude činit problémy při použití, které není schopen jednoduše obejít. Tento hendikep vztahuje tedy pouze na použitelnost webových stránek. Hendikepovaným uživatelem z hlediska použití webových stránek budeme tak nazývat i člověka, který v běžném životě žádný hendikep nemá.

6 Základní kameny přístupnosti Základním smyslem snahy o přístupný web je tedy: 1. Pochopit, jací uživatelé s různými hendikepy používají Internet. 2. Pochopit, jaké jsou jejich specifické potřeby, které nemohou obejít 3. Tyto specifické potřeby naplnit.

7 Základní důvody pro přístupnost ► Více obchodních příležitostí  Hendikepovaných uživatelů je skutečně mnoho (např. v UK cca 8,6 mil s kupní silou 45 mld. Liber ročně)  Není pravda, že hendikepovaní nejsou cílovou skupinou ► Lepší viditelnost webu  Přístupný web je zároveň „robot-friendly“  Vyhledavače majitelé stránek milují, ale často jim indexaci pěkně znepříjemňují

8 Základní důvody pro přístupnost II. ► Posilování značky  Diskriminace je vnímána negativně  Přístupnost buduje renomé ► Úspora nákladů na správu a změny webu  Přístupný web se díky svým charakteristikám velmi dobře spravuje a aktualizuje. ► Zákonnost  Nepřístupné weby jsou v mnoha zemích za hranicí zákona.

9 Hendikepovaní uživatelé

10 Základní skupiny hendikepovaných Hendikepované uživatele Internetu můžeme rozdělit do následujících skupin: 1. Zrakově postižení 2. Sluchově postižení 3. Pohybově postižení 4. Uživatele se zobrazovacími problémy 5. Uživatelé s poruchami učení a soustředění 6. Roboti 7. Ostatní

11 Zrakově postižení ► Považováni často za jedinou skupinu hendikepovaných ► Nepřístupný web na ně dopadá nejvíce ► Nejsou největší skupinou ► Zrakově postižené můžeme opět rozdělit do několika skupin  Zcela nevidomí a jinak těžce zrakově postižení  Slabozrací  Barvoslepí  Uživatelé s dočasně zhoršenou schopností vidět

12 Zcela nevidomí a jinak těžce zdravotně postižení ► Menší část, ale s největším negativním dopadem nepřístupných stránek ► Internet je pro ně často jedinou možností jak „překonat“ své postižení ► Pro prezentaci obsahu používají hlasové čtečky a braillský řádek ► Jejich základní potřebou je možnost spolehnout se na textovou informaci – obsah musí být vhodně strukturován, grafické a multimediální prvky musejí mít textové alternativy, musí být použitelná navigace.

13 Slabozrací ► Jen omezená možnost používat zrak ► Potřebují manipulovat s textem, hlavně jej zvětšovat ► Text musí být čitelný i při velkém zvětšení, a to i vůči svému okolí (problém s obrázky, výškou řádků apod.)

14 Barvoslepí ► Forem sníženého barevného citu je celá řada ► Tito uživatelé mají často problém rozeznávat některé barvy od sebe. ► Je třeba dodržovat správný kontrast barev a u prezentace důležitého obsahu se na barvy raději nespoléhat.

15 Uživatelé s dočasně zhoršenou možností vidět ► Jde o aktuální světelné a zobrazovací možností ► Např. osvětlení místnosti, přímé slunce v monitoru, nekvalitní monitor apod. ► Opět je třeba dbát na kontrast, možnost zvětšení obsahu, správnou strukturu dokumentu apod.

16 Sluchově postižení ► Zatím není takový problém, protože audio složek na webu příliš není. ► Mezi sluchově postižené řadíme nejen skutečně postižené, ale majitele počítačů bez reproduktorů nebo uživatele s dočasně zhoršenou možností slyšet. ► Je třeba vždy u každé audio a multimediální složky uživateli nabídnout textovou alternativu.

17 Pohybově postižení ► Základní problém: nemožnost používat myš ► Jediným způsobem, jak web ovládat, je často jen klávesnice. ► I v rámci skupiny pohybově postižených je skupina s „dočasnou“ nemožností ovládat horní končetiny (úrazy apod.) ► Klávesnice tedy musí stránky plnohodnotně ovládat.

18 Uživatelé se zobrazovacími potížemi ► Jsou to de facto:  Uživatelé alternativních prohlížečů  Majitelé jiných zobrazovacích zařízení ► Není to vždy otázkou volby ► Škála zobrazovacích zařízení radikálně roste ► V rámci těchto zařízení nejde o to, aby se web zobrazoval zcela stejně, ale aby byl použitelný a funkční

19 Uživatelé s poruchami učení a soustředění ► Takových uživatelů je velmi mnoho, ačkoliv se na ně v souvislosti s přístupností často zapomíná ► Konkrétních projevů velmi mnoho, nejčastější např. dyslexie či klasické poruchy soustředění ► Jejich potřeby: přehledné, strukturované a jednoduše pochopitelné webové stránky se strukturovaným obsahem, přehlednou navigací. Písmo spíše větší, krátké odstavce, hodně nadpisů, více vizuálních "zarážek" pro oči, více obrázkových symbolů místo slov apod.

20 Roboti ► Jde především o roboty vyhledávačů ► Robot nevidí barvy, neslyší zvuk, nerozpozná obsah obrázků, neumí používat JavaScript ani Flash. Jádro je tedy v textu a odkazech. ► Je třeba nabídnout co nejlepší obsah, co nejlépe označkovaný strukturálními značkami (nadpisy, odstavce, seznamy, zdůraznění apod.) a vždy se u toho spolehnout na čistý text.

21 Ostatní ► Lidé s omezenou schopností porozumět danému jazyku (cizinci, emigranti apod.) ► Všichni ostatní, pro které přístupný web zlepší jejich použitelnost

22 Legislativa v oblasti přístupnosti

23 ► Základním důvodem pro legislativu  Snížit možnost diskriminace.  Najít pro neziskové organizace podobný efekt jako je pro komerční subjekty zisk. ► Různé země mají různé právní normy upravující přístupnost:  Obecné právní normy upravují diskriminaci jako takovou (např. UK, Německo, Portugalsko)  Specializované právní normy na přístupnost webových stránek (např. USA, ČR)

24 Legislativa v oblasti přístupnosti II. ► ČR: Zákon č. 365/2000 Sb. o ISVS  Zatím v projednávání  Platné pro subjekty státní správy a samosprávy  Povinnost přístupného webu pod hrozbou sankce 1 milión Kč  Konkrétní pravidla řeší prováděcí předpis (do doby schválení novely doporučení, poté vyhláška)

25 Legislativa v oblasti přístupnosti III. ► US Section 508  Americký zákon upravující přístupnost webových stránek  Účinný na subjekty financované z veřejných zdrojů  Vychází z pravidel WCAG, ale přináší svou vlastní interpretaci pravidel  Navazuje na obecný zákon „Americans with Disabilites Act (ADA) ► Disability Discrimination Act (DDA)  Britský zákon obecně upravující diskriminaci  Pamatuje i na šíření informací skrze Internet  Dopadá na firmy poskytující zboží a služby koncovým klientům, zaměstnavatele, vzdělávací instituce apod.

26 Konkrétní pravidla přístupnosti

27 Důležité poznámky ke jednotlivým zásadám a metodikám ► Zásady vycházejí z toho:  Jak úzce je interpretována přístupnost  Jak hendikepovaní aktuálně používají počítač  Jaké schopnosti mají aktuálně internetové prohlížeče a pomocné technologie ► Zásady jsou tedy dobově podmíněné a s vývojem zastarávají

28 Nejznámější metodiky pro tvorbu přístupného webu ► Zákon o ISVS – nejužší pravidla přístupnosti pro zdravotně postižené, tzv. „minimum přístupnosti“ ► Blind Friendly Web – přístupnost pro zrakově postižení ► WCAG – obecná přístupnost s akcentem na zdravotně postižené ► Dogma 4W – překryv přístupnosti a použitelnosti ► Section 508 – obecná přístupnost vycházející z WCAG

29 ČR: Zákonná pravidla přístupnosti Zákon č. 365/2000 Sb., o informačních systémech veřejné zprávy

30 A. Obsah stránek je dostupný a čitelný

31 Obsah stránky je dostupný a čitelný I. ► A.1 Každý netextový prvek nesoucí významové sdělení má svou textovou alternativu. ► A.2 Informace sdělované prostřednictvím skriptů, objektů, appletů, kaskádových stylů, obrázků a jiných doplňků na straně klienta jsou dostupné i bez kteréhokoli z těchto doplňků.

32 Obsah stránky je dostupný a čitelný II. ► A.3 Informace sdělované barvou jsou dostupné i bez barevného rozlišení. ► A.4 Barvy popředí a pozadí jsou dostatečně kontrastní. Na pozadí není vzorek, který snižuje čitelnost.

33 Obsah stránky je dostupný a čitelný III. ► A.5 Předpisy určující velikost písma nepoužívají absolutní jednotky ► A.6 Předpisy určující typ písma obsahují obecnou rodinu písem.

34 B. Práci se stránkou řídí uživatel

35 Práci se stránkou řídí uživatel I. ► B.1 Obsah stránky se mění, jen když uživatel aktivuje nějaký prvek. ► B.2 Stránka bez přímého příkazu uživatele nemanipuluje uživatelským prostředím.

36 Práci se stránkou řídí uživatel II. ► B.3 Nová okna se otevírají jen v odůvodněných případech a uživatel je na to předem upozorněn. ► B.4 Na stránce nic nebliká rychleji než jednou za sekundu

37 Práci se stránkou řídí uživatel III. ► B.5 Stránka nebrání uživateli posouvat obsahem rámů. ► B.6 Obsah ani kód stránky nepředpokládá ani nevyžaduje konkrétní způsob použití ani konkrétní výstupní či ovládací zařízení.

38 C. Informace jsou srozumitelné a přehledné

39 Informace jsou srozumitelné a přehledné I. ► C.1 Stránky sdělují informace jednoduchým jazykem a srozumitelnou formou. ► C.2 Úvodní strana jasně popisuje smysl a účel webu. Název webu či jeho provozovatele je zřetelný.

40 Informace jsou srozumitelné a přehledné II. ► C.3 Stránka i jednotlivé obsahové prvky uvádějí své hlavní sdělení na svém začátku. ► C.4 Rozsáhlé obsahové bloky jsou rozděleny do menších, výstižně nadepsaných celků.

41 Informace jsou srozumitelné a přehledné III. ► C.5 Informace zveřejňované na základě zákona jsou dostupné jako textový obsah WWW stránky. ► C.6 Na samostatné stránce je uveden kontakt na technického správce a prohlášení jasně vymezující míru přístupnosti webu a jeho částí. Na tuto stránku odkazuje každá stránka webu.

42 D. Ovládání webu je jasné a pochopitelné

43 Ovládání webu je jasné a pochopitelné I. ► D.1 Každá stránka má smysluplný název, vystihující její obsah. ► D.2 Navigační a obsahové informace jsou na stránce zřetelně odděleny.

44 Ovládání webu je jasné a pochopitelné II. ► D.3 Navigace je srozumitelná a je konzistentní na všech stránkách. ► D.4 Každá stránka (kromě úvodní strany) obsahuje odkaz na vyšší úroveň v hierarchii webu a odkaz na úvodní stranu.

45 Ovládání webu je jasné a pochopitelné III. ► D.5 Všechny stránky rozsáhlejšího webu obsahují odkaz na přehlednou mapu webu. ► D.6 Obsah ani kód stránky nepředpokládá, že uživatel již navštívil jinou stránku.

46 Ovládání webu je jasné a pochopitelné IV. ► D.7 Každý formulářový prvek má přiřazen výstižný nadpis. ► D.8 Každý rám má vhodné jméno či popis vyjadřující jeho smysl a funkčnost.

47 E. Odkazy jsou zřetelné a návodné

48 Odkazy jsou zřetelné a návodné I. ► E.1 Označení každého odkazu výstižně popisuje jeho cíl i bez okolního kontextu. ► E.2 Stejně označené odkazy mají stejný cíl ► E.3 Odkazy jsou odlišeny od ostatního textu, a to nikoli pouze barvou.

49 Odkazy jsou zřetelné a návodné II. ► E.4 Obrázková mapa na straně serveru je použita jen v případě, že nebylo možné pomocí dostupného geometrického tvaru definovat oblasti v obrázkové mapě. V ostatních případech je použita obrázková mapa na straně klienta. Obrázková mapa na straně serveru je vždy doprovázena alternativními textovými odkazy. ► E.5 Uživatel je předem jasně upozorněn, když odkaz vede na obsah jiného typu, než je WWW stránka. Takový odkaz je doplněn sdělením o typu a velikosti cílového souboru.

50 F. Kód je technicky způsobilý a strukturovaný

51 Kód je technicky způsobilý a strukturovaný I. ► F.1 Kód stránek odpovídá nějaké zveřejněné finální specifikaci jazyka HTML či XHTML. Neobsahuje syntaktické chyby, které je správce stránek schopen odstranit. ► F.2 V metaznačkách je uvedena použitá znaková sada dokumentu

52 Kód je technicky způsobilý a strukturovaný II. ► F.3 Prvky tvořící nadpisy a seznamy jsou korektně vyznačeny ve zdrojovém kódu. Prvky, které netvoří nadpisy či seznamy, naopak ve zdrojovém kódu takto vyznačeny nejsou. ► F.4 Pro popis vzhledu stránky jsou upřednostněny stylové předpisy.

53 Kód je technicky způsobilý a strukturovaný III. ► F.5 Je-li tabulka použita pro rozvržení obsahu stránky, neobsahuje záhlaví řádků ani sloupců. Všechny tabulky zobrazující tabulková data naopak záhlaví řádků a/nebo sloupců obsahují. ► F.6 Všechny tabulky dávají smysl čtené po řádcích zleva doprava.

54 Web Content Accessibility Guidelines (WCAG)

55 WCAG – základní informace ► Nejznámější a nejuznávanější metodika ► Aktuální verze WCAG 1.0 (připravuje se WCAG 2.0) ► Tvůrce je konsorcium W3C, konkrétně její pracovní skupina WAI (Web Accessibility Initiative) ► WCAG 1.0 vytvořen v polovině 90. let ► Zdrojem pro ostatní metodiky ► Velmi dobře postihuje problematiku zdravotně postižených ► Mezery má na poli použitelnosti pro skupiny s poruchami učení a soustředění apod.

56 WCAG - struktura ► WCAG tvořena 14 pravidly (tzv. guidelines), v rámci nichž je uvedena řada kontrolních bodů (tzv. checkpoints). ► Kontrolní body jsou rozděleny podle priority:  Priorita 1: Web musí splňovat dané pravidlo, jinak se stává nepřístupným pro hendikepované uživatele.  Priorita 2: Web by měl splňovat danou zásadu, jinak je obtížně přístupný pro některé skupiny hendikepovaných uživatelů.  Priorita 3: Web by mohl splňovat danou zásadu, protože tak ulehčí přístup hendikepovaným uživatelům. ► Soulad webu (tzv. compliance level) s danými pravidly je vyjádřen počtem písmen „A“  „A“ – web splňuje všechny kontrolní body s prioritou 1  „AA“ – web splňuje všechny kontrolní body s prioritou 1 a 2  „AAA“ – web splňuje všechny kontrolní body s prioritou 1, 2 a 3

57 Vybrané zásady z WCAG I. ► 3.7 Označte citace, nepoužívejte značky pro citace pro vizuální efekty, jako je odsazení  Priorita 2  Co je významovou citací, musí být citací i ve zdrojovém kódu (značky „Q“ a „BLOCKQUOTE“). Pro ostatní prvky se tyto značky používat nesmí. ► 4.2 Specifikujte význam každé zkratky při jejím prvním výskytu  Priorita 3  značky „ABBR“ a „ACRONYM“

58 Vybrané zásady z WCAG II. ► 4.1 Jasně označte změny v jazyce v textu dokumentu i textových alternativách jiných prvků  Priorita 1  Atributy „LANG“, a/nebo „XML:LANG“ ► 4.3 Identifikujte primární jazyk dokumentu  Priorita 3  Značka „LANG“ u prvku „HTML“

59 Vybrané zásady z WCAG III. ► 5.2 V datových tabulkách označte sdružené řádky či sloupce  Priorita 1,  jde o sdružující značky „THEAD“, „TBODY“, „TFOOT“, „COLGROUP“ a vazební atributy „axis“, „scope“ a „headers“ ► 5.5 V tabulkách uvádějte stručný přehled  Priorita 3,  Jde o atribut „SUMMARY“ ve značce „TABLE“

60 Vybrané zásady z WCAG IV. ► 9.4 Vytvořte logický sled při používání tabulátoru (odkazy, položky formulářů atp.)  Priorita 3  Jde o atribut „TABINDEX“ ► 9.5 Pro důležité odkazy, položky formulářů a jejich skupiny vytvořte klávesové zkratky  Priorita 3  Jde o atribut „ACCESSKEY“

61 Testování přístupnosti

62 ► Ruční kontrola  Není nutné znát pravidla, kontrolují se jen výsledky  Není spolehlivé ► Automatická kontrola  On-line nástroje pokrývají jen automaticky zkontrolovatelné prvky  Předpoklad následné ruční kontroly ► Profesionální kontrola  Finanční náročně, ale jediné zcela spolehlivé

63 Ruční kontrola 1. Použití on-line testu přístupnosti 2. On-line validace syntaxe kódu (HTML, XML, CSS) 3. Použití textové prohlížeče (Lynx, Links) 4. Použití grafického prohlížeče s: 1. Funkční grafikou i zvuky 2. Nefunkční grafikou 3. Nefunkčními zvuky 4. Bez použití myši 5. Nefunkčními framy, skripty, CSS, applety 5. Použití různých prohlížečů (nových i starých) 6. Použití hlasové čtečky, softwarové lupy 7. Použití gramatické kontroly textu 8. Kontrola jednoduchosti textu 9. Kontrola přístupnosti hendikepovanými lidmi

64 Ruční kontrola - tipy ► Použijte toolbary pro ovládání nastavení prohlížeče  MSIE – „Accessibility toolbar“  Mozilla – „Webdevelopment toolbar“  Viz ► Pro audit čitelnosti anglického textu použijte známé metodiky  Gunning Fog Index  Flesch Reading Ease  Flesch-Kincaid grade level 

65 Automatická kontrola ► Různé on-line nástroje:  Cynthia Says  Wave  Bobby ► ► Není třeba znát pravidla, ale je nutná následná ruční kontrola

66 KONEC


Stáhnout ppt "Přístupnost webových stránek David Špinar, Dobrý web."

Podobné prezentace


Reklamy Google