SlideShare uma empresa Scribd logo
1 de 88
Baixar para ler offline
Přístupnost webů knihoven – příklady
dobré a špatné praxe
Radek PAVLÍČEK,TyfloCentrum Brno, o. p. s., projekt Blind Friendly Web
Máte rádi CAPTCHA?
Líbila by se vám takto
prezentovaná stránka
vaší knihovny?
Pokud jste na obě
otázky odpověděli ne,
pak si prohlížíte
správnou prezentaci 
Co je to přístupnost?
Za přístupný web lze dnes považovat
takový web, který bude návštěvník
schopen
 i přes své specifické potřeby,
 za pomoci prostředků, které má
k dispozici,
 způsobem, který mu vyhovuje,
efektivně používat a dosáhnout svého cíle.
Lépe odpovídá současné situaci v oblasti přístupnosti (jen
o málokteré stránce lze dnes prohlásit, že je naprosto nepřístupná).
PĚT PILÍŘŮ
PŘÍSTUPNOSTI
Dostupnost
Ovladatelnost
Srozumitelnost
Orientace
Čas
Na přístupný web se musí být
uživatel schopen dostat, musí
jej být schopen ovládat, musí
mu rozumět a to, proč na web
přišel, musí být schopen
zvládnout udělat v nějakém
rozumném čase.
Dostupnost: uživatel se k informacím musí
být schopen dostat,
Ovladatelnost: pokud už k nim dostane, musí
je být schopen ovládat (příkladem mohou být
formulářové prvky),
Srozumitelnost: musí rozumět tomu, co se po
něm chce,
Orientace: musí být schopen se dostat tam,
kam potřebuje (například na další stránku),
Čas: a toto všechno musí zvládnout v
rozumném čase.
PŘÍSTUPNOST JE
DŮLEŽITÁ PRO
UŽIVATELE
Nejen pro ty se
zdravotním
postižením.
Záběr přístupnosti je
dnes mnohem širší,
než se může na první
pohled zdát.
Například v této bezbariérové
tramvaji se lépe cestuje nejen
vozíčkářům, ale třeba i
maminkám s kočárky nebo
těm cestujícím, kteří mají
problémy s chůzi a používají
například hůl nebo berle.
V soutěži Biblioweb už
řadu let testujeme weby
knihoven na přístupnost.
Čím je pro nás tato soutěž
charakteristická?
Hodně webů
Málo času
Weby různé úrovně
Do soutěže se každoročně hlásí
několik desítek webů různé
úrovně, které musíme v relativně
krátké době (přibližně 3 týdny)
otestovat. Naše testování je
mixem heuristického (tzn.
testování podle vybraných
pravidel přístupnosti) a
uživatelského testování.
Uživatelské
testování
Heuristické
testování
Nalezeno
Nenalezeno
Poplatek
Nalezeno
Nenalezeno
Uživatelské testování odhalí bariéry i
oblastech, kde zpravidla
provozovatelé webů žádný problém
neočekávají. Stává se pravidlem, že
na přibližně čtvrtině soutěžní webů
nejsou testeři schopni najít tak
zásadní informaci, jako je výše
čtenářského poplatku pro daný rok.
DRTIVÁVĚTŠINA
KNIHOVEN SVÉ WEBY PO
STRÁNCE PŘÍSTUPNOSTI
NEVYLEPŠUJE 
DŮVODY
CHYBĚJÍCÍ
ODBORNÉ
ZNALOSTI
FINANCE
CORPORATE IDENTITY,
MANAŽERSKÉ
ROZHODNUTÍ
NEZÁJEM
JINÝ POHLED NAVĚC
Ke zlepšení přístupnosti není
hned třeba předělávat celý
web – často i malá úprava
může přístupnost webu
výrazně zlepšit.
STRUKTUROVÁNÍ
OBSAHU
Uživatelé chodí na webové stránky knihoven pro informace a
chtějí je získat co nejrychleji. Základem reálné přístupnosti a
použitelnosti pro uživatele se specifickými potřebami je tedy
přehledná, konzistentní a kompaktní navigace v rámci
stránky i webu.Té můžeme docílit různými způsoby. Jedním z
nich je strukturování stránky pomocí nadpisů.
Nadpisy slouží uživatelům jako důležité záchytné body pro
orientaci a přesun na jednotlivé části stránky. Zatímco pro
uživatele, kteří s webem pracují vizuálně, je potřeba nadpisy
dostatečně odlišit od okolního textu na vizuální úrovni, pro
uživatele screen readerů je potřeba nadpisy vyznačit i na
úrovni HTML kódu a použít k tomu odpovídající HTML
elementy.
Dobře vytvořenou strukturu nadpisů si můžeme pro
jednoduchost přirovnat k obsahu knihy – podobně,
jako z obsahu získáme představu o názvech kapitol a
můžeme se díky vazbě název kapitoly-číslo stránky
rychle v knize přesunout tam, kam potřebujeme,
stejnou službu udělá nevidomému uživateli dobře
vytvořená struktura nadpisů.
Kompletní návod, jak strukturování pomocí nadpisů
udělat, najdete v článku Jak přístupně strukturovat
webovou stránku pomocí nadpisů na adrese
http://poslepu.blogspot.com/2010/01/jak-pristupne-
strukturovat-web-pomoci.html
Pokud na webu žádné nadpisy
na úrovní kódu vyznačeny
nejsou, uživatel screen readeru
nemá prakticky žádnou
možnost, jak se s obsahem
webu efektivně seznámit a
rychle se přesouvat na ty části
stránky, které jej zajímají.
Pochopení struktury stránky
pomáhá i vhodná hierarchie
nadpisů.V případě, kdy jsou
všechny nadpisy vyznačeny
jako nadpisy třetí úrovně, nemá
uživatel šanci poznat, který z
nadpisů má vyšší prioritu (a zde
ani třeba to, na kterém webu se
nachází).
Následující dva příklady ukazují
vhodné řešení strukturování
obsahu stránky pomocí
nadpisů.
OVLADATELNOST
Z KLÁVESNICE
Ovladatelnost webu z klávesnice je z hlediska
přístupnosti neméně důležitá. Uživatel musí
mít možnost se na všechny prvky na stránce,
které mohou získat focus (odkazy, formulářové
prvky), dostat z klávesnice a také musí mít
možnost prvek z klávesnice aktivovat.
Pokud ovladatelnost webu z klávesnice není
možná, může mít problém se získáváním
informací z webu celá řada návštěvníků - nejen
nevidomí, ale třeba uživatelé s motorickým
postižením horních končetin či ti, kteří
nemohou z nějakého důvodu použít myš.
TEXTOVÉ ALTERNATIVY
GRAFICKÝCH PRVKŮ
Grafické prvky jsou dnes důležitou součástí
každého webu. Často je pomocí nich vytvořeno
menu či jsou pomocí grafiky prezentovány jiné
důležité informace. Proto je potřeba, abychom
se při jejich používání vyvarovali chyb, které by
mohly zamezit získání takto publikovaných
informací uživatelům, kteří nejsou schopni
vizuálně vnímat grafické prvky.
Jednoduchá rada proto zní - veškeré grafické
prvky na stránkách, které nesou informaci,
musí mít definovánu relevantní textovou
alternativu.
FORMULÁŘE
Tématika správného zpřístupnění formulářů by
vydala na samostatnou prezentaci, proto se
omezím jen na tři nejdůležitější informace.
Každý formulářový prvek musí mít na úrovni
kódu přiřazen svůj popisek, z nějž musí být
zřejmé, o jaký prvek se jedná a co se při
interakci s ním od uživatele očekává.
Formulářové prvky také musí být bez obtíží
přístupné a ovladatelné z klávesnice a v
neposlední řadě musí být uživatelé v případě
chybových stavů o nich informováni přístupnou
formou.
RESPONZIVNÍ/MOBILNÍ
VERZE WEBU
Jednou z vhodných cest, jak vytvořit přístupný
web, může být responzivní design. Responzivní
znamená, že se vzhled stránek bude
přizpůsobovat zařízení, na kterém budou
zobrazeny a uživateli se tak budou lépe ovládat
na mobilním telefonu či tabletu.
U neresponzivních webů bývá na mobilních
zařízeních často problém s velikostí písma,
které je ve výchozí podobě příliš malé; problém
také bývá trefit prstem malé aktivní prvky
webu, jako například odkazy nebo formulářové
prvky; uživatel bývá zahlcen množstvím
informací, atp.
Obecně samozřejmě automaticky neplatí, že
responsivní = přístupný, ale například Mobile
first přístup zajistí minimálně to, že se autor
webu zamyslí nad prioritou informací a web
nebude přehlcen vším možným.
Protože právě orientace ve velkém množství
informací a efektivní a rychlý přístup k tomu, co
uživatelé na webu potřebují a hledají, je dnes z
hlediska přístupnosti naprosto klíčový.
KDE ZÍSKAT
POTŘEBNÉ
ZNALOSTI
DOPORUČENÍ NA
ZÁVĚR
Přístupnost jako součást zadávací
dokumentace
Přístupnost jako nedílná součást
vývoje webu
Vyberte si dodavatele, který
přístupnost „umí“
Pohlídejte si přístupnost
uživatelsky vkládaného obsahu
Testujte přístupnost
(nebo si ji nechte otestovat)
JDETO!
Radek PAVLÍČEK
pavlicek@blindfriendly.cz
Pokud se vám prezentace líbila, podívejte se na ni „naživo“ na
https://youtu.be/iFTH8X5Qpq4.

