Testování online nástrojů pro tvorbu internetových stránek

ČESKÉ VYSOKÉ UČENÍ TECHNICKÉ V PRAZE FAKULTA ELEKTROTECHNICKÁ Katedra počítačové grafiky a interakce

František Bauma

Testování online nástrojů pro tvorbu internetových stránek Bakalářská práce

Praha 2013

Autor práce: František Bauma Vedoucí práce: Ing. Ondřej Poláček

Rok obhajoby: 2013

Bibliografický záznam BAUMA, František. Testování online nástrojů pro tvorbu internetových stránek. Praha, 2013. 101 s. Bakalářská práce (Bc.) České vysoké učení technické v Praze, Fakulta elektrotechnická. Katedra počítačové grafiky a interakce. Vedoucí diplomové práce Ing. Ondřej Poláček.

Abstrakt Bakalářská práce „Testování online nástrojů pro tvorbu internetových stránek“ se zabývá testováním vybraných služeb umožňujících vytvoření stránek lidem, kteří neovládají pokročilé webové technologie. Autor práci rozdělil do dvou základních bloků. V prvním bloku se věnuje použitelnosti (usability) daných služeb. Nejprve nástroje otestoval během expertní analýzy, a následně na jejím základě utvořil testy použitelnosti pro testování s uživateli. Na závěr bloku autor porovnává výsledky expertní analýzy a testování s uživatelem. V druhém bloku se u služeb zaměřuje na jejich přístupnost (accessibility), a také na přístupnost stránek pomocí těchto nástrojů vytvořených. I testování přístupnosti bylo prováděno jak expertní analýzou, tak testy s uživatelem a závěrem jsou výsledky porovnány. Závěrečná část se zaměřuje na vyhodnocení celého testování. Srovnává jednotlivé služby na základě výsledků testování použitelnosti a přístupnosti.

Abstract The bachelor thesis „Testing of online tools for composition of web pages“ is aimed at testing the selected services which enable people to create websites even if they do not possess the knowledge of advanced web technologies. Author divided the thesis into two main blocks. The first block is focused at the usability of said services. First, the author tested the tools during an expert analysis and on its basis created tests of usability for userinvolved testing. At the end of this block author compares the results of the expert analysis and the results of the user-involved testing. The second block is aimed at the accessibility of services and the accessibility of the web pages created with these tools. The accessibility testing was also performed by both expert analysis and user-involved testing. The results are compared in the last part of the block. The final part of the thesis is focused on evaluation of the entire testing. It compares individual services based on the results of accessibility and usability testing.

Klíčová slova Internetové

stránky,

použitelnost,

přístupnost,

byznysweb.cz,

eshoprychle.cz,

webgarden.cz, webmium.com, webnode.cz

Keywords

Web pages, usability, accessibility, byznysweb.cz, eshoprychle.cz, webgarden.cz, webmium.com, webnode.cz

Rozsah práce: 94 022 znaků s mezerami

Prohlášení Prohlašuji, že jsem předkládanou práci zpracoval samostatně a použil jen uvedené prameny a literaturu. Nemám závažný důvod proti užití tohoto školního díla ve smyslu §60 Zákona č. 121/2000 Sb., o právu autorském, o právech souvisejících s právem autorským a o změně některých zákonů (autorský zákon).

V Praze dne 23. 5. 2013

František Bauma

Poděkování Na tomto místě bych rád poděkoval v první řadě vedoucímu práce Ing. Ondřeji Poláčkovi za pečlivý a vstřícný přístup. Dále také Ing. Janu Balatovi za pomoc se sháněním zrakově postižených účastníků testu, Michalu Radovi za uvedení do problematiky zrakově postižených, PhDr. Anně Batistové za jazykové korektury, stejně tak všem, kteří se testování zúčastnili. Poděkování patří taktéž mé rodině a přítelkyni za velkou podporu.

Obsah 1

2

Úvod.......................................................................................................................... 3 1.1

Stanovení cílů ..................................................................................................... 4

1.2

Organizace dokumentu....................................................................................... 4

Existující služby........................................................................................................ 6 2.1

3

4

5

Vybrané služby................................................................................................... 6

Související práce ....................................................................................................... 9 3.1

Práce z oboru použitelnosti ................................................................................ 9

3.2

Práce z oboru přístupnosti .................................................................................. 9

Použitelnost ............................................................................................................. 11 4.1

Expertní analýza ............................................................................................... 11

4.2

Testování s uživatelem ..................................................................................... 18

4.3

Vyhodnocení použitelnosti............................................................................... 31

Přístupnost .............................................................................................................. 33 5.1

Expertní analýza ............................................................................................... 33

5.2

Testy s uživatelem ............................................................................................ 42

5.3

Vyhodnocení přístupnosti ................................................................................ 51

6

Diskuze ................................................................................................................... 53

7

Závěr ....................................................................................................................... 55 7.1

Další pokračování práce ................................................................................... 55

8

Literatura ................................................................................................................. 57

9

Seznam příloh ......................................................................................................... 59

10 Přílohy..................................................................................................................... 61 10.1

Příloha č. 1: Heuristika podle Jakoba Nielsena (1995) ................................ 61

10.2

Příloha č. 2: Předloha stránky pro expertní analýzu - použitelnost .............. 63

10.3

Příloha č. 3: Screener - použitelnost ............................................................. 64

10.4

Příloha č. 4: Pre-test dotazník - použitelnost ................................................ 65

10.5

Příloha č. 5: Zadání testu s uživatelem pro byznysweb.cz - použitelnost .... 66

10.6

Příloha č. 6: Zadání testu s uživatelem pro eshoprychle.cz - použitelnost ... 68

10.7

Příloha č. 7: Zadání testu s uživatelem pro webgarden.cz - použitelnost..... 70

10.8

Příloha č. 8: Zadání testu s uživatelem pro webmium.com - použitelnost ... 72

10.9

Příloha č. 9: Zadání testu s uživatelem pro webnode.cz - použitelnost ........ 74

10.10

Příloha č. 10: Post dotazník - použitelnost ................................................... 76 1

10.11

Příloha č. 11 Tabulky vyhodnocení post dotazníku – použitelnost .............. 77

10.12

Příloha č. 12: Pre-test dotazník - přístupnost ................................................ 80

10.13

Příloha č. 13: Zadání testu s uživatelem pro eshoprychle.cz – přístupnost .. 82

10.14

Příloha č. 14: Zadání testu s uživatelem pro webgarden.cz – přístupnost .... 83

10.15

Příloha č. 15: Zadání testu pro vytvořené webové stránky ........................... 84

10.16

Příloha č. 16: Post dotazník – přístupnost ..................................................... 85

11 Seznam použitých zkratek ....................................................................................... 87 12 Obsah přiloženého CD ............................................................................................ 89

2

1 Úvod Internet existuje sice již dlouhou dobu, ale jeho popularita neklesá. Naopak jeho používání roste závratnou rychlostí. Většina lidí se shromažďuje na různých sociálních sítích, ať už je to facebook, google+, nebo třeba twitter. Ty jim umožňují sdílení spousty digitálního obsahu - od poznámek, přes obrázky až po videa. Nejsou však zdaleka všemocné a mají spoustu nedostatků, kvůli kterým možná nikdy nedokážou plně nahradit klasické webové stránky. Pokud někdo potřebuje založit eshop, chce publikovat své články, nebo mít přehledně uspořádané všechny informace, se sociálními sítěmi si v současné době nevystačí. Cena webových stránek na zakázku dnes sice stále klesá kvůli zvyšující se nabídce, i přesto však existují osoby, případně menší firmy, které nejsou ochotny za takové služby platit. V takovém případě mohou zvolit jeden z mnoha online nástrojů, které nabízejí tvorbu internetových stránek i naprostým laikům v oblasti webových technologií. Ty povětšinou slibují, že jejich ovládání je snadné a zvládne ho běžný uživatel internetu, a také že jejich uživatel dokáže sám vytvořit plnohodnotné stránky.

3

1.1 Stanovení cílů Práce „Testování online nástrojů pro tvorbu internetových stránek“ si v první části klade za cíl otestovat použitelnost (usability) zmíněných služeb a také zhodnotit jejich funkcionalitu. Ve druhé části se zaměřuje na přístupnost (accessibility) daných služeb a také stránek pomocí těchto služeb vytvořených.

Seznam cílů: 

Identifikace vhodných služeb.



Testování použitelnosti jejich administračních rozhraní.



Testování přístupnosti jejich administračních rozhraní.



Testování přístupnosti vytvořených stránek.



Diskuze výsledků.

1.2 Organizace dokumentu První kapitola je úvodní, popisuje problematiku tvorby webových stránek pomocí online nástrojů a vymezuje cíle práce. Ve druhé kapitole jsou vyjmenovány dostupné služby a na závěr je vybráno pět služeb, které budou v práci dále testovány. Třetí kapitola se zaměřuje na související práce z oblasti testování webových stránek. Stručně seznamuje s jejich obsahem. Čtvrtá kapitola se zaměřuje na testování použitelnosti administračních rozhraní jednotlivých služeb. Testovány jsou nejprve expertní analýzou a následně testy s uživatelem. Závěr kapitoly shrnuje výsledky testování použitelnosti. V páté kapitole jsou nástroje testovány z hlediska použitelnosti. Nejprve jsou expertní analýzou testovány administrační rozhraní a následně webové stránky vytvořené pomocí testovaných nástrojů. Na základě expertní analýzy jsou administrační rozhraní a webové stránky testovány s hendikepovanými uživateli. Závěrem jsou výsledky testování porovnány. 4

Šestá kapitola shrnuje celé testování. Porovnává jednotlivé služby na základě testování použitelnosti a přístupnosti. Zmiňuje silné a slabé stránky každé ze služeb. Sedmá kapitola celou práci uzavírá a vyhodnocuje splnění stanovených cílů. Navrhuje také možnosti, jak na práci navázat v budoucnu.

5

2 Existující služby Přesná definice služeb, kterými se tato práce zabývá, neexistuje. Jediná možnost je tedy vycházet z názvu práce – „online nástroje pro tvorbu webových stránek“. Určit, který nástroj toto zadání ještě splňuje, a který už ne, je velice obtížné a pomyslná hranice je velmi tenká. Například časopis Computer se v čísle 7/13 zabývá v článku „Web na pár kliknutí“

podobným

tématem,

a

zmiňuje

služby

webnode.cz,

estranky.cz

a webgarden.cz.1 Jen na českém trhu se nachází velké množství takových služeb2, celosvětově je číslo pochopitelně mnohonásobě vyšší.

2.1 Vybrané služby Mezi pěti vybranými službami jsou abecedně byznysweb.cz, eshoprychle.cz, webgarden.cz, webmium.com a webnode.cz. Byly zvoleny z toho důvodu, že s nimi měl již autor bakalářské práce zkušenosti, a zajímalo ho, jak v testech použitelnosti a přístupnosti obstojí. Druhým důvodem byl fakt, že je buď provozují české firmy, nebo mají alespoň českou lokalizaci.

Byznysweb.cz V roce 2003 byla založena společnost IRISOFT SYSTEMS, s.r.o., která byznysweb.cz provozuje. Byznysweb.cz je spuštěn na redakčním systému FLOX, který je zmíněnou společností vyvíjen. „Redakční systém Flox Vám pomůže vytvořit přehledné, jednoduché a rychlé webové stránky s profesionální grafikou. Svůj web si můžete vytvořit doslova sami, kliknutím na

M. Kašpárek: Web na pár kliknutí. Computer.7/13. 11. dubna 2013. Kecy k věci.cz: Od koho pronajmout eshop [online]. [cit. 2013-05-18]. Dostupné z: http://kecykveci.cz/odkoho-pronajmout-e-shop/ 1

2

6

tlačítko „Vytvořit web stránku“, nebo to můžete nechat na nás. Vytvoříme Vám unikátní grafický design, naprogramujeme funkce na míru, stránky umístíme na internet.“ 3

Eshoprychle.cz Eshoprychle.cz je provozován firmou BOHEMIASOFT s.r.o., která byla založena v roce 2008. Momentálně je systém webareal a eshop-rychle provozován v 8 jazykových mutacích, v 7 evropských zemích a počet zákazníků se blíží 11 000. „Před vznikem firmy Bohemiasoft s.r.o. jsme fungovali jako fyzické osoby a několik let jsme se živili tvorbou web stránek a eshopů na zakázku. A protože tehdy byl velký „hlad“ po levném řešení na tvorbu eshopů, rozhodli jsme se vytvořit jednoduché řešení, které by bylo dostupné každému. “4

Webgarden.cz Webgarden.cz byl spuštěn 9. 1. 2006. Přibližně každé dva roky byla spuštěna nová verze. Služba postupně expandovala do dalších zemí. „Z počátku jsme službu koncipovali jako nejjednodušší možné řešení pro tvorbu jednoduchých stránek. Později se ale na trhu objevily jednodušší nástroje a naše služba se začala vymezovat mezi nimi a mezi klasickými CMS systémy jako je WordPress. “5 Do budoucna plánuje webgarden.cz zdokonalit uživatelské rozhraní a přiblížit ho lidem, zároveň však plánuje přidávat nové funkce.

IRISOFT.sk: Produkty a služby. [online]. [cit. 2013-01-05]. Dostupné z: http://www.irisoft.sk/produktya-sluzby/ 4 Kecy k věci.cz: Vyzpovídal jsem jednatele Bohemiasoft s.r.o. [online]. [cit. 2013-01-05]. Dostupné z: http://kecykveci.cz/vyzpovidal-jsem-jednatele-bohemiasoft-s-r-o/ 5 Emailová komunikace s obchodním ředitelem společnosti panem Čelikovským ze dne 20. 12. 2012. 3

7

