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

88
Přístupnost webů knihoven – příklady dobré a špatné praxe Radek PAVLÍČEK, TyfloCentrum Brno, o. p. s., projekt Blind Friendly Web

Upload: radek-pavlicek

Post on 02-Aug-2015

523 views

Category:

Internet


0 download

TRANSCRIPT

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

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

Radek PAVLÍČEK, TyfloCentrum Brno, o. p. s., projekt Blind Friendly Web

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

Máte rádi CAPTCHA?

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

Líbila by se vám takto

prezentovaná stránka

vaší knihovny?

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

Pokud jste na obě

otázky odpověděli ne,

pak si prohlížíte

správnou prezentaci

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

Co je to přístupnost?

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

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á).

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

PĚT PILÍŘŮ

PŘÍSTUPNOSTI

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

Dostupnost

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

Ovladatelnost

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

Srozumitelnost

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

Orientace

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

Čas

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

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.

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

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.

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

PŘÍSTUPNOST JE

DŮLEŽITÁ PRO

UŽIVATELE

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

Nejen pro ty se

zdravotním

postižením.

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

Záběr přístupnosti je

dnes mnohem širší,

než se může na první

pohled zdát.

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

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.

Page 22: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 23: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 24: Přístupnost webů knihoven - příklady dobré a špatné praxe

V soutěži Biblioweb už řadu let testujeme weby knihoven na přístupnost.

Čím je pro nás tato soutěž charakteristická?

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

Hodně webů

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

Málo času

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

Weby různé úrovně

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

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í.

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

Uživatelské testování

Heuristické testování

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

Nalezeno

Nenalezeno

Poplatek

Nalezeno

Nenalezeno

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

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.

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

DRTIVÁ VĚTŠINA

KNIHOVEN SVÉ WEBY PO

STRÁNCE PŘÍSTUPNOSTI

NEVYLEPŠUJE

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

DŮVODY

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

CHYBĚJÍCÍ

ODBORNÉ

ZNALOSTI

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

FINANCE

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

CORPORATE IDENTITY,

MANAŽERSKÉ

ROZHODNUTÍ

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

NEZÁJEM

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

JINÝ POHLED NA VĚC

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

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.

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

STRUKTUROVÁNÍ

OBSAHU

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

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.

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

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

Page 44: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 45: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 46: Přístupnost webů knihoven - příklady dobré a špatné praxe

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í.

Page 47: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 48: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 49: Přístupnost webů knihoven - příklady dobré a špatné praxe

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í).

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

Následující dva příklady ukazují vhodné řešení strukturování obsahu stránky pomocí nadpisů.

Page 51: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 52: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 53: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 54: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 55: Přístupnost webů knihoven - příklady dobré a špatné praxe

OVLADATELNOST

Z KLÁVESNICE

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

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š.

Page 57: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 58: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 59: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 60: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 61: Přístupnost webů knihoven - příklady dobré a špatné praxe

TEXTOVÉ ALTERNATIVY

GRAFICKÝCH PRVKŮ

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

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.

Page 63: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 64: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 65: Přístupnost webů knihoven - příklady dobré a špatné praxe

FORMULÁŘE

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

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.

Page 67: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 68: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 69: Přístupnost webů knihoven - příklady dobré a špatné praxe

RESPONZIVNÍ/MOBILNÍ

VERZE WEBU

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

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.

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

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ý.

Page 72: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 73: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 74: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 75: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 76: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 77: Přístupnost webů knihoven - příklady dobré a špatné praxe

KDE ZÍSKAT

POTŘEBNÉ

ZNALOSTI

Page 78: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 79: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 80: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 81: Přístupnost webů knihoven - příklady dobré a špatné praxe
Page 82: Přístupnost webů knihoven - příklady dobré a špatné praxe

DOPORUČENÍ NA

ZÁVĚR

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

Přístupnost jako součást zadávací

dokumentace

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

Přístupnost jako nedílná součást

vývoje webu

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

Vyberte si dodavatele, který

přístupnost „umí“

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

Pohlídejte si přístupnost

uživatelsky vkládaného obsahu

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

Testujte přístupnost

(nebo si ji nechte otestovat)

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

JDE TO! Radek PAVLÍČEK

[email protected]

Pokud se vám prezentace líbila, podívejte se na ni „naživo“ na

https://youtu.be/iFTH8X5Qpq4.