Mais conteúdo relacionado

Semelhante a Přístupnost webů knihoven - příklady dobré a špatné praxe

Radek Pavlíček: Přístupný web
Radek Pavlíček: Přístupný webRadek Pavlíček: Přístupný web
Radek Pavlíček: Přístupný webKISK FF MU
 
Přístupné weby knihoven
Přístupné weby knihovenPřístupné weby knihoven
Přístupné weby knihovenRadek Pavlíček
 
Použitelnost webu
Použitelnost webuPoužitelnost webu
Použitelnost webuH1.cz
 
Jak jsou na tom parádní weby s přístupností
Jak jsou na tom parádní weby s přístupnostíJak jsou na tom parádní weby s přístupností
Jak jsou na tom parádní weby s přístupnostíRadek Pavlíček
 
Ochutnávka studie WebTop100: Srovnání kvality českých webů, 2012
Ochutnávka studie WebTop100: Srovnání kvality českých webů, 2012Ochutnávka studie WebTop100: Srovnání kvality českých webů, 2012
Ochutnávka studie WebTop100: Srovnání kvality českých webů, 2012Sherpas
 
Pouzitelnost - jak mit uspesny a pratelsky web
Pouzitelnost - jak mit uspesny a pratelsky webPouzitelnost - jak mit uspesny a pratelsky web
Pouzitelnost - jak mit uspesny a pratelsky webguest3d79a4
 