Webmium.com Webmium.com je provozován firmou nexum Trilog a.s., která byla založena před 14 lety. „Webmium.com je jednoduchý nástroj na tvorbu webových prezentací pro malé a střední firmy, jednotlivce nebo neziskové organizace. Díky intuitivnímu editoru je vytvoření webové stránky snadné a rychlé i bez pomoci programátorů či webových designerů. Webmium.com umožňuje výběr z více než stovky předpřipravených www šablon, nákup a hosting stránek v jednom. Nabízí také jednoduché vkládaní textu, kontaktního formuláře, fotogalerie, mapy, videa či jídelního lístku. “6

Webnode.cz Švýcarská společnost Webnode AG spustila projekt webnode.cz v roce 2008. V současné době ho celosvětově využívá přes 7 500 000 uživatelů. „Webnode je internetový nástroj pro snadnou tvorbu webových stránek a internetových obchodů. Umožňuje uživatelům bez jakýchkoliv technických znalostí vytvořit profesionálně vypadající webovou prezentaci zcela zdarma.“7

6

7

Webmium: O webmium. [online]. [cit. 2013-01-05]. Dostupné z: http://www.webmium.com/cs-cz/o-nas Webnode: O nás. [online]. [cit. 2013-01-05]. Dostupné z: http://www.webnode.cz/o-nas/

8

3 Související práce Níže se nachází soupis souvisejících prací, které byly použity jako inspirace a zdroj zkušeností od jejich autorů. Jsou rozděleny na zdroje z oboru použitelnosti a zdroje z oboru přístupnosti.

3.1 Práce z oboru použitelnosti V práci Bc. Filipa Zwyrteka jsou webové stránky otestovány uživatelským testováním a heuristickou analýzou a na závěr jsou srovnány výsledky obou metod [5]. Teoretická část práce Bc. Ireny Hodžové shrnuje základní pojmy z oboru použitelnosti a přístupnosti. V praktické části je potom autorkou zvolená elektronická knihovna otestována

jak

z

hlediska

použitelnosti,

tak

z

hlediska

přístupnosti

[6].

Nejdůležitější blok bakalářské práce Barbory Ježkové se zaměřuje na použitelnost internetových stránek města Prostějov. Zkoumá také statistiky návštěvnosti stránek [7]. Odborný článek z James Madison University pojednává o testování použitelnosti akademické internetové knihovny na zmíněné univerzitě [8].

3.2 Práce z oboru přístupnosti Odborný článek z University of Manchester se zabývá vylepšováním přístupu postižených uživatelů k obsahu na webových stránkách, je však poučný hlavně z hlediska detailního popisu práce s hendikepovanými (zrakově postiženými) uživateli [9]. V práci Václava Trpáka je nejprve vedena diskuze se zrakově postiženými uživateli o jejich potřebách při používání internetových stránek. Ve druhé části jsou weby státní správy otestovány se zrakově postiženými uživateli, a na základě získaných zkušeností autor

provede

expertní

analýzu

zmíněných

webových

stránek

[10].

Diplomová práce Bc. Jana Balaty navazuje na autorovu bakalářskou práci. V teoretické části jsou analyzovány potřeby zrakově postižených, v praktické potom navržena mobilní 9

a webová aplikace, které mají pomoci zrakově postiženým na turistických cestách [11]. Výzkumný projekt, který vznikl na Masarykově univerzitě se zabývá přístupností webových stránek orgánů státní správy po tom, co Česká republika zavedla pravidla přístupnosti pro weby veřejné správy [12].

10

4 Použitelnost Pojem použitelnost znamená hlavně jednoduchost používání, intuitivnost a také snadnou naučitelnost jeho ovládání. „Použitelný web je ten, kde se uživatelé dobře orientují, rychle naleznou to, co hledají, neztrácejí se, nedělají zbytečné chyby.“8

4.1 Expertní analýza Dané služby byly nejprve otestovány expertní analýzou. Hlavní metodou byla zvolena heuristická evaluace [13]. Pro tyto účely byla vytvořena předloha, podle které měla být na všech službách vytvořena stránka co možná předloze nejbližší.

Heuristická evaluace Heuristická evaluace se na dané testování hodila více než kognitivní průchod, a to z několika důvodů. Testovat kognitivním průchodem je vhodnější u testů, které mají jasný postup a přesně dané jednotlivé úkoly. V tomto případě byl však znám pouze cílový stav, a jen někdy výchozí (nově vytvořené stránky se u některých služeb tvoří náhodně, není tedy vždy stejný výchozí stav). Vzhledem k tomu je zřejmé, že nemohl být jasný ani přesný postup (jednotlivé kroky), jak cílového stavu dosáhnout. Zároveň bylo otestováno pět služeb, které navzájem neměly stejný výchozí stav, takže by ani nemělo význam porovnávat výsledky jednotlivých kroků kognitivního průchodu. Naopak proti heuristické evaluaci mluvil fakt, že je vhodnější ji provádět ve větším množství expertních analytiků (cca 3 - 5), aby mohly být výsledky konzultovány, porovnány a průměrovány. V tomto případě se však jednalo o heuristickou evaluaci s jedním expertem.

ŠPINAR, David. Tvoříme přístupné webové stránky: připraveno s ohledem na novelu Zákona č. 365/2000 Sb., o informačních systémech veřejné správy. Vyd. 1. Brno: Zoner Press, 2004, 360 s. 8

11

U heuristické evaluace se zkoumá tzv. use case9 podle předem určených pravidel. Pokud je při provádění nalezena chyba použitelnosti, uvede se, které z pravidel bylo porušeno a proč. Zároveň se zvolí závažnost daného problému z předem uvedeného přehledu závažnosti problémů (viz kapitola 4.1.4) a v krátkosti je možné navrhnout i řešení. V tomto případě se postupovalo podle Nielsenovy heuristiky z roku 1995 (viz Příloha č. 1: Heuristika podle Jakoba Nielsena (1995)).

Předloha Byla vytvořena jednotná předloha, na které bylo testováno, jak moc se jí dokáží jednotlivé nástroje přiblížit. Zároveň však byla testována jejich použitelnost. Daná stránka byla vybrána jako prototyp stránky malého eshopu bez ohledu na možnosti daných nástrojů. Dalo se tedy předpokládat, že stoprocentně se předloze nepovede přiblížit pomocí ani jednoho

z nástrojů. Výsledek expertní analýzy byl následně použit při testování

s uživatelem, kdy byl pro každý nástroj vytvořen vlastní test. Viz Příloha č. 2: Předloha stránky (wireframe) pro expertní analýzu.

Cílová skupina Stejně jako v testování s uživatelem, i v expertní analýze se pracovalo se stejnou cílovou skupinou. Jednalo se o každodenní uživatele internetu ve věku 18 – 30 let, kteří neovládají pokročilé webové technologie (např. html, php) a s danými nástroji nemají žádné zkušenosti. U zmíněné cílové skupiny se předpokládala bezproblémová schopnost ovládat počítač a pokročilá znalost práce na internetu (např. email, sociální sítě, komunikace). Zároveň se však také počítalo s faktem, že si daný uživatel neumí naprogramovat webové stránky sám, ani nemá peníze na to zaplatit si eshop vytvořený na zakázku.

9

Případ užití

12

Přehled závažnosti problémů V expertní analýze byly použity 3 základní stupně závažnosti problémů. Prioritně seřazeno (od nejzávažnějších) se jednalo o chyby: I.

Kritické Chyby, které znemožňují, nebo mohou znemožnit dokončení úkolu.

II.

Závažné Jako závažné jsou označeny chyby, které způsobí, že úkol zabere delší čas a znamenají jisté problémy při plnění úkolu.

III.

Mírné Mírné chyby jsou takové, které jsou spíše kosmetické a způsobí pouze menší potíže.

Přehled nálezů V této kapitole se nachází přehled nálezů rozdělených podle jednotlivých služeb. Nálezy jsou seřazených prioritně od nejzávažnějších po nejméně důležité. U každého nálezu je zmíněn úkol výskytu, stručný popis problému a návrh řešení.

Byznysweb.cz

U služby byznysweb.cz bylo shledáno celkem deset porušení proti pravidlům přístupnosti. Z toho jedno bylo označeno za kritické, osm za závažné a jedno za mírné. Detailně to popisuje tabulka č. 1.

13

Tabulka č. 1: Přehled nálezů u služby byznysweb.cz

Priorita Úkol

Popis problému

Návrh řešení

Kritická

Změna banneru

Služba neumožňuje

Danou funkci umožnit

Závažná

Úprava položek menu

Nejednoznačná ikona „+“

Změnit ikonu

Závažná

Sloupec napravo

Nejednoznačný popisek

Lepší popisek

Závažná

Úprava obsahu sloupce

Editace pouze v nastavení

Možnost editovat klasicky

Závažná

Produkt do sloupce

Málo viditelná volba

Zvýraznit

Závažná

Smazání titulku

Nachází se v nastavení

Umístit do editace stránek

Závažná

Posouvání obrázků



Závažná

Změna šířky ankety



Závažná

Změna šířky formuláře Služba neumožňuje


Mírná

Vytvoření stránek

Funkci zviditelnit

Není vidět výběr vzhledu

Eshoprychle.cz

U eshoprychle.cz bylo nalezeno celkem sedm porušení proti heuristickým pravidlům. Pouze jedno však bylo ohodnoceno jako kritické, pět jako závažná a jedno jako mírné. Více viz tabulka č. 2. Tabulka č. 2: Přehled nálezů u služby eshoprychle.cz

Priorita

Úkol

Popis problému

Návrh řešení

Kritická

Smazání Úvodní strana



Závažná

Editace podstránek

Nejsou vidět podstránky

Zobrazit všechny úrovně

Závažná

Smazání levého sloupce



Závažná

Skrýt produkty

Nelze najednou

Možnost skrýt najednou

Závažná

Vložení ankety

Pouze do sloupce

Umožnit vložit libovolně

Závažná

Editace zboží

Chybí identifikátor

Přidat identifikátor

Mírná

Posunutí přihlášení

Udává šablona

Umožnit editaci

Webgarden.cz

Expertní analýza zjistila u webgarden.cz pouze šest porušení proti přístupnosti, z toho však dvě byla kritická. Další dvě porušení byla označena za závažná a dvě potom za mírná. Konkrétní chyby zobrazuje tabulka č. 3.

14

Tabulka č. 3: Přehled nálezů u služby webgarden.cz

Priorita

Úkol

Popis problému

Návrh řešení

Kritická

Přidání rubriky

Není vidět tlačítko

Umístit viditelně

Kritická

Vložení zboží

Není vidět tlačítko

Umístit viditelně

Závažná

Nastavení homepage

Nejasný popisek

Vylepšit popis tlačítka

Závažná

Editace úvodní strany

Nejasná terminologie

Zjednodušit, zjednoznačnit

Mírná

Změna šířky odstavce

Nejasná ikona

Použít lepší ikonu

Mírná

Vytvoření webu

Neupozornění na chybu

Upozornit uživatele

Webmium.com

Služba webmium.com neumožňuje uživateli vytvořit eshop a vložit tedy všechny prvky s ním spojené. Tato chyba byla označena za kritickou. Zbylá čtyři provinění byla shledána závažnými. Přehled nálezů u služby webmium.com zobrazuje tabulka č. 4.

Tabulka č. 4: Přehled nálezů u služby webmium.com

Priorita

Úkol

Popis problému

Návrh řešení

Kritická

Vytvoření eshopu



Závažná

Změna banneru

Nepřizpůsobení velikosti

Přizpůsobit obrázku

Závažná

Úprava šířky textu



Závažná

Vložení ankety



Závažná

Vložení formuláře

Není možné editovat

Umožnit editaci

Webnode.cz

U služby webnode.cz bylo nalezeno celkem šest porušení proti pravidlům přístupnosti. Z toho dvě byla označena za kritická, jedno za závažné a tři za mírná. Detailně popisuje tabulka č. 5.

15

Tabulka č. 5: Přehled nálezů u služby webnode.cz

Priorita

Úkol

Popis problému

Návrh řešení

Kritická

Přidání formuláře

Pouze při tvorbě stránky Umožnit klasické vložení

Kritická

Přihlašovací formulář

Není možné vložit

Umožnit vložení

Závažná

Smazání titulku banneru

Editace na double click

Sdělit informaci uživateli

Mírná

Editace produktu

Malé tlačítko

Zvětšit, zviditelnit

Mírná

Smazání menu s produkty Služba neumožňuje


Mírná

Přesunutí košíku



Vyhodnocení expertní analýzy Jak je patrné z grafu č. 1, během expertní analýzy bylo nalezeno celkem 34 provinění proti heuristickým pravidlům. Z toho sedm kritických, dvacet závažných a 7 mírných. Nejvíce chyb bylo shledáno u byznysweb.cz , nejméně u webmium.com.

Graf č. 1: Vyhodnocení expertní analýzy

Kritické chyby

1

1

2

Závažné chyby

1

2

8

Mírné chyby

1

1

0 byznysweb.cz

2

5

0

2

4

1

3

5 eshoprychle.cz

10 webgarden.cz

15 webmium.com

20

25

webnode.cz

16

Byznysweb.cz

Služba umožňuje vložit všechny požadované části ze zadání. Nenabízí však možnost umístit do hlavičky banner přes celou její šířku a výšku. Zároveň je nemožné měnit šířku jednotlivých prvků, a proto nebylo možné dosáhnout rozvržení stránky jako v zadání. Během expertní analýzy bylo nalezeno celkem 10 provinění proti heuristickým pravidlům, z toho 1 bylo kritické, 8 závažných a 1 mírné.

Eshoprychle.cz

