ABCDEFGHIJKLMNOPQRSTUVWXYZ
1
Jména členů skupinyTestovaný webVnímatelnostOvladatelnostSrozumitelnostRobustnost
2
Jak postupovat při testování:Kontrast textu a pozadíNetextové informaceOvěření vhodnosti zástupných textů odkazůMožnost zvětšování textuČitelnost textuSémantická struktura (nadpisy, seznamy aj..)Konzistence webu a informacíVložené dokumentyOvladatelnost bez myši, navigace, pohyb po stránce, orientaceOvladatelnost akcí (zastavení, spuštění)Dohledatelnost důležitých informacíSrozumitelnost formulacíSrozumitelná navigace a strukturaVhodný výběr obrázkůSnadno dohledatelné důležité informaceZobrazení na mobilním zařízení
3
Zapisování výsledů testování:
Do tabulky napište ke každé testované oblasti své hodnocení. Pokud jste narazila na nějaké problémy, pokud se vám nedařilo, něco nefungovalo apod., uveďte to do tabulky.
Pomocí doplňku prohlížeče Chrome Color Contrast Analyzer zkontrolujte, jestli je na stránkách dostatečný kontrast textu a pozadí. Proveďte test vstupní stránky webu a ještě jedné Vámi zvolené stránky. Je kontrast dostatečný? Liší se vhodnost kontrastu nadpisů a běžného textu? Jsou na webu obrázky na pozadí, které znesnadňují čtení textu?
Nápověda k nástroji Color contrast analyzer: https://docs.google.com/document/d/1YDzAN-1eS2DYFQ3MMuEd71Aht9lFt5AgkZhwK7DngQM/edit?usp=sharing
Otevřete si v prohlížeči hlavní stránku webu organizace a poté v prohlížeči Chrome použijte doplněk Web developer (klikněte na ikonu ozubeného kolečka v prohlížeči vpravo nahoře, která jej zastupuje).
V nabídce Web developeru na záložce Images zvolte možnost Hide Images. Po skrytí obrázků zjistěte, zda jsou v textové podobě dostupné všechny informace, které jsou k dispozici při běžném zobrazení stránky.
V dalším kroku zkontrolujte, jestli mají obrázky vhodné zástupné texty pomocí možnosti Display Alt Attributes – můžete si také pomoci položkou Outline Images without Alt Attributes, která zvýrazní obrázky bez alternativního textu.
Nápověda k rozšíření Web Developer https://docs.google.com/document/d/1e2bKOVgfxNEZZhezWjIiOe_nTs5F4-Z6zLIYCZJQaJE/edit?usp=sharing
Na další kartě prohlížeče si otevřete několik libovolných dalších stránek webu, např. stránku s aktualitami, informacemi o službách nebo o akcích. Nejprve na jedné a poté na druhé stránce najděte všechny odkazy (ať již směřují a jinou stránku stejného webu nebo ven). Představte si, že máte k dispozici pouze zástupné texty odkazů bez okolního textu, a zhodnoťte, zda jsou srozumitelné i bez kontextu, nevyskytují se v nich výrazy typu "klikněte zde" apod.Na hlavní stránce případně na jiné stránce, kde jsou obrázky, zvětšete velikost zobrazení pomocí zvětšovacího nástroje prohlížeče. To je možné pomocí klávesové zkratky sestávající z kláves "CTRL" se zároveň stisknutou klávesou "+" ("Ctrl" + "+"), případně mínus pro zmenšení ("Ctrl" + "-"). Do běžné velikosti se vrátíte kombinací kláves "STRL" + "0". Alternativně můžete použít nabídku prohlížeče Chrome (klikněte na tři tečky pod sebou v pravém horním rohu prohlížeče a z nabídky vyberte položku Lupa. Zkontrolujte, zda při zvětšení jsou čitelné ty obrázky, které vyjadřují nějaký významový text (pokud na webu takové obrázky jsou), zda je možné číst veškerý text (například zda text nepřeteče za nedosažitelný okraj stránky), zda obrázky nebo jiné prvky stránky nezakrývají text nebo ovládací prvky (navigaci, tlačítka pro odeslání formuláře apod.), nebo zda nemáte jiné problémy, které jsou způsobené zvětšením zobrazení.Podívejte se, zda se vám text na webu dobře čte. Jsou písmena dostatečně velká, nejsou příliš tenká nebo úzká, nepoužívá stránka font, který ztěžuje čtení?. Je mezi řádky a odstavci dostatečná mezera pro pohodlné čtení?Je na webu správně použita sémantická struktura? Použijte nástroj HeadinsMap ke kontrole struktury a hierarchie nadpisů. Zkontrolujte také, zda informace na webu, které vyjadřují nějaký výčet, jsou uvedeny formou seznamuJsou webové stránky konzistenční? Např. je navigace nebo další prvky stránky, používány stejtě (jsou na svém místě, mají konzistentní vzhled)? Používá web pro stejnou věc na různých dílčích stránkách webu stejné termíny?Jsou dokumenty, které jsou na we vložené formou odkazu, vnímatelné jako text (tj. nejsou vložené pouze formou obrázku)? Textovou podobu můžete rychle zkontrolovat tak, že zkusíte text zkopírovat. V případě, že zkopírovat nejde (a je možné udělat pouze snímek vybrané části dokumentu), dokument není přístupný.Zadejte do webového prohlížeče adresu hlavní stránky webu organizace a poté se po stránce pohybujte pouze pomocí klávesnice (informace k ovládání klávesnice najdete níže). Při pohybu po stránce zhodnoťte, zda se pouze pomocí klávesnice dostanete na všechny ovládací prvky stránky (menu, odkazy, tlačítka, pole formulářů) a můžete spustit požadovanou akci (otevření nové stránky nebo dokumentu, zahájení vyhledávání, odeslání formuláře apod.), zda jste schopni (opět pouze pomocí klávesnice) dostat se zpět na ovládací prvky na začátku stránky, zda je při ovládání z klávesnice možné přeskočit navigaci (menu) a skočit rovnou na první odkaz v hlavním obsahu stránky. Zhodnoťte, zda dostatečně zřetelně vidíte, na kterém odkazu na stránce se právě nacházíte (adresy odkazů, na kterých se právě nacházíte, byste zároveň měli vidět v levé dolní části prohlížeče).
Pohyb pomocí klávesnice:
- Klávesou tab přesunete kurzor na další odkaz nebo aktivní prvek,
- pomocí zkratky shift + tab se vrátíte na předchozí aktivní prvek,
- pomocí klávesy enter potvrzujete akce a otevíráte odkazy,
- pomocí šipek se posunujete na stránce nahoru a dolů, mezerník umožňuje výběr možností ve formulářích.
Zkontrolujte, zda na webu nehraje hudba na pozadí nebo video, které nemůžete vypnout. Ověrte, že všechny akce a pohyby nebo změny na stránce, které se automaticky spustily při zobrazení stránky, můžete zastvit/vypnoutOtevřete si vstupní stránku webu a pomocí informací a odkazů na stránce se pokuste najít tyto informace: O jakou organizaci jde a jaké služby nabízí, jaká je její cílová skupina. Je možné danou organizaci navštívit? Jak se k ní dostanete, jaká je provozní doba? Můžete zkusit najít i jiné informace, které Vám pro danou organizaci připadají důležitéJsou na webu používaná srozumitelné výrazy a srozumitelné formulace? Jsou zde používány všeobecně známé termíny? Pokud ne, jsou termíny na webu vysvětleny? Nejsou na webu použity nesrozumitelné zkratky?Mají stránky srozumitelnou strukturu a navigaci? Jsou jednotlivé prvky stránky (navigace, hlavní obsah, rychlé odkazy, vyhledávání na stránkách, přepínač jazyků apod. tam, kde byste je hledali? Je hlavní navigace logicky uspořádaná? Zkuste projít jednotlivé položky hlavní navigace a podívat se na vnořené položky. Myslíte se, že zařazení vnořených položek k dané položce hlavní navigace dává smysl? Jsou pro hlavní nebo dílčí navigaci použitý výstižné termíny či formulace? Je na webu možné vyhledávat? Dá se vyhledávací pole snadno najít?Jsou ilustrační obrázky vhodně zvoleny? Mají jednotný styl? Je na první pohled patrné, co představují?Otevřete si vstupní stránku webu a pomocí informací a odkazů na stránce se pokuste najít tyto informace: O jakou organizaci jde a jaké služby nabízí, jaká je její cílová skupina. Je možné danou organizaci navštívit? Jak se k ní dostanete, jaká je provozní doba? Můžete zkusit najít i jiné informace, které Vám pro danou organizaci připadají důležitéJe stránka přizpůsobená mobilům? Musíte při práci s webem horizontálně posouvat zobrazení z prava doleva nebo je stránka přizpůsobená zobrazení na mobllním zařízení. Jste schopní dostat se ke všem položkám menu i na mobilním telefonu? Jsou i na mobilním telefonu dohledatelné všechny důležité informace?
4
https://meta-ops.eu/
5
https://www.pov.cz/
6
Pospíšilová N. http://www.ddszlutice.cz/kronika-zarizeni/Kontrast je zcela nedostatečný, obrázek není vhodnýInformace jsou dostupné v textové podobě. Obrázky jsou vhodné Přijdou mi srozumitelné, ale když chci vidět např. jídelníček musím znovu kliknout na další ikonu Velký text a obrázky jsou vidět v pořádku, ale když zvětším stránku musím si hlavní ikony na další stránky rozkliknout třemi čárami Všude by mohl být jednotný font písmen. Nevhodné mi přijde PF 2022. Malá písmena, úzká písmena. Uvedeno formou seznamu. Web je konzistenční na každé stránce např. jídelníček je vložen v PDFNa všechny prvky se dá dostat pomocí klávesnice, ale velmi špatná viditělnost, kde si zrovna šlověk nacházíHudba žádná nehraje. Na první stránce je video kde jsou obrázky, ale ty se zastaví Ano, všechny informace se dají najít. Vše je srozumitelné Vyhledávání možné není, ale jinak mi přijdou strány přehledné ano, obrázky jsou vhodně zvolenéano Stránka je přizpůsobena mobilům, důležité informace jsou vidět.
7
Frýdková Horákováhttps://www.salesianiteplice.cz/I přes vložený obrázek je text dobře čitelnýVšechny informace jsiu dostupné v textové podobě stejně jako při běžném zobrazení. Obrázky mají vhodné zástupné texty.Poud si rozkliknu leták obchodu tak se mi ukazují pouze formy obrázků bez textu. Například Kaufland, Lidl. Při úplném zvětšení i zmenšení vše dobře čitelné.Písmena jsou dostatečně veliká, dobře se vše přečte. Barva písmen je černá ale některé mají sklon do šeda a je to horší při čtení. Mezi řádky a odstavci je dostatečná mezera. Stránka nepoužívá fond.
8
Ivana K., Jana H. Denisa J., Kateřina V.,https://jahoda.cz/na hlavní straně špatně kontrastní položy meny na barevných obrázcích, a tlačítko přijímám vše. Také okno vyhledávání není moc vidětna hlavní straně nejsou vidět partneři a novinky školy a všechny kromě jednoho obrázku mají vhodné zástupné textyU záložky AKCE, nejsou uvedeny všechny informace, co jsou na obrázku podZvětšení textu je bez problému. Obrázky nic nepřekrývajíweb se čte dobře, font správný, v menu malé písmo, v názvu Jahody není text, mezery jsou dostatečnéStruktura nevyhovující.celkem vždy nahoře zůstává stejné menu, pouze u položky Akce/Festivaly se otvírá nové oknoDokumenty vložené formou odkazu na stránce jsou vnímatelné jako text, dokument je přístupný.v hlavním menu je potřeba některé položky proklikat, což by nevadilo - není jich moc, ale problém je spíš v tom, že nevidím, že je proklikávám, není vůbec vidět, kde zrovna tabulatorem jsemNa webu nehraje hudba ani video.důležité informace se mi zdají srozumitelnéAno jsou
Stránky mají srozumitelnou strukturu. Stránka je dělaná tak jak bych očekávala. Hlavní navigace mi přijde logicky uspořádána. Na zbytek otázek odpovídám ano. Na webu je možné vyhledávat. Vyhledávací pole se dá snadno najít.
Ilustrační obrázky jsou vhodně zvoleny. Jednotný styl nemají. Je patrné, co představují
Jahoda je nezisková organizace.Jahoda má nízkoprahové kluby a terénní program. Dálé má školky a jesle a komunitní rodinná centra. Jejich cílová skupina jsou děti a mládež. Organizaci je možné navštívit. K místům, kde organizace sídlí se dá dostat hromadnou dopravou. Provozní dobu se liší.
Stránka je přizpůsobena mobilům. Posouvá se dolů a nahoru. Je možnost se dostat úplně všude
9
Karolina š. a Rosalie v. 5https://www.zszahradka.cz/obrázky stránky jsou v pořádku, písmo je špatně zvoleno. Kontrast pozadí je v porádku, velké napisy textu jsou v porádku, ale menší u kapitol jsou nečitelné.človek zde na stránce zjistí vše potřebné.v textu Akcí se vyskytují hodne výrazy ,,foto zde,, celková srozumitelnost webu je v pořádku.i pri zvetsení se nadpisy v obrázcích dají precíst. nekteré casti stránky mají spatne zvolený font a malé písmo. v nekterých kapitolách je kurzíva která se spatne cte. vse je usporadano stejne i bez pouzití nastroje headinsMap. seznam je citelný a srozumitelný.Stránka je vhodná pro mobily. Nemusí se přejíždět z leva do prava ale je to na celé obrazovce. Všechny důležité informace jsou dohledatelné i na mobilním telefonu.
10
Kateřina Š., Barča B.https://www.iespraha.cz/Na hlavní straně je vše vpořádku kromě jedné kolonky (mám tájem). Na straně pro uchazeče je špatně znatelná kolonka domů/zpětPři tomto kroku jsme dospěly k závěru, že je vše v pořádku.Dle našeho názoru je vše v pořádku. Odkazy byly srozumitelné a správně popsanéPo přiblížení zmizí hlavní menu, ale objeví se v pravém horním rohu kolonka s nabídkou hlavního menuShodly jsme se, že písmo v hlavní nabídce je za nás velmi tenké a málo výrazné. Vše je uspořádáno systematicky a srozumitelně.Na webu je každá záložka uspořádána stejně.Odkazy jsou vnímatelné jako text.Pouze za pomoci klávesnice se lze po stránce pohybovat bez problému.Na webu video ani hudba není.Na webu jsou použity srozumitelné výrazy.Ano mají.Ano, obrázky jsou v pořádku.
11
Monika B, Ondřej, Gabrielahttps://skolapraha.diakonie.cz/malá část textu v dobrém kontrastu, ale většina v horším či úplně nedostatečném; některé obrázky jsou ve špatném kontrastu s textem (bílý text na světlém pozadí); nadpisy jsou v dobrém kontrastu;V textové podobě jsou nahrezeny všechny obrázky, až na samostatné logo DiakonieTexty jsou srozumitelné a nevyskytují se zde výrazy typu "klikněte zde"Po zvětšení jsou dobře čitelné obrázky, text nepřetéká mimo okraje stránky, celkově je to bez problémůText je velmi dobře čitelný, na mne oůsobí možná až moc velce. Font je zvolený jednoduše.Struktura je vyhovující.Ano, stránky se zdají konzistenční a přehledné.Dokumenty vložené formou odkazu na stránce jsou vnímatelné jako textZřetelně vidím, kde se na stránce nacházím pomocí tab. I klávesnice enter funguje - potvrzuji akci.Na webu nehraje hudba na pozadí, obsahující videa si návštěvník musí sám pustit i stopnout.Organizace Diakonie poskytuje základní vzdělávání dětem a mládeži s mentálním postižením, více vadami a autismem do 26 let. Má k dispozici 3 pracoviště (Praha 4,5,10). Jestli lze konkrétní pracoviště navštívit zde není uvedeno, jsou zde však kontakty na pracoviště i s adresami. Provozní doba se liší podle pracoviště.Ano jsou. Nejsou použity nesrozumitlené zkratky.Stránk jsou srozumitelné. Přepínač jazyků nenalezen. Vyhledávací pole - musí si kliknout na ikonu lupa, je na pravé straně.Stránka je přizpůsobena mobilům. Nemusí se posouvat zprava doleva, stačí jen nahoru a dolů. V mobilní verzi jsme schopni dostat ke všm položkám menu. Informace jsou dohledatelné.
12
Ilustrační obrázky jsou vhodně zvoleny. Jednotný styl nemají. Je patrné, co představují
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100