Pouzitelnost - jak mit uspesny a pratelsky web?
Pouzitelnost - jak mit uspesny a pratelsky web?Pouzitelnost - jak mit uspesny a pratelsky web?
Pouzitelnost - jak mit uspesny a pratelsky web?Radek Karban
 
Přístupnost v praxi
Přístupnost v praxiPřístupnost v praxi
Přístupnost v praxiLukas Marvan
 
WCAG 2.0 - nový pohled na přístupnost
WCAG 2.0 - nový pohled na přístupnostWCAG 2.0 - nový pohled na přístupnost
WCAG 2.0 - nový pohled na přístupnostRadek Pavlíček
 
Metodika webových auditů
Metodika webových auditůMetodika webových auditů
Metodika webových auditůH1.cz
 
Ochutnávka studie WebTop100: Srovnání kvality českých webů a dalších digitáln...
Ochutnávka studie WebTop100: Srovnání kvality českých webů a dalších digitáln...Ochutnávka studie WebTop100: Srovnání kvality českých webů a dalších digitáln...
Ochutnávka studie WebTop100: Srovnání kvality českých webů a dalších digitáln...Sherpas
 
Efektivní online prezentace
Efektivní online prezentaceEfektivní online prezentace
Efektivní online prezentaceIvo Kylián
 
Tvorba přístupných dokumentů v neziskových organizacích
Tvorba přístupných dokumentů v neziskových organizacíchTvorba přístupných dokumentů v neziskových organizacích
Tvorba přístupných dokumentů v neziskových organizacíchRadek Pavlíček
 
Linkbuilding a UX - Designéři informačních služeb na KISKu
Linkbuilding a UX - Designéři informačních služeb na KISKuLinkbuilding a UX - Designéři informačních služeb na KISKu
Linkbuilding a UX - Designéři informačních služeb na KISKuTaste Medio
 
KPI - závěrečný úkol (Modul 13)
KPI - závěrečný úkol (Modul 13)KPI - závěrečný úkol (Modul 13)
KPI - závěrečný úkol (Modul 13)Pája Kučerová
 
Jan Barbořík - Tvoříme fotografický web ve wordpressu aneb jak na funkční web?
Jan Barbořík - Tvoříme fotografický web ve wordpressu aneb jak na funkční web? Jan Barbořík - Tvoříme fotografický web ve wordpressu aneb jak na funkční web?
Jan Barbořík - Tvoříme fotografický web ve wordpressu aneb jak na funkční web? Jan Barbořík
 