Eshoprychle.cz nenabízí vložení formuláře a anketu je možné vložit jen do postranního panelu. Levé menu s produkty také není možné odstranit. Možné je smazat pouze všechny kategorie produktů, pak je ovšem levý panel prázdný. Ostatní prvky je možné vložit, nenabízí však možnost editovat jejich šířku, takže nebylo možné se přiblížit rozložení stránky. Expertní analýza narazila na 7 porušení heuristických pravidel. 1 bylo kritické, 5 závažných a 1 mírné.

Webgarden.cz

Služba webgarden.cz se ze všech pěti testovaných služeb zadání přiblížila nejvíce. Umožňuje vložení všech prvků i požadované rozložení na stránce. Její ovládání však není pro nového uživatele vůbec jednoduché. Tento fakt prokázala expertní analýza, kdy bylo shledáno 6 prohřešků proti heuristickým pravidlům, z čehož 2 byly kritické, 2 závažné a 2 mírné.

Webmium.com

Tento nástroj nenabízí tvorbu eshopu, takže byl oproti ostatním „znevýhodněn“. Zadání tedy logicky nemohl splnit. Kromě prvků eshopu (produkt, nákupní košík) nenabízí ještě 17

vložení ankety a přihlášení. Banner nahraný do hlavičky se navíc přizpůsobuje velikosti hlavičky, takže může být snížena jeho kvalita. Ze všech testovaných služeb se výsledek služby webmium.com od zadání liší nejvíce. U služby webmium.com expertní analýza narazila na 5 porušení heuristik, z toho jedno bylo kritické a 4 závažná.

Webnode.cz

Z testovaných služeb bylo pomocí webnode.cz vzhledem k zadání dosaženo druhého nejlepšího výsledku. Nabízí vložení všech prvků (kromě přihlašovacího formuláře), neumožňuje pouze přesouvání nákupního košíku a odstranění menu s produkty. Služba však jinak splnila zadání, i co se týče rozložení prvků na stránce. Expertní analýza shledala 6 porušení proti pravidlům, z toho 2 kritická, 1 závažné a 3 mírná.

4.2 Testování s uživatelem Expertní analýzu je vhodné zkombinovat s testováním s uživatelem a výsledky následně porovnat a vyhodnotit společně. Obě dvě testování se totiž mohou dost zásadně lišit a právě až jejich vzájemná konfrontace může dohromady určit všechny klady a zápory jednotlivých služeb. Před samotným testováním byly provedeny 3 pilotní testy, konkrétně u služeb eshoprychle.cz, byznysweb.cz a webnode.cz. Tyto testy prokázaly několik drobnějších chyb, které byly následně opraveny a do zadání testování s uživatelem se již díky tomu nedostaly.

Účastníci testu Pro toto konkrétní testování bylo upřednostněno tzv. between-subject testování, kdy je každý uživatel otestován pouze na jedné službě, na rozdíl od tzv. within-subject testování, kde je uživatel testován na obou (v tomto případě všech pěti) službách [14]. 18

Výhodou between-subject testování je fakt, že uživatel není ovlivněn testováním předchozí služby. U within-subject testování totiž může docházet k efektu, kdy účastník testu po testu první služby již očekává obdobné ovládání u služby druhé a určité informace hledá na stejných místech. Efekt se pochopitelně zvětšuje s narůstajícím počtem testů. To však může mít za následek ovlivnění výsledků později testovaných služeb. Tomuto nechtěnému efektu se dá sice čelit změnou pořadí testování služeb u jednotlivých účastníků testu, zamezit mu však úplně nelze. Between-subject je sice náročnější na počet testujících uživatelů (v tomto případě bylo potřeba 25 účastníků testu, pro stejný test s využitím within-subject by stačilo pět účastníků testu), počet testů na jednotlivých službách a čas testování však zůstávají stejné (u between-subject je provedeno 25 testů s 25 účastníky testu, u within-subject je provedeno také 25 testů, ovšem s 5 účastníky testu, kdy každý účastník testu testuje všech 5 služeb).

Screener K vybrání vhodného vzorku účastníků testu slouží první dotazník, takzvaný screener. Má dvě části – veřejnou a neveřejnou. Veřejná část je určena potencionálním účastníkům testu. Ti vyplní odpovědi do dotazníku a na jejich základně buď jsou, nebo nejsou zařazeni do testování. Neveřejná část slouží jako ukazatel požadovaných odpovědí pro zařazení potencionálních účastníků testu do testování. Viz Příloha č. 3: Screener.

Požadovaný profil Cílem bylo získat 25 účastníků testu, rozdělení muži / ženy co nejblíže poměru 1:1. Věkové složení by mělo spadat do rozmezí 20 – 29 let, účastník testu však zároveň musí používat internet minimálně jednou týdně. Maximální povolená znalost zmíněných webových technologií je „Jsem v tomto oboru začátečník“, s tím souvisí, že povolání účastníka by nemělo být z oboru informačních technologií.

19

Skutečný profil Testu se zúčastnilo celkem 25 účastníků (z toho 9 mužů a 16 žen), všichni ve věkovém rozmezí 18 – 29 let. Ani jeden z účastníků neznal webové technologie a nepracoval v oboru informačních technologií. Zároveň všichni uvedli, že internet používají minimálně jednou za týden.

Nastavení testu Test probíhal v kancelářských prostorách na Praze 6. Testovací místnost byla vybavena pracovním stolem, osobním počítačem a mikrofonem. Průběh testu byl zaznamenáván pomocí programu Camtasia Studio 7. Snímán byl jak zvuk, tak obrazovka počítače. Na test přímo dohlížel moderátor10, který si o jeho průběhu dělal poznámky a částečně tak zároveň suploval funkci pozorovatelskou.

Testovací počítač

Všichni účastníci v průběhu testu pracovali na notebooku s následující konfigurací:

10



Intel Core 2 Duo 2.00 GHz



4 GB RAM



Windows 7 Home Premium



Rozlišení monitoru 1366px / 768px

Autor bakalářské práce.

20

Výchozí nastavení místnosti

Počítač v testovací místnosti je zapnutý, na ploše je umístěna složka Web a zástupce prohlížeče Google Chrome. Na pozadí běží program Camtasia Studio 7, který nahrává obrazovku počítače a snímá zvuk.

Pre-test dotazník O účastnících testu je vhodné získat další relevantní informace, které slouží jako pomůcka při následné analýze testu daného uživatele. K tomu slouží tzv. pre-test dotazník. Viz Příloha č. 4: Pre-test dotazník.

Vyhodnocení

Z 25 účastníků jich 24 uvedlo, že internet používají každý den. Pouze jeden účastník používá internet cca jednou za týden. Co se využívání internetu týče, 22 z nich ho používá k zábavě, 5 k hraní her, 24 ke vzdělávání, 17 k práci, 24 ke komunikaci, a 22 pomocí něj sleduje zprávy. Pojem panel by dokázalo vysvětlit 14 účastníků. 12 vědělo, co je url. 20 z nich chápalo, co znamená pojem doména. Všech 25 účastníků by pak dokázalo vysvětlit, co je vyhledávač. Naopak pojem kódování znalo jen 8 z nich. 8 z vybraných účastníků v dotazníku uvedlo, že již v minulosti použili podobnou službu. 3 z nich již dříve použili wordpress, 2 další frontpage, 1 blog, 1 estranky a 1 webgarden.cz. Co se týče publikování obsahu na internetu, 17 z nich již někdy obsah na internetu někdy publikovalo (převážně pomocí sociálních sítí). Zbylých 8 uvedlo, že ještě nikdy obsah na internetu nepublikovali. Zastoupení prohlížečů je následující: 10 účastníků Google chrome, 6 Mozilla Firefox, 4 Opera, 2 Safari a 1 Internet Explorer. Zbylí dva účastníci odpověděli na otázku chybně. 2 z přítomných účastníků uvedli, že již dříve testovali software, zbylých 23 nikoliv. 21

Postup testu Účastník testu je usazen ke stolu v pracovní místnosti a moderátor jej poučí o průběhu testu a ostatních relevantních skutečnostech (např. že je test nahráván). Nejprve je mu předložen pre-test dotazník, který vyplní. Poté jej moderátor vyzve, aby začal plnit zadané úkoly. Uživatel úkoly plní samostatně a je moderátorem hlídán, zda „přemýšlí nahlas“. Do průběhu samotného testu moderátor nezasahuje, pokud to není nezbytně nutné (např. účastník nerozumí zadání, technické potíže, plnění úkolu trvá příliš dlouho atd.). Po splnění zadaných úloh je účastníkovi předložen k vyplnění ještě závěrečný dotazník a následně test končí.

Přehled úkolů testu Každá z 5 služeb měla tentokrát vytvořený test „na míru“, neboli tak, aby všechny úkoly bylo možné na daném systému úspěšně dokončit. Průnikem všech testů však bylo: 

Spuštění prohlížeče



Vstoupení na stránky dané služby



Založení webu



Vytvoření stránek podle předlohy (v tomto bodě se testy nejvíce lišily)



Odhlášení a vypnutí prohlížeče

Předlohy stránek pro jednotlivé nástroje byly řešeny pomocí tzv. wireframů11. Jedna služba měla vždy jeden wireframe, který znázorňoval požadované rozložení daných prvků na stránce.

11

Drátěný model, schematicky zachycuje rozložení prvků na stránce

22

Průběh testů Níže se nachází soupis průběhu testů všech účastníků rozdělených podle jednotlivých služeb. Pro každého účastníka testu a každý úkol je v příslušné buňce zaznamenáno, jestli byl úkol dokončen, a s jakými obtížemi.

Byznysweb.cz

Expertní analýza ukázala, že byznysweb.cz dovoluje uživateli vložit všechny prvky, které měla testovací stránka u expertní analýzy. Muselo však být změněno rozvržení jednotlivých prvků (viz Příloha č. 5: Zadání testu s uživatelem pro službu byznysweb.cz). Průběh testů zachycuje tabulka č. 6.

Tabulka č. 6: Přehled plnění úkolů služby byznysweb.cz

Úkol / účastník 1

2

3

4

5

potíže

1. spuštění

ok

ok

ok

ok

ok

0z5

2. založení

ok

ok

X

ok

X

2z5

3. upravení

R

M

R

Č

Č

5z5

banner

R

R

ok

R

R

4z5

menu

ok

ok

R

ok

Č

2z5

nadpis

ok

ok

ok

ok

ok

0z5

text

ok

M

M

M

ok

3z5

obrázky

ok

ok

M

R

M

3z5

anketa

R

ok

R

ok

Č

3z5

formulář

R

ok

Č

Č

Č

4z5

přihlašování

ok

ok

ok

ok

ok

0z5

košík

ok

ok

ok

ok

ok

0z5

produkt 4. konec

R ok

Č ok

R ok

Č ok

R ok

5z5 0z5

Poznámka: ok = úkol proběhl v pořádku, M = úkol způsobil malé potíže, Č = úkol zabral hodně času, R = účastník potřeboval radu moderátora, X = úkol se nepovedlo dokončit

23

Eshoprychle.cz

Expertní analýza služby eshoprychle.cz prokázala, že tato služba nenabízí vložení formuláře a ankety (tu jen velmi omezeně). Proto byly z wireframu vyjmuty a zároveň bylo lehce upraveno rozložení (viz Příloha č. 6: Zadání testu s uživatelem pro službu eshoprychle.cz). Průběh testů služby eshoprychle.cz zachycuje tabulka č. 7.

Tabulka č. 7: Přehled plnění úkolů služby eshoprychle.cz


2

3

4

5

potíže

1. spuštění

ok

ok

ok

ok

ok

0z5

2. založení

M

M

M

M

M

5z5

menu

X

X

X

X

X

5z5

3. upravení

ok

M

M

Č

ok

3z5

banner

ok

M

ok

M

ok

2z5

nadpis

ok

M

Č

Č

ok

3z5

text

ok

M

Č

Č

ok

3z5

obrázky

X

ok

ok

Č

R

3z5

přihlašování

ok

ok

ok

ok

ok

0z5

košík

ok

ok

ok

ok

ok

0z5

produkt

M

R

R

X

R

5z5

ok

ok

ok

ok

ok

0z5

4. konec


Webgarden.cz

Webgarden.cz je služba, u které nebylo prakticky vůbec měnit zadání oproti expertní analýze (viz Příloha č. 7: Zadání testu s uživatelem pro službu webgarden.cz). Průběh testů zobrazuje tabulka č. 8.

24

Tabulka č. 8: Přehled plnění úkolů služby webgarden.cz


2

3

4

5

potíže

1. spuštění

ok

ok

ok

ok

ok

0z5

2. založení

R

R

R

R

M

5z5

3. upravení

M

X

X

R

R

5z5

banner

R

M

R

R

ok

4z5

menu

M

M

R

R

Č

5z5

nadpis

ok

ok

ok

ok

ok

0z5

text

ok

ok

ok

ok

ok

0z5

obrázky

ok

ok

ok

ok

ok

0z5

anketa

ok

R

ok

ok

ok

1z5

formulář

ok

ok

ok

ok

ok

0z5

přihlašování

ok

ok

R

M

ok

1z5

košík

M

Č

R

ok

ok

3z5

produkt

X

R

ok

X

R

4z5

ok

ok

ok

ok

ok

0z5

4. konec


Webmium.com

Webmium.com nenabízí tvorbu eshopu, proto pro něj muselo být zadání upraveno nejvíc ze všech služeb. Zároveň také nenabízí vložení ankety. Viz Příloha č. 8: Zadání testu s uživatelem pro službu webmium.com. Průběh testu ukazuje tabulka č. 9.

25

Tabulka č. 9: Přehled plnění úkolů služby webmium.com


2

3

4

5

potíže

1. spuštění

ok

ok

ok

ok

ok

0z5

2. založení

M

ok

X

ok

Č

3z5

3. upravení

ok

ok

M