SEO školení pro začátečníky
SEO školení pro začátečníkySEO školení pro začátečníky
SEO školení pro začátečníkyCollabim
 
Neřešte kraviny
Neřešte kravinyNeřešte kraviny
Neřešte kravinySherpas
 

Semelhante a Přístupnost webů knihoven - příklady dobré a špatné praxe (20)

Radek Pavlíček: Přístupný web
Radek Pavlíček: Přístupný webRadek Pavlíček: Přístupný web
Radek Pavlíček: Přístupný web
 
Přístupné weby knihoven
Přístupné weby knihovenPřístupné weby knihoven
Přístupné weby knihoven
 
Použitelnost webu
Použitelnost webuPoužitelnost webu
Použitelnost webu
 
TNPW2-2011-02
TNPW2-2011-02TNPW2-2011-02
TNPW2-2011-02
 
Jak jsou na tom parádní weby s přístupností
Jak jsou na tom parádní weby s přístupnostíJak jsou na tom parádní weby s přístupností
Jak jsou na tom parádní weby s přístupností
 
Ochutnávka studie WebTop100: Srovnání kvality českých webů, 2012
Ochutnávka studie WebTop100: Srovnání kvality českých webů, 2012Ochutnávka studie WebTop100: Srovnání kvality českých webů, 2012
Ochutnávka studie WebTop100: Srovnání kvality českých webů, 2012
 
Pouzitelnost - jak mit uspesny a pratelsky web
Pouzitelnost - jak mit uspesny a pratelsky webPouzitelnost - jak mit uspesny a pratelsky web
Pouzitelnost - jak mit uspesny a pratelsky web
 
Pouzitelnost - jak mit uspesny a pratelsky web?
Pouzitelnost - jak mit uspesny a pratelsky web?Pouzitelnost - jak mit uspesny a pratelsky web?
Pouzitelnost - jak mit uspesny a pratelsky web?
 
Přístupnost v praxi
Přístupnost v praxiPřístupnost v praxi
Přístupnost v praxi
 
WCAG 2.0 - nový pohled na přístupnost
WCAG 2.0 - nový pohled na přístupnostWCAG 2.0 - nový pohled na přístupnost
WCAG 2.0 - nový pohled na přístupnost
 
Metodika webových auditů
Metodika webových auditůMetodika webových auditů
Metodika webových auditů
 
Ochutnávka studie WebTop100: Srovnání kvality českých webů a dalších digitáln...
Ochutnávka studie WebTop100: Srovnání kvality českých webů a dalších digitáln...Ochutnávka studie WebTop100: Srovnání kvality českých webů a dalších digitáln...
Ochutnávka studie WebTop100: Srovnání kvality českých webů a dalších digitáln...
 
Efektivní online prezentace
Efektivní online prezentaceEfektivní online prezentace
Efektivní online prezentace
 
Tvorba přístupných dokumentů v neziskových organizacích
Tvorba přístupných dokumentů v neziskových organizacíchTvorba přístupných dokumentů v neziskových organizacích
Tvorba přístupných dokumentů v neziskových organizacích
 
Linkbuilding a UX - Designéři informačních služeb na KISKu
Linkbuilding a UX - Designéři informačních služeb na KISKuLinkbuilding a UX - Designéři informačních služeb na KISKu
Linkbuilding a UX - Designéři informačních služeb na KISKu
 
KPI - závěrečný úkol (Modul 13)
KPI - závěrečný úkol (Modul 13)KPI - závěrečný úkol (Modul 13)
KPI - závěrečný úkol (Modul 13)
 
KPI - závěrečný úkol
KPI - závěrečný úkolKPI - závěrečný úkol
KPI - závěrečný úkol
 
Jan Barbořík - Tvoříme fotografický web ve wordpressu aneb jak na funkční web?
Jan Barbořík - Tvoříme fotografický web ve wordpressu aneb jak na funkční web? Jan Barbořík - Tvoříme fotografický web ve wordpressu aneb jak na funkční web?
Jan Barbořík - Tvoříme fotografický web ve wordpressu aneb jak na funkční web?
 
SEO školení pro začátečníky
SEO školení pro začátečníkySEO školení pro začátečníky
SEO školení pro začátečníky
 
Neřešte kraviny
Neřešte kravinyNeřešte kraviny
Neřešte kraviny
 