M

ok

2z5

banner

M

ok

ok

X

ok

2z5

menu

ok

ok

R

ok

ok

1z5

nadpis

ok

M

ok

ok

M

2z5

text

ok

M

ok

ok

M

2z5

obrázky

ok

ok

ok

ok

ok

0z5

formulář

ok

M

ok

M

ok

2z5

kontakt

X

ok

ok

M

ok

2z5

ok

ok

ok

ok

ok

0z5

4. konec


Webnode.cz

Služba webnode.cz nabízí k vložení všechny prvky, které byly testovány v expertní analýze. Pouze bylo třeba lehce upravit jejich rozložení. Viz Příloha č. 9: Zadání testu s uživatelem pro službu webnode.cz. Plnění úkolů je zachyceno v tabulce č. 10.

26

Tabulka č. 10: Přehled plnění úkolů služby webnode.cz


2

3

4

5

potíže

1. spuštění

ok

ok

ok

ok

ok

0z5

2. založení

M

R

ok

M

ok

3z5

3. upravení

M

Č

ok

ok

M

3z5

banner

M

ok

ok

ok

ok

1z5

menu

M

Č

Č

ok

M

4z5

nadpis

ok

ok

ok

ok

ok

0z5

text

ok

ok

ok

ok

ok

0z5

obrázky

R

Č

Č

M

R

5z5

anketa

ok

ok

ok

ok

ok

0z5

formulář

X

X

X

X

M

5z5

košík

ok

ok

ok

ok

ok

0z5

produkt

X

X

R

ok

R

4z5

ok

ok

ok

ok

ok

0z5

4. konec


Post dotazník Jakmile účastník dokončí všechny úlohy, vyplní post dotazník. Primárním účelem dotazníku je zjistit, jaké dojmy v účastníkovi aplikace zanechala. Podstatné jsou jak kladné, tak záporné názory. Jako post dotazník byl využit tzv. SUS (System usability scale = stupnice použitelnosti systému)12. Viz Příloha č. 10: Post dotazník. Jeho velká výhoda je totiž v tom, že výsledkem jsou srovnatelné číselné výsledky jednotlivých služeb.

J. Brooke: SUS – A quick and dirty usability scale. Odborný článek. Dostupné z http://hell.meiert.org/core/pdf/sus.pdf. 12

27

Vyhodnocení

Důležité je zmínit, že výsledky post dotazníku jsou čistě subjektivní názory jednotlivých účastníků. Podstatné je také říci, že se v dotazníku SUS pravidelně střídají odpovědi, kde je požadovaným výsledkem 1 s odpověďmi, kde je požadovaným výsledkem 5. U první odpovědi je tedy číslo lepší, čím je bližší 1, u druhé otázky přesně obráceně, atd. Konkrétní hodnoty pro jednotlivé účastníky testu se nachází v příloze č. 11.

Srovnání

K vypočítání skóre podle SUS je nejprve nutné spočítat hodnotu pro každou otázku. U lichých otázek (1, 3, 5, 7 a 9) se skóre počítá jako 5 mínus hodnota. Pro sudé otázky se skóre počítá jako hodnota mínus 1. Skóre jednotlivých řádků se sečte a následně vynásobí konstantou 2,5, čímž se vypočte výsledné skóre podle SUS.

10

𝑠𝑘ó𝑟𝑒 = 2,5 ∗ ∑ {[(−1)𝑛 + 1] ∗

𝑥𝑛 − 1 5 − 𝑥𝑛 − [(−1)𝑛 − 1] ∗ } 2 2

𝑛=1

kde n udává číslo řádku a xn je hodnota na řádku n. Nejhorší možný výsledek je 0, nejlepší potom 100. Průměrné hodnoty vyhodnocení SUS pro jednotlivé služby zobrazuje tabulka č. 11. Tabulka č. 11: Průměrné hodnoty vyhodnocení SUS pro jednotlivé služby a směrodatné odchylky

byznysweb.cz

eshoprychle.cz

webgarden.cz webmium.com webnode.cz

skóre SUS

30

44

43

53

33,5

směrodatná odchylka

15,08

29,56

20,94

23,04

13,66

Poznámka: Směrodatná odchylka je zaokrouhlena na dvě desetinná místa.

28

Podle účastníků testu tedy jednoznačně na prvním místě skončila služba webmium.com, na druhém místě se umístil eshoprychle.cz, na třetím webgarden.cz, na čtvrtém webnode.cz a na pátém byznysweb.cz. Pomyslné první místo služby webmium.com lze přičítat převážně tomu, že její administrace nenabízí tak velké množství editace a tak širokou škálu prvků jako u jejích konkurentů. Například vložení produktu, což je úkol, který působil patrně největší potíže napříč službami, není možné v této službě otestovat. Nenabízí totiž možnost vytvořit si eshop. Na druhou stranu je nutné přiznat, že první místo služby webmium.com je výrazné, jelikož jako jediná přesáhla hranici 50 bodů.

Vyhodnocení testování s uživatelem Podle nabízené funkcionality se dají relevantně posuzovat pouze 4 služby a to byznysweb.cz, eshoprychle.cz, webgarden.cz a webnode.cz. Služba webmium.com bohužel nenabízí vytvoření eshopu, a proto jakékoliv porovnání použitelnosti této služby a zbylých čtyř by nebylo spravedlivé. Ve výsledcích testování s uživatelem skončila služba webmium.com jednoznačně na prvním místě. A to nejen u subjektivního hodnocení uživatelů, ale i v samotných výsledcích testů použitelnosti. Pouze jeden úkol z 11 činil potíže nadpoloviční většině uživatelů. Všechny zbylé úkoly dělaly problémy méně než polovině zúčastněných, což lze jednoznačně považovat za úspěch. Dobrá použitelnost je však vyvážena již zmíněnou omezenou funkcionalitou. Pokud však tedy mají být porovnány použitelnosti služeb s podobnou funkcionalitou, je potřeba webmium.com vypustit. Přehledy plnění úkolů zbylých čtyř služeb vypadají velice podobně. U byznysweb.cz došlo celkem k 31 chybám, u eshoprychle.cz k 29 chybám, u služby webgarden.cz to bylo 28 chyb a u webnode.cz chyb 25. To jsou čísla relativně srovnatelná. Pokud by se jednotlivým chybám přiřadily priority (úkol se nepovedlo dokončit = 1, úkol dokončen s pomocí moderátora = 0,75, úkol zabral hodně času = 0,5, úkol způsobil malé potíže = 0,25), a s jejich pomocí se vypočítal pro každou službu vážený průměr, byly by shledány lehce odlišné výsledky. U byznysweb.cz by vyšla hodnota 18,5, u eshoprychle.cz 16, u webgarden.cz 18 a u webnode.cz 14,5. Tato čísla mají 29

pochopitelně větší vypovídající hodnotu než jen čistý součet chyb. Výsledky testování s uživatelem zobrazuje tabulka č. 12 a graf č. 2.

Tabulka č. 12: Porovnání chyb jednotlivých služeb

Chyba / služba

byznysweb.cz

eshoprychle.cz

webgarden.cz

webnode.cz

X

2

7

4

6

R

14

4

15

5

Č

9

6

2

5

M

6

12

7

9

celkem

31

29

28

25

vážený průměr

18,5

16

18

14,5

Poznámka: X = úkol nepovedlo dokončit, R = úkol dokončen s pomocí moderátora, Č = úkol zabral hodně času, M = úkol způsobil malé potíže

Graf č. 2: Porovnání počtu chyb jednotlivých služeb

X

2

7

R

6

14

Č

M

4

9

6

4

6

2

15

5

12

byznysweb.cz

5

7

eshoprychle.cz

webgarden.cz

9

webnode.cz


30

Z těchto výsledků vyplývá, že testování s uživatelem mezi čtyřmi službami jednoznačně neukázalo výrazné rozdíly. Uživatelé sami v post dotazníku označovali nejlépe webmium.com (to z výše zmíněných důvodů není vhodné uvažovat), a na poslední dvě místa zařadili byznysweb.cz a webnode.cz. Samotné testy však takové pořadí nepotvrdily. Pořadí vycházející čistě z testování s uživateli je tedy následující. Na prvním místě by se umístil webnode.cz, na druhém eshoprychle.cz, na třetím webgarden.cz a na čtvrtém byznysweb.cz.

4.3 Vyhodnocení použitelnosti Během expertní analýzy bylo zjištěno, že služba webmium.com bohužel výrazně nedosahuje takových funkcionalit jako ostatní čtyři služby (hlavně neumožňuje vytvořit eshop). Proto je téměř nemožné ji s ostatními porovnávat. Zbylé čtyři služby dopadly velice podobně, co se testů použitelnosti s uživateli týče. Dané testy neprokázaly výrazné rozdíly použitelnosti jednotlivých služeb. Sami účastníci testu však v post dotaznících na první místo jednoznačně zvolili právě webmium.com. Tento výsledek však není překvapivý. Z již dříve zmíněného vyplývá, že test pro danou službu byl podstatně lehčí než u ostatních služeb, a tak účastníkům připadala práce pohodlnější a jednodušší. Dalo by se tedy říci, že webmium.com je nejvhodnější pro vytvoření základních jednoduchých stránek, Naopak na poslední dvě místa účastníci zařadili služby byznysweb.cz a webnode.cz, což však samotné výsledky testů s uživatelem nepotvrdily – webnode.cz dopadl nejlépe a byznysweb.cz nejhůře. Expertní analýza dále prokázala, že možnosti vkládaných funkcionalit služeb byznysweb.cz, eshoprychle.cz, webgarden.cz a webnode.cz jsou až na drobné odchylky dosti podobné. Služba webgarden.cz má však jednoznačně největší možnost editace co se týče rozložení prvků na stránce (šířky prvků, jejich umístění). Tím je nejvariabilnější a umožňuje uživateli největší možnost si stránku uzpůsobit. Zároveň však obsahuje velké množství nejednoznačných termínů a chyb v použitelnosti.

31

Služby byznysweb.cz a eshoprychle.cz jsou si svojí administrační částí dost podobné. Eshoprychle.cz je sice více specializován na tvorbu eshopů (čemuž odpovídá rozvržení administrace), jinak však pracují na podobném principu. Mají sice menší možnost flexibility jednotlivých prvků oproti službě webgarden.cz, práce je však díky tomu o něco jednodušší a přehlednější. Za velkou nevýhodu by se dal označit fakt, že některé prvky (např. vyhledávání nebo přihlašování) nejsou vkládány jako ostatní prvky, ale pouze se jejich zobrazení zaškrtává v nastavení. Webnode.cz nabízí on page editaci, a z expertní analýzy vyšel velice dobře. Zadání na něm bylo možné dokončit téměř celé a práce s ním (i přes některé chyby) byla velmi snadná. O to více překvapil post dotazník, kdy ho uživatelé zařadili až na předposlední místo. Většinou totiž nedokázali pochopit, jak celá administrace funguje, jak mají přidávat prvky, a hlavně potom produkty do eshopu.

32

5 Přístupnost Přístupnost na webu znamená, že ho postižení uživatelé mohou používat. Přesněji řečeno přístupnost určuje, že lidé s postiženími mohou web vnímat, chápat, pohybovat se po něm a používat ho.13 Pravidla pro zpřístupnění obsahu webových stránek, WCAG 1.0, byla definována konsorciem W3C v roce 1999. Na tato pravidla navazují WCAG 2.0, jejichž návrh vznikl v roce 2004 a zveřejněna byla roku 2008.14 Nevycházelo se však pouze z těchto pravidel. Kontaktován byl také Michal Rada, zrakově postižený poslanec za ČSSD, působící na Ministerstvu vnitra. „Je mimo jiné vedoucím Iniciativy informatiky pro občany (IIO) a aktivně se podílí na aplikovatelnosti asistivních technologií.“15 Na základě WCAG 2.0 a osobních zkušeností Michala Rady byly z hlediska přístupnosti označeny jako nejdůležitější prvky správně strukturovaná stránka, nadpisy, navigace, vyhledávání, správné popisky u grafických prvků, popisky formulářových polí, odkazy, přístupné tabulky a ovladatelnost z klávesnice.

5.1 Expertní analýza Testování přístupnosti webových stránek může probíhat třemi způsoby. Prvním způsobem je nechat si stránky předčítat pomocí čtečky obrazu, stejně jako to dělají zrakově postižení uživatelé, druhou možností je zkoumání zdrojového kódu a třetí jsou testy s uživateli.

13

http://www.w3.org/WAI/intro/accessibility.php [cit. 2013-05-18] BREWER, Judy. Web Accessibility Highlights and Trends. In: HARPER, Simon, Yeliz YESLILADA a Carole GOBLE. Proceedings of the International Cross-Disciplinary Workshop on Web Accessibility: 2004, New York City, N. Y., 2004 [online]. New York, NY: ACM Press, 2004 [cit. 2013-05-18]. 15 https://www.facebook.com/pages/Michal-Rada/145274776390?id=145274776390 14

33

V tomto případě byly všechny způsoby zkombinovány pro dosažení přesnějších a konkrétnějších výsledků. Testování je rozděleno na testování samotných administrací a webů pomocí služeb vytvořených.

Použitý software Pro účely testování byly použity prohlížeče Mozilla Firefox 19, Internet Explorer 9 a Google Chrome 25. Mozilla Firefox a Internet Explorer jsou nejpoužívanější prohlížeče mezi hendikepovanými uživateli internetu, Google Chrome je nejpoužívanější prohlížeč na světě vůbec.16 Jako čtečky obrazu byly zvoleny JAWS 13 a NVDA 2012.3.1. JAWS je nejpoužívanější čtečka obrazu, NVDA je zdarma.

Administrace Pro testování administrací byl vytvořen test obsahující několik typických úkolů, u kterých bude přístupnost otestována. Test obsahuje založení stránek, úpravy obsahu (text, obrázek, produkt, titulek), zjištění počtu návštěv na stránce, změnu hesla a odhlášení.

Byznysweb.cz

Na službě byznysweb.cz je možné si založit stránky a používat hlavní a postranní menu – lze klikat na jednotlivé podstránky a otevřít tak jejich obsah. Nejde už ale prokliknout do tzv. bloků obsahu, které již na stránce jsou. Problémem je, že bloky jsou realizovány pomocí obrázků bez popisků, které navíc nejsou odkazy. Odkaz na takový prvek je připojen pravděpodobně pomocí javascriptu, a z hlediska přístupnosti je tak naprosto nepoužitelný.

16

http://gs.statcounter.com/ [cit. 2013-05-18]

34

Stejně tak nejde vytvořit nová stránka, protože při jejím vytvoření je nutné zvolit výchozí blok stránky. Nastane tak stejný problém. Obdobný problém je u produktů – je možné se do nich proklikat, nelze už však zvolit konkrétní produkt a ten editovat, ani vytvořit nový. Navíc je většina prvků v tabulkách, což z hlediska přístupnosti není příliš výhodné, pokud nejsou vhodně popsány. Na této službě tedy test přístupnosti nemohl proběhnout, jelikož stránky nelze tvořit.

Eshoprychle.cz

U vytvoření stránky na eshoprychle.cz byla objevena chyba hned na počátku. Tlačítko „Chci vyzkoušet zdarma“ je reprezentováno odkazem, který má pomocí CSS připojen obrázek na pozadí. Takový prvek je naprosto nepřístupný a nevidomý uživatel ho nedokáže použít. Druhá zásadní chyba nastala hned vzápětí, kdy je otevřeno javascriptové okno a uživatel o tom není informován. Po vyplnění domény, emailu a hesla navíc nelze nalézt odesílací tlačítko – to je reprezentováno obrázkem, na kterém není klasický odkaz. Dále se nachází průvodce nastavením webu, který je v pořádku. Jediná chyba je u editace designu, který je už ze své podstaty nepřístupný. Během vkládání textu na úvodní stranu nebyl nalezen žádný problém z hlediska přístupnosti. Nad textovým editorem se dokonce nachází informace o klávesových zkratkách (např. ALT + Z = přepnutí přímo do textového editoru). Při vkládání produktu bylo objeveno hned několik chyb přístupnosti. Kategorie produktů, stejně jako produkty, jsou řazeny v tabulce, která má popisky nahoře. Čtečka obrazu čte obsah lineárně, a proto je uživatel zmaten, jelikož neví, co mu zrovna čtečka předčítá. Při vytváření samotného produktu je nejdříve přečten celý řádek a až potom se čtečka vrátí k požadovanému místu. Důvodem je opět rozdělení do tabulky. Pod vytvořeným produktem je nutné určit, do které kategorie se produkt zařadí. Vybírání je realizováno pomocí formulářových checkboxů a radií, což dohromady nedává žádný smysl a uživatele to zmate.

35

Během vkládání fotografie a titulku stránky nebyla nalezena žádná chyba. Statistiky jsou však reprezentovány pomocí technologie flash, která je nepřístupná a čtečka obrazu si s ní neporadí. Změna hesla a odhlášení jsou z hlediska přístupnosti v pořádku.

Webgarden.cz

Administrace služby Webgarden.cz využívá velké množství javascriptových prvků a tím je nepřístupná. Nabízí však alternativní „mobilní“ verzi, která běží bez javascriptu. Otestována byla tedy tato mobilní administrace. Při vytváření stránky se sice popisky formulářových polí nachází přímo před nimi, nejsou však správně vloženy do značky label. Tento problém se vyskytuje u všech formulářových polí během vytváření stránky. Během vkládání textu byly objeveny dvě chyby z hlediska přístupnosti. Odkaz, kterým se přidává prvek na stránku, neobaluje nic, co by čtečka obrazu mohla číst. Proto čtečka přečte jen „odkaz“ a uživatel netuší, co se za ním skrývá. Druhou chybou je, že chybí popisek textového pole, do kterého se má zadat požadovaný text. U vkládání produktu se opakovala opět chyba se špatně popsanými formulářovými políčky, a také chyba, kdy jsou popsány sloupce tabulky v prvním řádku, takže čtení údajů v tabulce potom nedává žádný smysl. Při vkládání obrázku a titulku nebyla nalezena žádná nová chyba z hlediska přístupnosti. Statistika návštěvnosti ukazuje čísla, která však nemají popisky a jejich význam je tedy nulový. Změna hesla je v pořádku, pouze je jeden z řádků v angličtině (pravděpodobně omylem).

Webmium.com

Na službě webmium.com lze sice stránky vytvořit a následně používat hlavní menu, bez použití myši však stránky tvořit nejde. Celá administrace je postavena na AJAXu a javascriptu, což jsou technologie nepřístupné. Čtečka nedokáže přečíst obsah na stránce

36

a klávesnicí není možné obsah editovat. Administrace webmium.com tedy nebyla dále z hlediska přístupnosti testována.

Webnode.cz

Pro webnode.cz platí totéž co pro službu webmium.com. Vytvoření stránek jen za použití klávesnice je možné a používání hlavního menu také. Úprava stránek už však kvůli AJAXu a javascriptu jen pomocí klávesnice nejde. Čtečka nedokáže obsah stránky přečíst. Služba webnode.cz také nabízí alternativní mobilní editaci, její funkčnost je však minimální, a proto nebyla testována.

Vytvořené internetové stránky Bez ohledu na funkčnost jednotlivých služeb bylo vybráno 10 základních prvků pro otestování přístupnosti. Každá stránka byla naplněna těmito prvky a následně otestována stejným způsobem jako administrace. Jednalo se o tyto prvky: I. II.

Text – nalezení a přečtení. Fotografie – nalezení a přečtení alternativního popisku.

III.

Anketa – provést hlasování.

IV.

PDF soubor – nalezení a stáhnutí.

V. VI. VII. VIII. IX. X.

Přihlašovací formulář – nalezení a přihlášení. Video – nalezení a spuštění. Formulář pro odeslání vzkazu – nalezení a odeslání vzkazu. Vyhledávání – nalezení a vyhledání výrazu. Nákupní košík – vstoupení do košíku. Koupení výrobku – nakoupení výrobku.

37

Byznysweb.cz

Byznysweb.cz nenabízí možnost vložení souboru ke stažení (úkol IV), všechny ostatní úkoly na něm byly otestovány. Bez jakýchkoliv chyb byly provedeny úkoly I, III, VII, VIII a IX. Menší chyba byla zaznamenána u úkolu II – obrázky nemají alternativní popisky, čtečka však přečte přiložený popisek. Výrazná chyba byla objevena u úkolu V – přihlašování vyskočilo jako javascriptové okno na vrchní části stránky a uživatel o tom nebyl informován. Na okno se pomocí klávesnice dalo najet až po projití celé stránky. Přístupnost youtube videa vždy závisí na konkrétním prohlížeči a čtečce, proto již u ostatních služeb nebude zmiňována. V kombinaci Mozilla Firefox 19 a NVDA 2012.3.1 přístupné je, ovšem nejsou správně čteny popisky ovládacích prvků. Při kupování výrobku nastala chyba, ovšem ne chyba přístupnosti. Systém zahlásil chybu „You can not insert product with price 0“, i když produkt měl cenu vyplněnou korektně.

Eshoprychle.cz

Služba eshoprychle.cz neumožňuje otestovat úkoly IV (soubor ke stažení), VI (video) a VII (formulář). Až na úkol IX (košík) nebyla shledána žádná chyba. Obrázky mají vyplněné alternativní popisky a formulářová pole mají vyplněné popisky. Jediná chyba byla tedy nalezena u nákupního košíku. Ten je na stránce reprezentován odkazem, který udává počet kusů zboží v košíku a jeho cenu. Slovo košík však není zmíněno.

Webgarden.cz

U webgarden.cz proběhly bez chyb testy úkolů I, II, III, IV a IX. U úkolů V, VII, VIII a X došlo vždy ke stejné chybě – formulářová pole neměla správně vyplněné popisky. Pouze před každým polem byl text popisující jeho funkci, což však není dostačující. 38

Zajímavé je, že formulářová pole sice neměla popisky, odesílací tlačítka již však byla v pořádku.

Webmium.com

Webmium.com neumožňoval otestovat úkoly III, IV, V, VIII, IX a X. U úkolu II byla shledána chyba – obrázky nemají alternativní popisky. Čtečka v takovém případě hledá jinou možnost jak uživateli přiblížit obsah obrázku. V tomto případě přečetla url obrázku. U ostatních úkolů nebyly objeveny chyby.

Webnode.cz

Bezplatný provoz služby webnode.cz neumožňuje otestování úkolu V. Kromě úkolu II nebyly shledány žádné chyby. Pouze u obrázku je jako jeho alternativní popisek použita jeho url, což není příliš vhodné, jelikož url je dost dlouhá a až její poslední část udává název souboru.

Vyhodnocení expertní analýzy Expertní analýza prokázala, že dvě (webmium.com a webnode.cz) z pěti služeb jsou naprosto nepřístupné. Jejich administrační rozhraní je celé postavené na technologii AJAX, která dynamicky mění obsah na stránce a čtečka obrazu si s tím nedokáže poradit. Službu byznysweb.cz lze z hlediska přístupnosti používat, ovšem stránky na ní tvořit nelze. Vkládání obsahových bloků na stránku je reprezentováno obrázky, které na sobě nemají klasický odkaz a pomocí klávesnice se na ně nedá doklikat. V administračním rozhraní eshoprychle.cz bylo shledáno jen malé množství chyb. Převážně se jednalo o tabulky, které měly popisek v prvním řádku. Tabulka je však čtena po řádcích a uživatel je z nejasných informací v tabulce zmaten. Naprosto nepřístupné je však samotné vytvoření stránek, kdy tlačítko vytvořit je reprezentováno obrázkem na 39

pozadí, který ze své podstaty nemá alternativní popisek. Stejně tak jako tlačítko pro odeslání formuláře, které je zastoupeno obrázkem, který kolem sebe nemá odkaz – zrakově postižený uživatel ho tak není schopen použít. Detailní přehled chyb přístupnosti služby eshoprychle.cz zobrazuje tabulka č. 13 a graf č. 3. V následujícím textu je opět použito rozdělení chyb popsané v kapitole 4.1.4.

Tabulka č. 13: Přehled nálezů u služby eshoprychle.cz

Priorita

Úkol

Popis problému

Návrh řešení

Kritická

Založení webu

Obrázek na pozadí

Použít klasický obrázek

Kritická

Založení webu

Odesílání nemá tlačítko

Použít klasické tlačítko

Kritické

Zjištění statistik

Graf pomocí flash

Použít HTML zobrazení

Závažná

Založení webu

Neinformuje o novém okně

Podat informaci

Závažná

Vložení produktu

Checkbox i radio

Použít pouze jeden z nich

Mírná

Vložení produktu

Nepřístupná tabulka

Použít thead a th

Webgarden.cz má klasické administrační rozhraní nepřístupné, nabízí však alternativní mobilní editaci bez AJAXu a javascriptu dostupnou z webu. I v ní se však nachází několik chyb. Formulářová políčka nemají správně vyplněné popisky, tabulky nejsou vhodně popsány a vůbec nejdůležitější odkaz pro přidání prvku na stránku nemá vyplněn popisek a čtečka přečte pouze „odkaz“. Pro testy s uživatelem byly nakonec vybrány pouze služby eshoprychle.cz a mobilní verze webgarden.cz, protože na ostatních není možné přístupnost testovat. Přehled chyb přístupnosti administrace webgarden.cz zachycuje tabulka č. 14 a graf č. 3.

Tabulka č. 14: Přehled nálezů u služby webgarden.cz

Priorita

Úkol

Popis problému

Návrh řešení

Kritická

Vložení textu

Nepopsaný odkaz

Odkaz popsat

Kritická

Zjištění statistik

Nepopsaná čísla

Popsat čísla

Závažná

Vložení produktu

Nepopsané formuláře

Použít label

Závažná

Vložení textu

Nepopsaná textarea

Správně popsat

Závažná

Vytváření stránek

Nepopsané formuláře

Použít label

Mírná

Změna hesla

Nepřeložený řádek

Přeložit

40

Graf č. 3: Přehled nálezů chyb v administracích

KR IT IC KÉ C HYB Y

3

ZÁVAŽNÉ CHYBY

1

2

M ÍR NÉ C HYB Y

1

3

1

eshoprychle.cz

webgarden.cz

Při testování vytvořených stránek byly shledány určité nedostatky u všech služeb. Byznysweb.cz má přihlašování na javascriptovém okně, eshoprychle.cz nemá správně popsán odkaz do nákupního košíku, u webgarden.cz chybí popisky formulářových polí, webmium.com nemá vyplněny alternativní popisky u obrázků a webnode.cz jako popisek obrázku ukládá jeho url. O chybách informuje graf č. 4.

Graf č. 4: Přehled nálezů chyb na vytvořených stránkách

KR IT IC KÉ C HYB Y 0

ZÁVAŽNÉ CHYBY

1

M ÍR NÉ C HYB Y

1

byznysweb.cz

1

0

1

0

eshoprychle.cz

1

4

webgarden.cz

0

webmium.com

webnode.cz

41

5.2 Testy s uživatelem Na základě expertní analýzy byly vytvořeny testy přístupnosti pro zrakově hendikepované uživatele. Jelikož se jedná o specifické služby s rozsáhlou funkcionalitou, byl proveden pilotní test pro ověření obtížnosti a doby trvání. Zároveň na něm bylo odzkoušeno, jak testování se zrakově postiženými obecně funguje – co všechno je potřeba zařídit oproti testování s běžnými uživateli. Test byl proveden na službě eshoprychle.cz a jeho výsledky byly použity k vylepšení následného testování