Mais de Radek Pavlíček

Digitální design bez bariér
Digitální design bez bariérDigitální design bez bariér
Digitální design bez bariérRadek Pavlíček
 
Jak na přístupnost knihovních webů
Jak na přístupnost knihovních webůJak na přístupnost knihovních webů
Jak na přístupnost knihovních webůRadek Pavlíček
 
Jak a proč řeší velké weby přístupnost
Jak a proč řeší velké weby přístupnostJak a proč řeší velké weby přístupnost
Jak a proč řeší velké weby přístupnostRadek Pavlíček
 
Služby Střediska Teiresiás na konferenci INSPO 2017
Služby Střediska Teiresiás na konferenci INSPO 2017Služby Střediska Teiresiás na konferenci INSPO 2017
Služby Střediska Teiresiás na konferenci INSPO 2017Radek Pavlíček
 
Proč zavést WAG 2.0 v Česlé republice
Proč zavést WAG 2.0 v Česlé republiceProč zavést WAG 2.0 v Česlé republice
Proč zavést WAG 2.0 v Česlé republiceRadek Pavlíček
 
Hodnocení přístupnosti v soutěži Zlatý erb 2014
Hodnocení přístupnosti v soutěži Zlatý erb 2014Hodnocení přístupnosti v soutěži Zlatý erb 2014
Hodnocení přístupnosti v soutěži Zlatý erb 2014Radek Pavlíček
 
Když už Vyhláška o přístupnosti nestačí
Když už Vyhláška o přístupnosti nestačíKdyž už Vyhláška o přístupnosti nestačí
Když už Vyhláška o přístupnosti nestačíRadek Pavlíček
 
How to improve UX by implementing accessibility - WebExpo 2013 Edition
How to improve UX by implementing accessibility - WebExpo 2013 EditionHow to improve UX by implementing accessibility - WebExpo 2013 Edition
How to improve UX by implementing accessibility - WebExpo 2013 EditionRadek Pavlíček
 
Testování přístupnosti v soutěži Zlatý erb 2013
Testování přístupnosti v soutěži Zlatý erb 2013Testování přístupnosti v soutěži Zlatý erb 2013
Testování přístupnosti v soutěži Zlatý erb 2013Radek Pavlíček
 
Nahradí WCAG 2.0 Vyhlášku o přístupnosti?
Nahradí WCAG 2.0 Vyhlášku o přístupnosti?Nahradí WCAG 2.0 Vyhlášku o přístupnosti?
Nahradí WCAG 2.0 Vyhlášku o přístupnosti?Radek Pavlíček
 
How HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
How HTML5 and WAI-ARIA Can Improve Virtual Space of UniversitiesHow HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
How HTML5 and WAI-ARIA Can Improve Virtual Space of UniversitiesRadek Pavlíček
 
How to ensure accessibility of documents, published at masaryk university
How to ensure accessibility of documents, published at masaryk universityHow to ensure accessibility of documents, published at masaryk university
How to ensure accessibility of documents, published at masaryk universityRadek Pavlíček
 
How to improve UX by implementing accessibility
How to improve UX by implementing accessibilityHow to improve UX by implementing accessibility
How to improve UX by implementing accessibilityRadek Pavlíček
 
Přístupnost není charita
Přístupnost není charitaPřístupnost není charita
Přístupnost není charitaRadek Pavlíček
 
Measuring real accessibility
Measuring real accessibilityMeasuring real accessibility
Measuring real accessibilityRadek Pavlíček
 
Myslete i na přístupnost. Mobilní aplikace pro nevidomé, mDevCamp 2012
Myslete i na přístupnost. Mobilní aplikace pro nevidomé, mDevCamp 2012Myslete i na přístupnost. Mobilní aplikace pro nevidomé, mDevCamp 2012
Myslete i na přístupnost. Mobilní aplikace pro nevidomé, mDevCamp 2012Radek Pavlíček
 
Příklady dobré a špatné praxe z oblasti přístupnosti
Příklady dobré a špatné praxe z oblasti přístupnostiPříklady dobré a špatné praxe z oblasti přístupnosti
Příklady dobré a špatné praxe z oblasti přístupnostiRadek Pavlíček
 
Praktické aspekty přístupnosti
Praktické aspekty přístupnostiPraktické aspekty přístupnosti
Praktické aspekty přístupnostiRadek Pavlíček
 