Účastníci testu Testování bylo, stejně jako u expertní analýzy, rozděleno do dvou částí. V první části účastníci testu testovali přístupnost administrací (pouze dvou, ostatní byly vyřazeny na základě expertní analýzy). Každý účastník testoval pouze jednu administraci. V druhé části byly testovány internetové stránky vytvořené pomocí daných služeb. Každý účastník testoval všech pět vytvořených stránek.

Požadovaný profil Cílem bylo získat alespoň 2 zrakově postižené účastníky testu, aby obě administrace mohly být minimálně jednou otestovány. Vzhledem k výsledkům expertní analýzy by všichni účastníci měli být v práci s počítačem a internetem na vysoké úrovni. Zároveň bylo nutné, aby si každý účastník testu přinesl vlastní notebook, na kterém bude pracovat.

42

Skutečný profil Testu se zúčastnili dva zrakově postižení účastníci (plus jeden na pilotním testu), oba pracují v informačních technologiích a byli ochotni si na testování přinést vlastní notebook.

Nastavení testu Test probíhal v kancelářských prostorách Fakulty elektrotechnické na Karlově náměstí. Místnost byla vybavena pracovním stolem a jak kabelovým, tak wi-fi připojením k internetu. Každý účastník si přinesl vlastní notebook. Na test dohlížel moderátor17, který si o jeho průběhu dělal poznámky a suploval tak funkci pozorovatelskou.

Pre-test dotazník I u testování přístupnosti byl použit pre-test dotazník pro zjištění co nejvíce důležitých informací o jednotlivých účastnících testu. Otázky směřovaly převážně na zkušenosti s používáním podobných služeb, a používání čteček obrazu. Viz Příloha č. 12: Pre-test dotazník.

Vyhodnocení

Účastník 1 – Muž, 30-39 let, od narození nevidomý. Pracuje v IT, konkrétně v oblasti mobilních technologií. Spravuje blog na blogspot.cz. Používá Mozillu Firefox 3.6, hlavně kvůli možnosti přidávat pluginy18 (webvisium pro čtení captchy19, adblock). Jako čtečku

Autor bakalářské práce Rozšíření 19 Test na webu, který má odlišit roboty od lidí 17 18

43

obrazu preferuje Window eyes, protože je na něj zvyklý a je pro něj jednodušší než Jaws. Pokud něco nedokáže Window eyes přečíst, použije NVDA. Účastník 2 – Muž, 50-59 let, úplná slepota 45 let. Pracuje jako správce databáze. Dokud nebyl web tolik grafický, spravoval několik internetových stránek. S podobnou službou zkušenosti nemá, ale opravoval články na Wikipedii. Používá Internet Explorer 8, protože je na něj zvyklý, a je dobře kompatibilní se čtečkou Jaws 13, kterou používá.

Postup testu Účastník testu je usazen ke stolu v pracovní místnosti a moderátor jej poučí o průběhu testu. Nejprve s ním moderátor vyplní pre-test dotazník. Poté mu moderátor začne zadávat jednotlivé úkoly. Uživatel úkoly plní samostatně, do průběhu samotného testu moderátor nezasahuje, pokud to není nezbytně nutné (např. účastník nerozumí zadání, technické potíže, plnění úkolu trvá příliš dlouho atd.). Po splnění zadaných úloh (nebo vypršení limitu 90 minut) vyplní moderátor s účastníkem testu ještě závěrečný dotazník a následně test končí.

Přehled úkolů v administraci Testy obou administrací se mírně lišily, vzhledem k jejich funkcionalitě a názvosloví. Podstata testu však byla u obou služeb stejná. Účastníci testu měli za úkol provést: 

Spuštění prohlížeče.



Vstoupení na stránky dané služby.



Založení webu.



Vložení předem zadaného obsahu na stránky.



Odhlášení a vypnutí prohlížeče.

44

Průběh testů administrací Níže se nachází soupis průběhu testů rozdělených podle testovaných služeb a jednotlivých úkolů. Každý účastník testu testoval pouze jednu administraci, aby nebyl ovlivněn znalostmi z druhé administrace.

Eshoprychle.cz

Expertní analýza prokázala relativně dobrou přístupnost administrační části služby eshoprychle.cz, zásadní problém byl však shledán při vytváření stránek, což potvrdil i pilotní test. Zadání zachycuje příloha č. 13. 

Vstup na stránky – Bez potíží.



Kliknutí na založení stránek – Bez rady moderátora by se nepodařilo, což potvrzuje závěr expertní analýzy a pilotního testu.



Zadání domény, emailu a hesla při vytváření – Bez potíží.



Odeslání vytvářecího formuláře – Platí stejné jako u kliknutí na založení stránek.



Vstoupení do administrace – Bez potíží.



Nechat si zobrazit stránky – Nejednoznačnost terminologie (problém použitelnosti, ne přístupnosti).



Vložení textu – Zabralo hodně času. Pomocí klasického textového pole nešel text vložit, bylo nutné použít HTML mód.



Vložení produktu – V pořádku. Sice musel dlouho číst všechny popisky, ale to není chyba přístupnosti.



Odhlášení – Bez potíží.

Webgarden.cz

Expertní analýza prokázala, že administrace služby není přístupná. Webgarden.cz však nabízí plnohodnotnou mobilní editace, jejíž přístupnost je výrazně lepší. Testy s uživatelem tedy probíhaly pomocí klasického notebooku, avšak na mobilní verzi 45

administrace, která neobsahuje AJAX a javascript. Zadání úkolů pro administraci webgarden.cz zobrazuje příloha č. 14. 

Vstup na stránky – Bez potíží.



Kliknutí na založení stránek – Bez potíží.



Zadání domény, emailu a hesla při vytváření – Bez potíží.



Odeslání vytvářecího formuláře – Bez potíží.



Vstoupení do administrace – Bez potíží.



Nechat si zobrazit stránky – Tento úkol byl z časových důvodů přeskočen.



Vložení textu – Zabralo více času – účastník si nechal číst celou stránku – nejedná se však o chybu přístupnosti.



Vložení produktu – Bez rady moderátory by nebyl schopen úkol dokončit. Vložení produktu nabízí velké množství možností a účastník byl zmaten. S pomocí však úkol dokončil.



Odhlášení – Bez potíží.

Přehled úkolů na vytvořených stránkách Přístupnost vytvořených stránek byla testována již pro všech 5 služeb. Bylo tedy vytvořeno 5 testovacích stránek, každá pomocí jedné ze služeb. K testování bylo vybráno celkem 10 prvků, jednalo se, stejně jako u expertní analýzy, o: I. II.

Text – nalezení a přečtení. Fotografie – nalezení a přečtení alternativního popisku.

III.

Anketa – provést hlasování.

IV.

PDF soubor – nalezení a stáhnutí.

V. VI. VII. VIII. IX. X.

Přihlašovací formulář – nalezení a přihlášení. Video – nalezení a spuštění. Formulář pro odeslání vzkazu – nalezení a odeslání vzkazu. Vyhledávání – nalezení a vyhledání výrazu. Nákupní košík – vstoupení do košíku. Koupení výrobku – nakoupení výrobku.

46

V tomto případě byly pro každou stránku vyhrazeny vždy 2 úkoly, aby účastník neprováděl stejný úkol na více stránkách, a některé ze stránek tak nebyly znevýhodněny. Aby bylo zamezeno jakémukoliv zvýhodňování nebo znevýhodňování některých služeb, každý účastník vždy prováděl úkoly na jiných stránkách. Pro ilustraci – jeden uživatel by testoval na službě webmium.com úkoly I a VI, druhý úkoly II a VII. Zadání úkolů pro testování přístupnosti stránek zachycuje příloha č. 15.

Průběh testů na vytvořených stránkách Účastník testu číslo 1 plnil na službě byznysweb.cz úkoly V a X. S přihlášením (úkol V) neměl žádný problém, ale koupení výrobku (X) mu zabralo hodně času. Nejednalo se však o chyby přístupnosti. Na stránce vytvořené pomocí eshoprychle.cz řešil úkoly II a III a ani s jedním neměl potíže. U webgarden.cz měl plnit úkoly IV a VII a také je zvládl v pořádku. Na službě webmium.com měl účastník testu nalézt telefonní číslo, což zvládl. Dále měl spustit video, což se mu ovšem nepovedlo, jelikož jeho čtečka (window eyes) nedokázala prvek nalézt. U poslední služby webnode.cz měl použít vyhledávání a vstoupit do košíku a to se mu povedlo.

Účastník číslo 2 splnil úkoly VIII a IX na byznysweb.cz, I a II na eshoprychle.cz, IV a V na webgarden.cz, VI a VII na webmium.com, a III a X na webnode.cz. Ani jeden z úkolů mu nepůsobil sebemenší potíže.

Post dotazník Jakmile účastník dokončí všechny úlohy, moderátor s ním vyplní post dotazník. Testy odhalily objektivní problémy, v dotazníku je důležitý spíš subjektivní názor účastníka testu. Celý post dotazník se nachází v příloze č. 16. Níže se nachází krátké shrnutí post dotazníků.

47

Eshoprychle.cz

Účastníkovi testu přišla administrace složitá z hlediska struktury a částečně zmatená. Největší potíže mu působilo vytvoření stránek a také přílišná strukturovanost administrace. Ocenil by více headingů (nadpisů), protože bez nich se mu těžko orientuje. O používání služby bude do budoucna uvažovat, podívá se ještě na konkurenční služby.

Webgarden.cz

Účastník označil administraci za intuitivní. Prohlásil, že na to, že službu viděl poprvé, mu připadala slušná. Kladně hodnotil přítomnost nadpisů, protože jsou to první, co hledá. Naopak mu v administraci chyběly popisy formulářových polí. Službu by rád používal, bohužel však zatím neví, co by mohl publikovat.

Analýza plnění testů U služby eshoprychle.cz byl pro účastníka testu zásadní problém s vytvořením stránky, kdy hned tlačítko pro vytvoření webu není přístupné a hned potom tlačítko pro odeslání formuláře s doménou, emailem a heslem také není přístupné. Testování administrace dopadlo mnohem lépe, kdy jediným problémem pro účastníka bylo vložení textu – musel přepnout na HTML mód. U webgarden.cz účastník při vytváření webu nenarazil na závažnější problém, pouze několik menších (překlepy, některá formulářová pole špatně popsána, některé prvky nepřeloženy do češtiny). Větší problém byl u vložení produktu, kdy by bez pomoci moderátora nebyl schopen úkol dokončit. Chyby přístupnosti administrací zjištěné během testů s uživatelem zachycuje tabulka č. 15.

48

Tabulka č. 15: Porovnání chyb přístupnosti administrací eshoprychle.cz a webgarden.cz

Chyba / služba

eshoprychle.cz

webgarden.cz

X

0

0

R

2

1

Č

1

1

M

0

0

celkem

3

2

vážený průměr

2

1,25

Poznámka: X = úkol nepovedlo dokončit, R = úkol dokončen s pomocí moderátora, Č = úkol zabral hodně času, M = úkol způsobil malé potíže Poznámka 2: Vyhodnocení používá stejné parametry jako hodnocení použitelnosti v kapitole 4.2.11

Testy s uživatelem stránek vytvořených pomocí daných 5 služeb dopadly velice dobře. Z 20 otestovaných prvků jich 18 bylo bez jakýchkoliv potíží a pouze 2 potíže způsobily. Z toho jedna nebyla chyba přístupnosti (uživateli trvalo příliš dlouho koupit výrobek), a druhá by se dala označit spíš za chybu konkrétní čtečky, jelikož video jiné čtečky přečíst dokázaly.

Vyhodnocení testování s uživatelem Pro testování přístupnosti administrací byly na základě expertní analýzy vybrány pouze eshoprychle.cz a mobilní verze webgarden.cz. Ostatní služby byly označeny za nepřístupné. Pilotní test a test s uživatelem prokázal u eshoprychle.cz velký problém přístupnosti při vytváření webu. Tlačítko pro vytvoření je reprezentováno obrázkem na pozadí, který nemá pochopitelně alternativní popisek. V takovém případě je pro zrakově hendikepovaného uživatele téměř nemožné daný prvek identifikovat a správně použít. Další závažný problém nastane při zadávání domény, emailu a hesla, kdy tlačítko pro odeslání je reprezentováno obrázkem sice s alternativním popiskem, ale odkaz je na něj

49

navázán pomocí javascriptu, takže zrakově postižený uživatel nezjistí, že se jedná o odkaz. Samotná administrace je potom, co se přístupnosti týče, mnohem lepší. Během testů byla zjištěna pouze jedna nejednoznačnost v terminologii (nejedná se však o porušení pravidel přístupnosti) a potom chyba u vkládání textu na stránku, kdy uživatel musel použít místo klasického módu HTML mód. Zde se však mohlo jednat pouze o nekompatibilitu staršího prohlížeče (Mozilla Firefox 3.6) s méně rozšířenou čtečkou obrazu (window eyes). Zároveň uživateli v administraci chyběly vhodně vyplněné nadpisy. U služby webgarden.cz test s uživatelem neprokázal žádné zásadní problémy v přístupnosti. Uživatel narazil na několik nepopsaných (nebo špatně popsaných) formulářových polí, několik chybějících nadpisů, ale i on sám byl s administrací relativně spokojen. Největší problém tak nastal, když měl vložit na stránku produkt. Špatně popsaná formulářové pole, nejednoznačnost některých termínů a několik nepřeložených popisků obrázků měly za následek zmatení účastníka testu a musela mu být poskytnuta rada od moderátora. Porovnání chyb přístupnosti administrací zachycuje graf č. 5.