Radek Pavlíček - testování přístupnosti a použitelnosti webu
Radek Pavlíček - testování přístupnosti a použitelnosti webuRadek Pavlíček - testování přístupnosti a použitelnosti webu
Radek Pavlíček - testování přístupnosti a použitelnosti webuRadek Pavlíček
 

Mais de Radek Pavlíček (20)

Digitální design bez bariér
Digitální design bez bariérDigitální design bez bariér
Digitální design bez bariér
 
Jak na přístupnost knihovních webů
Jak na přístupnost knihovních webůJak na přístupnost knihovních webů
Jak na přístupnost knihovních webů
 
Jak a proč řeší velké weby přístupnost
Jak a proč řeší velké weby přístupnostJak a proč řeší velké weby přístupnost
Jak a proč řeší velké weby přístupnost
 
Služby Střediska Teiresiás na konferenci INSPO 2017
Služby Střediska Teiresiás na konferenci INSPO 2017Služby Střediska Teiresiás na konferenci INSPO 2017
Služby Střediska Teiresiás na konferenci INSPO 2017
 
Proč zavést WAG 2.0 v Česlé republice
Proč zavést WAG 2.0 v Česlé republiceProč zavést WAG 2.0 v Česlé republice
Proč zavést WAG 2.0 v Česlé republice
 
Hodnocení přístupnosti v soutěži Zlatý erb 2014
Hodnocení přístupnosti v soutěži Zlatý erb 2014Hodnocení přístupnosti v soutěži Zlatý erb 2014
Hodnocení přístupnosti v soutěži Zlatý erb 2014
 
Když už Vyhláška o přístupnosti nestačí
Když už Vyhláška o přístupnosti nestačíKdyž už Vyhláška o přístupnosti nestačí
Když už Vyhláška o přístupnosti nestačí
 
How to improve UX by implementing accessibility - WebExpo 2013 Edition
How to improve UX by implementing accessibility - WebExpo 2013 EditionHow to improve UX by implementing accessibility - WebExpo 2013 Edition
How to improve UX by implementing accessibility - WebExpo 2013 Edition
 
Testování přístupnosti v soutěži Zlatý erb 2013
Testování přístupnosti v soutěži Zlatý erb 2013Testování přístupnosti v soutěži Zlatý erb 2013
Testování přístupnosti v soutěži Zlatý erb 2013
 
Nahradí WCAG 2.0 Vyhlášku o přístupnosti?
Nahradí WCAG 2.0 Vyhlášku o přístupnosti?Nahradí WCAG 2.0 Vyhlášku o přístupnosti?
Nahradí WCAG 2.0 Vyhlášku o přístupnosti?
 
How HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
How HTML5 and WAI-ARIA Can Improve Virtual Space of UniversitiesHow HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
How HTML5 and WAI-ARIA Can Improve Virtual Space of Universities
 
How to ensure accessibility of documents, published at masaryk university
How to ensure accessibility of documents, published at masaryk universityHow to ensure accessibility of documents, published at masaryk university
How to ensure accessibility of documents, published at masaryk university
 
How to improve UX by implementing accessibility
How to improve UX by implementing accessibilityHow to improve UX by implementing accessibility
How to improve UX by implementing accessibility
 
Přístupnost není charita
Přístupnost není charitaPřístupnost není charita
Přístupnost není charita
 
Measuring real accessibility
Measuring real accessibilityMeasuring real accessibility
Measuring real accessibility
 
Myslete i na přístupnost. Mobilní aplikace pro nevidomé, mDevCamp 2012
Myslete i na přístupnost. Mobilní aplikace pro nevidomé, mDevCamp 2012Myslete i na přístupnost. Mobilní aplikace pro nevidomé, mDevCamp 2012
Myslete i na přístupnost. Mobilní aplikace pro nevidomé, mDevCamp 2012
 
Příklady dobré a špatné praxe z oblasti přístupnosti
Příklady dobré a špatné praxe z oblasti přístupnostiPříklady dobré a špatné praxe z oblasti přístupnosti
Příklady dobré a špatné praxe z oblasti přístupnosti
 
Google and accessibility
Google and accessibilityGoogle and accessibility
Google and accessibility
 
Praktické aspekty přístupnosti
Praktické aspekty přístupnostiPraktické aspekty přístupnosti
Praktické aspekty přístupnosti
 
Radek Pavlíček - testování přístupnosti a použitelnosti webu
Radek Pavlíček - testování přístupnosti a použitelnosti webuRadek Pavlíček - testování přístupnosti a použitelnosti webu
Radek Pavlíček - testování přístupnosti a použitelnosti webu
 