50

Graf č. 5: Porovnání chyb přístupnosti administrací eshoprychle.cz a webgarden.cz

X 0

2

R

Č

1

1

1

M 0

eshoprychle.cz

webgarden.cz


Dvacet testů jednotlivých prvků s uživatelem na stránkách pomocí služeb vytvořených neodhalilo ani jedno porušení proti pravidlům přístupnosti. Z tohoto pohledu tedy není možné nic vytknout.

5.3 Vyhodnocení přístupnosti Expertní analýza administračních rozhraní prokázala, že služby byznysweb.cz, webmium.com a webnode.cz jsou nepřístupné. Otestovány byly tedy pouze eshoprychle.cz a webgarden.cz (mobilní verze). Shledáno bylo hned několik prohřešků proti přístupnosti, což se však úplně nepotvrdilo při testech s uživateli. Zrakově postižení uživatelé jsou totiž evidentně bohužel zvyklí na nepřístupné stránky, a naučili se v takových případech pomoci si sami. Například pokud narazili na nepopsané formulářové pole, snažili se hledat všude možně okolo a zjistit jeho význam. Stejně tak u obrázků, pokud neměly vyplněny alternativní popisky, se snažili jeho obsah určit 51

například pomocí jeho url. Některé informace dokázali vytušit z kontextu stránky. Když narazili na nepopsaný odkaz, zkontrolovali co je před ním a co je za ním a většinou dokázali jeho význam odhadnout. Během testování vytvořených stránek bylo opět nalezeno několik chyb z hlediska přístupnosti, uživatelé s nimi však ve většině případů dokázali poradit, a sami testované stránky ohodnotili velice kladně. Faktem ovšem je, že účastníci, kteří se zúčastnili testování přístupnosti, byli odborníky na informační technologie a jejich znalosti tak silně převyšují běžného uživatele internetu.

52

6 Diskuze Všech pět služeb bylo otestováno na použitelnost i přístupnost. Testy nejprve proběhly expertní analýzou a následně s uživatelem. Vyhodnocení testů použitelnosti zařadilo na první místo webnode.cz, na druhé eshoprychle.cz, na třetí webgarden.cz a na čtvrté byznysweb.cz. Sami uživatelé ovšem na první místo určili eshoprychle.cz, na druhé webgarden.cz, na třetí webnode.cz a na čtvrté byznysweb.cz. Pokud by se tyto dva výsledky zprůměrovaly, nejpoužitelnějšími službami by se na děleném prvním místě staly služby eshoprychle.cz, webgarden.cz a webnode.cz. Až za nimi by se umístil byznysweb.cz a mimo pořadí potom webmium.com. Během testů přístupnosti bylo zjištěno, že služby byznysweb.cz, webmium.com a webnode.cz nemají přístupné administrace. Otestovány byly tedy dále jen administrační rozhraní eshoprychle.cz a webgarden.cz. Eshoprychle.cz má sice obrovské chyby při zakládání stránek, na rozdíl od webgarden.cz má však zase méně chyb v samotné administraci. Přístupnosti stránek pomocí těchto služeb vytvořených dopadly relativně podobně. Žádná ze stránek nebyla úplně v pořádku, ale na druhou stranu všechny dopadly (i podle názoru zrakově postižených účastníků testu) dobře. Nejpřístupnějšími službami jsou tedy na děleném prvním místě eshoprychle.cz a webgarden.cz, za nimi na děleném druhém místě byznysweb.cz, webmium.com a webnode.cz. S přihlédnutím k výsledkům použitelnosti a přístupnosti by celkové pořadí bylo následující: na děleném prvním místě eshoprychle.cz a webgarden.cz, na třetím místě webnode.cz a na čtvrtém byznysweb.cz. Webmium.com vzhledem k funkcionalitě není možné do pořadí objektivně zahrnout. Byznysweb.cz dopadl ve všech testech nejhůře. Při testech použitelnosti s uživateli skončil na posledním místě, sami uživatelé ho hodnotili nejhůře a jeho administrace není přístupná pro ovládání z klávesnice. Eshoprychle.cz, i když má administrační rozhraní podobné byznysweb.cz, dopadl jak v testech použitelnosti, tak přístupnosti velice dobře. Celkově se umístil na děleném 53

prvním místě. Hlavní vadou je však nepřístupné vytvoření webu, které zrakově postiženému uživateli v podstatě znemožní službu používat, i když sama administrace je přístupná. Na děleném prvním místě se umístila i služba webgarden.cz, která má největší možnost flexibility stránky, což se ovšem odráží v horší použitelnosti. Administrační rozhraní přístupné nemá, ale nabízí plnohodnotnou odlehčenou verzi, která funguje bez AJAXu a javasrciptu a její přístupnost je relativně dobrá. Webmium.com bohužel nedosahuje funkcionality ostatních služeb, jeho použitelnost je však hlavně z tohoto důvodu velice dobrá. Přístupné však bohužel není vůbec, protože používá tzv. on page editaci, kterou čtečka nedokáže přečíst a také není ovladatelná z klávesnice. Služba webnode.cz skončila v testech na prvním místě, uživatelé ji však zařadili až na předposlední místo. U přístupnosti platí to samé co u předchozí služby. On page editace není přístupná.

54

7 Závěr Cíl práce „Testování online nástrojů pro tvorbu internetových stránek“ byl jednoznačný – otestovat expertní analýzou a následně testy s uživateli funkčnost, použitelnost a přístupnost pěti webových nástrojů na tvorbu internetových stránek. Konkrétně se jednalo o byznysweb.cz, eshoprychle.cz, webgarden.cz, webmium.com a webnode.cz. Byla otestována použitelnost administračních rozhraní jednotlivých služeb, analyzovány chyby, výsledky kvantifikovány a porovnány. Stejně tak byla otestována přístupnost administrací daných služeb a webových stránek pomocí těchto služeb vytvořených. Chyby přístupnosti byly opět shrnuty a vyhodnoceny. Na základě testování byly v závěrečné diskuzi porovnány jednotlivé služby a určeny jejich výhody a nevýhody. Na konci bylo sestaveno pořadí služeb podle výsledků testování.

7.1 Další pokračování práce Na první blok pojednávající o použitelnosti testovaných služeb by bylo vhodné navázat A/B (případně multivarietním) testováním. Pro každou nalezenou chybu by vzniklo několik variant možného vylepšení, a pomocí zmíněných testování (převážně s uživateli) by se vybrala nejvhodnější varianta. Vybranou variantou by se nahradilo chybné místo a každá služba by se tak postupně stávala použitelnější. Druhý blok zaměřující se na přístupnost by bylo dobré rozšířit o konkrétní změny v kódu, které by vedly k lepší přístupnosti jak administračních rozhraní, tak vytvořených služeb. Zároveň by měla být navržena přístupná alternativa k administracím služeb webmium.com a webnode.cz, jejichž administrace jsou pro hendikepované uživatele naprosto nepřístupné.

55

56

8 Literatura [1] W. M. Newman, M. G. Lamming: Interactive System Design. Addison-Wesley, 1995. [2] Dr. Jonathan Lazar, Dr. Jinjuan Heidi Feng, Dr. Harry Hochheiser: Research Methods in Human-Computer Interaction. John Wiley & Sons, 2010. [3] J. Dumas, B. Loring: Moderating Usability Test. Morgan Kaufmann, 2008. [4] M. Kuniavsky: Observing the User Experience. Morgan Kaufmann, 2003. [5] F. Zwyrtek: Návrh heuristik pro měření použitelnosti webových stránek. Diplomová práce. Masarykova univerzita, Fakulta informatiky, Brno 2010. Dostupné z: http://is.muni.cz/th/139559/fi_m/diplomova_prace.pdf. [6] I. Hodžová: Uživatelské testování webu a katalogu knihovny. Diplomová práce. Masarykova

univerzita,

Filozofická

fakulta,

Brno

2012.

Dostupné

z:

http://is.muni.cz/th/384561/ff_m/diplomka.pdf. [7] B. Ježková: Testování použitelnosti webových stránek vybraných měst a obcí. Bakalářská práce. Masarykova univerzita, Filozofická fakulta. Brno 2009. Dostupné z: http://is.muni.cz/th/217841/ff_b/Bakalarska_prace.pdf. [8] J. C. Fagan, M. Mandernach, C. S. Nelson, J. R. Paulo, G. Saunders: Usability Test Results for a Discovery Tool in an Academic Library. Harrisonburg, 2012. Dostupné z: http://ejournals.bc.edu/ojs/index.php/ital/article/viewFile/1855/1745. [9] D. Lunn, S. Harper, S. Bechhofer: Identifying Behavioral Strategies of Visually Impaired Users to Improve Access to Web Content. Manchester, 2011. Dostupné z: http://doi.acm.org/10.1145/1952388.1952390. [10] V. Trpák: Testování přístupnosti stránek státní správy České republiky. Bakalářská práce. České vysoké učení technické v Praze, Fakulta elektrotechnická, Praha 2012. Dostupné z: https://dip.felk.cvut.cz/browse/pdfcache/trpakvac_2012bach.pdf. [11] J. Balata: Systém pro podporu turistiky zrakově postižených. Diplomová práce. České vysoké učení technické v Praze, Fakulta elektrotechnická, Praha 2011. Dostupné z: https://dip.felk.cvut.cz/browse/pdfcache/balatjan_2011dipl.pdf.

57

[12] D. Špinar, V. Saur, J. Ráček, D. Némethová, J. Hřebíček, M. Hejč, H. Bubeníčková, R. Pavlíček: Přístupnost webových stránek orgánů státní správy. Brno, 2007. Dostupné z: http://www.pravidla-pristupnosti.cz/att/publikace.pdf. [13] J. Nielsen: Usability Engineering. Morgan Kaufmann 1993. [14] A. M. Graziano, M. L. Raulin: Research methods: A Process of Inquiry. Pearson Higher 2012.

58

9 Seznam příloh Příloha č. 1: Heuristika podle Jakoba Nielsena (1995) Příloha č. 2: Předloha stránky (wireframe) pro expertní analýzu - použitelnost Příloha č. 3: Screener - použitelnost Příloha č. 4: Pre-test dotazník - použitelnost Příloha č. 5: Zadání testu s uživatelem pro byznysweb.cz - použitelnost Příloha č. 6: Zadání testu s uživatelem pro eshoprychle.cz - použitelnost Příloha č. 7: Zadání testu s uživatelem pro webgarden.cz - použitelnost Příloha č. 8: Zadání testu s uživatelem pro webmium.com - použitelnost Příloha č. 9: Zadání testu s uživatelem pro webnode.cz - použitelnost Příloha č. 10: Post dotazník - použitelnost Příloha č. 11 Tabulky vyhodnocení post dotazníku – použitelnost Příloha č. 12: Pre-test dotazník - přístupnost Příloha č. 13: Zadání testu s uživatelem pro eshoprychle.cz – přístupnost Příloha č. 14: Zadání testu s uživatelem pro webgarden.cz – přístupnost Příloha č. 15: Zadání testu pro vytvořené webové stránky Příloha č. 16: Post dotazník – přístupnost

59

60

10 Přílohy 10.1 Příloha č. 1: Heuristika podle Jakoba Nielsena (1995) 1. Visibility of system status The system should always keep users informed about what is going on, through appropriate feedback within reasonable time. 2. Match between system and the real world The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order. 3. User control and freedom Users often choose system functions by mistake and will need

a clearly marked

"emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo. 4. Consistency and standards Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions. 5. Error prevention Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action. 6. Recognition rather than recall Minimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another.

61

Instructions for use of the system should be visible or easily retrievable whenever appropriate. 7. Flexibility and efficiency of use Accelerators -- unseen by the novice user -- may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions. 8. Aesthetic and minimalist design Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility. 9. Help users recognize, diagnose, and recover from errors Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution. 10. Help and documentation Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large. Zdroj: Nielsen Norman Group: 10 Usability Heuristics. [online]. [cit. 2013-01-05]. Dostupné z: http://www.nngroup.com/articles/ten-usability-heuristics/

62

10.2 Příloha č. 2: Předloha stránky (wireframe) pro expertní analýzu - použitelnost

63

10.3 Příloha č. 3: Screener - použitelnost Screener

1. Pohlaví

2. Věk

Muž – Žena

< 20 20 – 29 30 – 39 > 40

3. Povolání / obor činnosti

4. Jak často používáte internet?  (Téměř) denně  Několikrát týdně  Jednou týdně  Méně než jednou týdně  (Prakticky) vůbec

5. Jaké jsou vaše znalosti webových technologií (např. HTML, CSS, PHP)  Nevím, o co se jedná  Znám zmíněné pojmy, ale neovládám je  Jsem v tomto oboru začátečník  Jsem schopen tyto technologie používat  Pracuji v tomto oboru

64

10.4 Příloha č. 4: Pre-test dotazník - použitelnost Pre-test dotazník 1. Jak často používáte internet?

2. K čemu používáte internet?      

Zábava Hry Vzdělávání Práce Komunikace Zprávy

3. Uměl(a) byste vysvětlit následující pojmy (ve spojení s internetem)?     

panel url doména vyhledávač kódování

ano – ne ano – ne ano – ne ano – ne ano – ne

4. Použili jste již někdy službu, která umožňuje vytvoření webových stránek? Pokud ano, kterou?

5. Publikoval(a) jste někdy obsah na internetu? Pokud ano, kde a jakým způsobem? O jaký obsah se jednalo?

6. Jaký preferujete webový prohlížeč a proč?

7. Už jste se někdy zúčastnil(a) testování softwaru? 65

10.5 Příloha č. 5: Zadání testu s uživatelem pro byznysweb.cz - použitelnost Prosíme, proveďte následující úkoly. Na začátku každého z nich přečtěte nahlas jeho číslo a pečlivě si pročtěte celé zadání. Pokud Vám bude zadání úkolu nejasné, zeptejte se moderátora.

1. Spuštění prohlížeče, vstup na stránky  

Spusťte internetový prohlížeč Google Chrome. Vstupte na stránky http://www.byznysweb.cz.

2. Založení stránek    

Na dané stránce si založte stránky. Název domény, e-mail a heslo, které máte použít při zakládání, jste obdrželi na zvláštním listu. Přejděte do editace stránek. Nechte si stránky zobrazit.

3. Upravení stránek 

Smažte nechtěný obsah a upravte stránky podle předlohy: i. ii. iii. iv. v. vi. vii. viii. ix. x.



Banner. Menu. Nadpis. Text. Obrázky. Anketa. Formulář. Přihlašování. Nákupní košík. Produkt.

Veškeré potřebné obrázky a texty máte připraveny ve složce Web, kterou najdete na ploše.

4. Ukončení  

Odhlaste se. Vypněte prohlížeč.

66

67

10.6 Příloha č. 6: Zadání testu s uživatelem pro eshoprychle.cz - použitelnost Prosíme, proveďte následující úkoly. Na začátku každého z nich přečtěte nahlas jeho číslo a pečlivě si pročtěte celé zadání. Pokud Vám bude zadání úkolu nejasné, zeptejte se moderátora.


Spusťte internetový prohlížeč Google Chrome. Vstupte na stránky http://www.eshoprychle.cz.

2. Založení stránek     

Na dané stránce si založte stránky. Název domény, e-mail a heslo, které máte použít při zakládání, jste obdrželi na zvláštním listu. Položky menu nastavte podle předlohy. Přejděte do editace stránek. Nechte si stránky zobrazit.


Smažte nechtěný obsah a upravte stránky podle předlohy: i. ii. iii. iv. v. vi. vii.



Banner. Nadpis. Text. Obrázky. Přihlašování. Nákupní košík. Produkt.




68

69

10.7 Příloha č. 7: Zadání testu s uživatelem pro webgarden.cz - použitelnost Prosíme, proveďte následující úkoly. Na začátku každého z nich přečtěte nahlas jeho číslo a pečlivě si pročtěte celé zadání. Pokud Vám bude zadání úkolu nejasné, zeptejte se moderátora.


Spusťte internetový prohlížeč Google Chrome. Vstupte na stránky http://www.webgarden.cz.




Smažte nechtěný obsah a upravte stránky podle předlohy: i. ii. iii. iv. v. vi. vii. viii. ix. x.



Banner. Menu. Nadpis. Text. Obrázky. Anketa. Formulář. Přihlašování. Nákupní košík. Produkt.




70

71

10.8 Příloha č. 8: Zadání testu s uživatelem pro webmium.com - použitelnost Prosíme, proveďte následující úkoly. Na začátku každého z nich přečtěte nahlas jeho číslo a pečlivě si pročtěte celé zadání. Pokud Vám bude zadání úkolu nejasné, zeptejte se moderátora.


Spusťte internetový prohlížeč Google Chrome. Vstupte na stránky http://www.webmium.com.




Smažte nechtěný obsah a upravte stránky podle předlohy: i. ii. iii. iv. v. vi. vii.



Banner. Menu. Nadpis. Text. Obrázky. Formulář. Kontakt.




72

73

10.9 Příloha č. 9: Zadání testu s uživatelem pro webnode.cz - použitelnost Prosíme, proveďte následující úkoly. Na začátku každého z nich přečtěte nahlas jeho číslo a pečlivě si pročtěte celé zadání. Pokud Vám bude zadání úkolu nejasné, zeptejte se moderátora.


Spusťte internetový prohlížeč Google Chrome. Vstupte na stránky http://www.webnode.cz.




Smažte nechtěný obsah a upravte stránky podle předlohy: i. ii. iii. iv. v. vi. vii. viii. ix.



Banner. Menu. Nadpis. Text. Obrázky. Anketa. Formulář. Nákupní košík. Produkt.




74

75

10.10

Příloha č. 10: Post dotazník - použitelnost

Post dotazník Prosím, vyplňte následující údaje. 1 znamená naprosto souhlasím, 5 naprosto nesouhlasím. 1. Myslím, že bych tuto službu pravidelně využíval 1 2 3

4

5

2. Službu jsem shledal zbytečně složitou 1 2 3

4

5

3. Myslím, že služba byla uživatelsky příjemná 1 2 3

4

5

4. Myslím, že bych potřeboval pomoc technicky zdatného člověka, abych mohl službu používat 1 2 3 4 5 5. Ve službě jsou velmi dobře zahrnuty rozlišné funkce 1 2 3

4

5

6. Myslím, že tato služba obsahuje mnoho nejednoznačností 1 2 3 4

5

7. Podle mě by se většina lidí naučila tuto službu využívat velice rychle 1 2 3 4

5

8. Služba na mne uživatelsky působila velice nemotorným dojmem 1 2 3 4

5

9. Službu jsem ovládal velmi jistě 1 2

5

3

4

10. Potřeboval bych se hodně učit, než bych mohl začít pracovat s touto službou 1 2 3 4 5

76

Příloha č. 11 Tabulky vyhodnocení post

10.11

dotazníku – použitelnost Tabulka č. 16: Vyhodnocení služby byznysweb.cz

Otázka / účastník

1

2

3

4

5

průměr

1

5

4

3

4

3

3,8

2

1

2

2

1

1

1,4

3

5

3

3

4

4

3,8

4

1

2

2

5

4

2,8

5

5

2

3

3

3

3,2

6

1

1

2

2

2

1,6

7

5

1

2

3

2

2,6

8

1

2

2

1

1

1,4

9

5

5

4

4

5

4,6

10

1

2

2

5

4

2,8

Tabulka č. 17: Vyhodnocení služby eshoprychle.cz


1

2

3

4

5

průměr

1

5

3

3

4

3

3,6

2

1

4

5

1

3

2,8

3

5

2

1

5

2

3

4

2

3

4

4

2

3

5

5

3

2

4

3

3,4

6

1

4

5

1

2

2,6

7

4

2

1

4

1

2,4

8

1

3

5

1

5

3

9

5

4

2

5

5

4,2

10

1

3

5

2

3

2,8

77

Tabulka č. 18: Vyhodnocení služby webgarden.cz


1

2

3

4

5

průměr

1

5

3

3

2

2

3

2

2

2

1

3

4

2,4

3

4

3

4

2

2

3

4

2

2

2

3

3

2,4

5

4

3

2

3

2

2,8

6

2

2

1

3

4

2,4

7

4

4

3

2

1

2,8

8

1

3

1

4

5

2,8

9

4

4

4

3

4

3,8

10

2

1

2

3

5

2,6

Tabulka č. 19: Vyhodnocení služby webmium.com


1

2

3

4

5

průměr

1

1

1

3

4

3

2,4

2

2

5

2

5

3

3,4

3

3

1

4

4

2

2,8

4

3

5

1

3

4

3,2

5

2

2

4

5

3

3,2

6

1

4

1

2

3

2,2

7

3

1

3

3

2

2,4

8

2

5

2

2

4

3

9

4

2

5

3

4

3,6

10

2

5

3

4

5

3,8

78

Tabulka č. 20: Vyhodnocení služby webnode.cz


1

2

3

4

5

průměr

1

4

5

3

4

2

3,6

2

3

1

3

2

4

2,6

3

4

4

2

4

2

3,2

4

3

1

2

3

1

2

5

4

4

3

4

2

3,4

6

1

1

1

2

3

1,6

7

2

5

4

4

2

3,4

8

2

1

3

2

4

2,4

9

4

5

5

4

4

4,4

10

3

3

3

4

1

2,8

79

Příloha č. 12: Pre-test dotazník - přístupnost

10.12

Pre-test dotazník 1. Pohlaví 2. Věk

Muž – Žena < 20 20 – 29 30 – 39 40 – 49 50 – 59 60 – 69 70 – 79 > 80

3. Jaké je Vaše zrakové postižení? Jak dlouho ho máte? 4. Povolání / obor činnosti 5. Jak často používáte internet?     

(Téměř) denně Několikrát týdně Jednou týdně Méně než jednou týdně (Prakticky) vůbec

6. K čemu používáte internet? 7. Jaký druh obsahu vyhledáváte na internetu?

8. Je pro Vás zajímavé sdílet obsah na internetu pomocí vytvoření webových stránek? 80

9. Publikoval(a) jste někdy obsah na internetu? Pokud ano, kde a jakým způsobem? O jaký obsah se jednalo?

10. Použili jste již někdy službu, která umožňuje vytvoření webových stránek? Pokud ano, kterou?

11. Jaký preferujete webový prohlížeč a proč?

12. Jakou používáte čtečku obrazovky a proč?

13. Už jste se někdy zúčastnil(a) testování softwaru?

81

10.13

Příloha č. 13: Zadání testu s uživatelem pro

eshoprychle.cz – přístupnost Prosíme, proveďte následující úkoly. Pokud Vám bude zadání úkolu nejasné, zeptejte se moderátora.


Spusťte internetový prohlížeč. Vstupte na stránky http://www.eshoprychle.cz.

2. Založení stránek     

Na dané stránce si založte stránky. Název domény, e-mail a heslo, které máte použít při zakládání, si v daný moment vyžádejte od moderátora. Položky menu nastavte podle předlohy. Přejděte do editace stránek. Nechte si stránky zobrazit.

3. Upravení stránek      

Vložte na úvodní stranu text: „Moje stránka o letadlech“. Vytvořte produkt s názvem „Letadlo“ a umístěte ho na úvodní stranu. Vložte na úvodní stranu libovolnou fotografii ze svého počítače. Pokud žádnou nemáte, stáhněte ji z goo.gl/lsJ2a. Změňte titulek webu na „Letadla“. Pokud stránka titulek nemá, tak ho vytvořte. Zjistěte, kolik návštěvníků na stránky již zavítalo. Změňte přihlašovací heslo.

4. Ukončení 

Odhlaste se.

82

10.14

Příloha č. 14: Zadání testu s uživatelem pro

webgarden.cz – přístupnost Prosíme, proveďte následující úkoly. Pokud Vám bude zadání úkolu nejasné, zeptejte se moderátora.


Spusťte internetový prohlížeč. Vstupte na stránky http://www.m.webgarden.cz.


Na dané stránce si založte stránky. Název domény, e-mail a heslo, které máte použít při zakládání, si v daný moment vyžádejte od moderátora. Přejděte do editace stránek. Nechte si stránky zobrazit.

3. Upravení stránek      

Vložte na úvodní stranu text: „Moje stránka o letadlech“. Vytvořte produkt s názvem „Letadlo“, cenou 2000 Kč a umístěte ho na úvodní stranu. Vložte na úvodní stranu libovolnou fotografii ze svého počítače. Pokud žádnou nemáte, stáhněte ji z goo.gl/lsJ2a. Změňte titulek webu na „Letadla“. Pokud stránka titulek nemá, tak ho vytvořte. Zjistěte, kolik návštěvníků na stránky již zavítalo. Změňte přihlašovací heslo.

4. Ukončení 

Odhlaste se.

83

10.15

Příloha č. 15: Zadání testu pro vytvořené

webové stránky Prosíme, proveďte následující úkoly. Pokud Vám bude zadání úkolu nejasné, zeptejte se moderátora. 1. Představte si, že chcete autorovi stránek zatelefonovat. Nalezněte na stránkách telefonní číslo a přečtěte ho. 2. Na podstránce s názvem Letadla se nachází několik fotografií. Pokuste se zjistit, co je na nich zobrazeno. 3. Na úvodní stránce se pokuste libovolně zahlasovat v anketě. 4. Na stránkách se nachází aktuality ve formátu pdf ke stažení. Pokuste se soubor najít a stáhnout. 5. Pokuste se na stránkách najít přihlašovací formulář a následně se přihlásit pomocí údajů, které Vám zadá moderátor. 6. Na podstránce s názvem Letadla se nachází video. Pokuste se ho najít a spustit. 7. Pokuste se majiteli stránek odeslat vzkaz. 8. Zkuste na stránce najít vyhledávací políčko. 9. Pokuste se na stránce najít nákupní košík. 10. Zkuste na stránkách koupit libovolný výrobek.

84

10.16

Příloha č. 16: Post dotazník – přístupnost

1. Bylo pro Vás zadání jednotlivých úkolů srozumitelné?

2. Ohodnoťte prosím přístupnost testované administrace od 1 do 5 (jako ve škole). Hodnocení zdůvodněte.

3. Co Vám v administraci působilo největší potíže?

4. Je něco, co byste v administraci hodnotili kladně?

5. Co Vám v administraci chybělo (případně přebývalo)?

6. Budete uvažovat o používání této služby v budoucnu? Proč?

7. Která z 5 testovaných stránek Vám přišla nejlépe přístupná? Proč?

8. Která z 5 testovaných stránek Vám naopak přišla nejhůře přístupná? Proč?

85

86

11 Seznam použitých zkratek WCAG CSS PHP URL HTML W3C

Web Content Accessibility Guidelines (celosvětově respektovaná pravidla pro tvorbu bezbariérového webu) Cascading Style Sheets (kaskádové styly) Hypertext Preprocessor (skriptovací programovací jazyk) Uniform resource locator (jednotný lokátor znaků) HyperText Markup Language (hypertextový značkovací jazyk) The World Wide Web Consortium

87

88

12 Obsah přiloženého CD 

baumafra_bp_2013.docx – text práce ve zdrojovém formátu



baumafra_bp_2013.pdf – výsledný tištěný formát

89

Testování online nástrojů pro tvorbu internetových stránek

Recommend Documents