Přístupnost webů knihoven - příklady dobré a špatné praxe

  • 1. Přístupnost webů knihoven – příklady dobré a špatné praxe Radek PAVLÍČEK,TyfloCentrum Brno, o. p. s., projekt Blind Friendly Web
  • 3. Líbila by se vám takto prezentovaná stránka vaší knihovny?
  • 4.
  • 5. Pokud jste na obě otázky odpověděli ne, pak si prohlížíte správnou prezentaci 
  • 6. Co je to přístupnost?
  • 7. Za přístupný web lze dnes považovat takový web, který bude návštěvník schopen  i přes své specifické potřeby,  za pomoci prostředků, které má k dispozici,  způsobem, který mu vyhovuje, efektivně používat a dosáhnout svého cíle. Lépe odpovídá současné situaci v oblasti přístupnosti (jen o málokteré stránce lze dnes prohlásit, že je naprosto nepřístupná).
  • 13. Čas
  • 14. Na přístupný web se musí být uživatel schopen dostat, musí jej být schopen ovládat, musí mu rozumět a to, proč na web přišel, musí být schopen zvládnout udělat v nějakém rozumném čase.
  • 15. Dostupnost: uživatel se k informacím musí být schopen dostat, Ovladatelnost: pokud už k nim dostane, musí je být schopen ovládat (příkladem mohou být formulářové prvky), Srozumitelnost: musí rozumět tomu, co se po něm chce, Orientace: musí být schopen se dostat tam, kam potřebuje (například na další stránku), Čas: a toto všechno musí zvládnout v rozumném čase.
  • 17. Nejen pro ty se zdravotním postižením.
  • 18.
  • 19. Záběr přístupnosti je dnes mnohem širší, než se může na první pohled zdát.
  • 20.
  • 21. Například v této bezbariérové tramvaji se lépe cestuje nejen vozíčkářům, ale třeba i maminkám s kočárky nebo těm cestujícím, kteří mají problémy s chůzi a používají například hůl nebo berle.
  • 22.
  • 23.
  • 24. V soutěži Biblioweb už řadu let testujeme weby knihoven na přístupnost. Čím je pro nás tato soutěž charakteristická?
  • 28. Do soutěže se každoročně hlásí několik desítek webů různé úrovně, které musíme v relativně krátké době (přibližně 3 týdny) otestovat. Naše testování je mixem heuristického (tzn. testování podle vybraných pravidel přístupnosti) a uživatelského testování.
  • 31. Uživatelské testování odhalí bariéry i oblastech, kde zpravidla provozovatelé webů žádný problém neočekávají. Stává se pravidlem, že na přibližně čtvrtině soutěžní webů nejsou testeři schopni najít tak zásadní informaci, jako je výše čtenářského poplatku pro daný rok.
  • 32. DRTIVÁVĚTŠINA KNIHOVEN SVÉ WEBY PO STRÁNCE PŘÍSTUPNOSTI NEVYLEPŠUJE 
  • 39.
  • 40. Ke zlepšení přístupnosti není hned třeba předělávat celý web – často i malá úprava může přístupnost webu výrazně zlepšit.
  • 42. Uživatelé chodí na webové stránky knihoven pro informace a chtějí je získat co nejrychleji. Základem reálné přístupnosti a použitelnosti pro uživatele se specifickými potřebami je tedy přehledná, konzistentní a kompaktní navigace v rámci stránky i webu.Té můžeme docílit různými způsoby. Jedním z nich je strukturování stránky pomocí nadpisů. Nadpisy slouží uživatelům jako důležité záchytné body pro orientaci a přesun na jednotlivé části stránky. Zatímco pro uživatele, kteří s webem pracují vizuálně, je potřeba nadpisy dostatečně odlišit od okolního textu na vizuální úrovni, pro uživatele screen readerů je potřeba nadpisy vyznačit i na úrovni HTML kódu a použít k tomu odpovídající HTML elementy.
  • 43. Dobře vytvořenou strukturu nadpisů si můžeme pro jednoduchost přirovnat k obsahu knihy – podobně, jako z obsahu získáme představu o názvech kapitol a můžeme se díky vazbě název kapitoly-číslo stránky rychle v knize přesunout tam, kam potřebujeme, stejnou službu udělá nevidomému uživateli dobře vytvořená struktura nadpisů. Kompletní návod, jak strukturování pomocí nadpisů udělat, najdete v článku Jak přístupně strukturovat webovou stránku pomocí nadpisů na adrese http://poslepu.blogspot.com/2010/01/jak-pristupne- strukturovat-web-pomoci.html
  • 44.
  • 45.
  • 46. Pokud na webu žádné nadpisy na úrovní kódu vyznačeny nejsou, uživatel screen readeru nemá prakticky žádnou možnost, jak se s obsahem webu efektivně seznámit a rychle se přesouvat na ty části stránky, které jej zajímají.
  • 47.
  • 48.
  • 49. Pochopení struktury stránky pomáhá i vhodná hierarchie nadpisů.V případě, kdy jsou všechny nadpisy vyznačeny jako nadpisy třetí úrovně, nemá uživatel šanci poznat, který z nadpisů má vyšší prioritu (a zde ani třeba to, na kterém webu se nachází).
  • 50. Následující dva příklady ukazují vhodné řešení strukturování obsahu stránky pomocí nadpisů.
  • 51.
  • 52.
  • 53.
  • 54.
  • 56. Ovladatelnost webu z klávesnice je z hlediska přístupnosti neméně důležitá. Uživatel musí mít možnost se na všechny prvky na stránce, které mohou získat focus (odkazy, formulářové prvky), dostat z klávesnice a také musí mít možnost prvek z klávesnice aktivovat. Pokud ovladatelnost webu z klávesnice není možná, může mít problém se získáváním informací z webu celá řada návštěvníků - nejen nevidomí, ale třeba uživatelé s motorickým postižením horních končetin či ti, kteří nemohou z nějakého důvodu použít myš.
  • 57.
  • 58.
  • 59.
  • 60.
  • 62. Grafické prvky jsou dnes důležitou součástí každého webu. Často je pomocí nich vytvořeno menu či jsou pomocí grafiky prezentovány jiné důležité informace. Proto je potřeba, abychom se při jejich používání vyvarovali chyb, které by mohly zamezit získání takto publikovaných informací uživatelům, kteří nejsou schopni vizuálně vnímat grafické prvky. Jednoduchá rada proto zní - veškeré grafické prvky na stránkách, které nesou informaci, musí mít definovánu relevantní textovou alternativu.
  • 63.
  • 64.
  • 66. Tématika správného zpřístupnění formulářů by vydala na samostatnou prezentaci, proto se omezím jen na tři nejdůležitější informace. Každý formulářový prvek musí mít na úrovni kódu přiřazen svůj popisek, z nějž musí být zřejmé, o jaký prvek se jedná a co se při interakci s ním od uživatele očekává. Formulářové prvky také musí být bez obtíží přístupné a ovladatelné z klávesnice a v neposlední řadě musí být uživatelé v případě chybových stavů o nich informováni přístupnou formou.
  • 67.
  • 68.
  • 70. Jednou z vhodných cest, jak vytvořit přístupný web, může být responzivní design. Responzivní znamená, že se vzhled stránek bude přizpůsobovat zařízení, na kterém budou zobrazeny a uživateli se tak budou lépe ovládat na mobilním telefonu či tabletu. U neresponzivních webů bývá na mobilních zařízeních často problém s velikostí písma, které je ve výchozí podobě příliš malé; problém také bývá trefit prstem malé aktivní prvky webu, jako například odkazy nebo formulářové prvky; uživatel bývá zahlcen množstvím informací, atp.
  • 71. Obecně samozřejmě automaticky neplatí, že responsivní = přístupný, ale například Mobile first přístup zajistí minimálně to, že se autor webu zamyslí nad prioritou informací a web nebude přehlcen vším možným. Protože právě orientace ve velkém množství informací a efektivní a rychlý přístup k tomu, co uživatelé na webu potřebují a hledají, je dnes z hlediska přístupnosti naprosto klíčový.
  • 72.
  • 73.
  • 74.
  • 75.
  • 76.
  • 78.
  • 79.
  • 80.
  • 81.
  • 83. Přístupnost jako součást zadávací dokumentace
  • 84. Přístupnost jako nedílná součást vývoje webu
  • 85. Vyberte si dodavatele, který přístupnost „umí“
  • 87. Testujte přístupnost (nebo si ji nechte otestovat)
  • 88. JDETO! Radek PAVLÍČEK pavlicek@blindfriendly.cz Pokud se vám prezentace líbila, podívejte se na ni „naživo“ na https://youtu.be/iFTH8X5Qpq4.