Použitelnost stránek
Hodně se o tom mluví, někdy až moc, ale málokdo si pod použitelností představí něco přesného. Já také nevím, co to použitelnost je, ale svoje představy jsem drze shrnul do tohoto textu.
Co je použitelnost stránek - Rozhodnutí pro použitelnost - Klíče použitelnosti - Jednoduchost - Odkazy a tlačítka - Rozmístění prvků - Kde to jsem - Respektujte uživatele - Testování použitelnosti - Další studium
Co je použitelnost stránek
Dobrá použitelnost mých stránek znamená, že:
- uživatelům (čtenářům) se podaří na mém webu udělat to, co chtějí. Např.
- najít informaci, pro kterou přišli
- najít můj mail
- přečíst si novinky
- zaregistrovat se
- objednat si zboží
- dokáží to v rozumném čase a bez velkého přemýšlení
- dokáží to bez chyb a zásadních zklamání
Na první pohled to není nic podstatného. Ale dobré weby se prosadily díky své použitelnosti, vezměte si třeba Google. Z nepoužitelných stránek naopak lidé raději odcházejí, aby si nepřipadali jako pitomci.
Anglicky se použitelnosti říká usability.
Přístupnost
Jiným pojmem je přístupnost, angl. accesibility. Vyjadřuje míru, s jakou dokážou s webem pracovat různě omezení uživatelé. Přístupnost se hodně spojuje s vozíčkáři (asi kvůli obrázkům), což je nepřesné. Přístupný web se dá ovládat třeba také bez myši, bez obrázků, na černobílém monitoru, z mobilu nebo z matfyzáckých laboratoří. Ale o přístupnosti jsem psát nechtěl, třebaže s použitelností souvisí.
Rozhodnutí pro použitelnost
Spousta lidí má nepoužitelné stránky. Nejčastějším důvodem je (překvapivě) to, že je moc použitelné nechtějí mít. Je to pýcha. Domnívají se, že jejich stránky jsou velmi dobré. Pokud je na takových stránkách něco nesmyslného nebo nepoužitelného, tak je to tam většinou schválně. "Uživatelé se přece musejí sami snažit, aby se k informacím dostali!" Jenže uživatelé jsou každou chvíli jedno klepnutí od uzavření prohlížeče. A jakmile jejich zmatení dosáhne určité úrovně, odcházejí jinam.
Naopak majitelé použitelných a vstřícných stránek tuší, že uživatelům je nutno hodně pomáhat. Můžete se pro to rozhodnout také. Je ale třeba překonat kus kreativní pýchy, protože stavba použitelných stránek většinou znamená zjednodušování.
Překvapení
Žádný uživatel vaší stránky tu stránku nepoužívá přesně tak, jak si myslíte. Žádní dva uživatelé nepoužívají web stejným způsobem. Prakticky každý, koho znám, dělá se stránkami trochu jiné věci. Tuto zkušenost potvrzují i experti.
Poproste někdy nějakého kamaráda, aby si sednul k vaší stránce a něco na ní udělal (našel, zaregistroval se apod.). Budete překvapeni, jak moc mu to dá práce. Je to dobré poučení. Pyšní webmasteři nad tímto faktem říkají: "ti kreténi BéEfÚčka neumějí ty stránky používat. Jsou úplně pitomí, posaďte k tomu někoho normálního". Kdopak se tu mýlí?
Klíče použitelnosti
- jednoduchost
- standardní ovládání, běžné na většině webů
- nenuťte uživatele přemýšlet
Jednoduchost
HTML a CSS jsou zlaté technologie. Stránky jsou dokumenty, ne programy. Kdo si moc hraje s obrázky, ten tvoří stránky jako umělecké dílo. To sice může vyvolat dobrý první dojem (pokud se to stihne natáhnout), ale dojem vydrží jen v případě, že se to dobře ovládá.
Jakmile někdo začne stránky moc programovat javascriptem, většinou z nich udělá nepoužitelný paskvil. Každé originální ovládání je neúspěšné jednoduše proto, že je originální. Nikdo s tím neumí a nechce se učit. Možná to zní moc tvrdě, ale taková je moje zkušenost. Zůstaňte u jednoduchosti.
Odkazy a tlačítka
Začneme něčím známým:
- na první pohled musí být vidět, na co se dá kliknout
- odkazy by měly být podtržené, protože na to jsou uživatelé zvyklí
- nad odkazem musí být ručička
- tlačítka by měla vypadat jako tlačítka (s plastickými okraji)
- pokud odkaz nebo tlačítko změní vzhled při přejetí myší, je to dobré, protože jsou na to uživatelé zvyklí.
To byla zatím pozitivní doporučení. Teď pár věcí, kterých se vyvarovat:
- nepodtrhávejte texty, které nejsou odkazy
- fakt je nepodtrhávejte nikdy, ani když jsou to nadpisy nebo superdůležitý text
- nedělejte tlačítkový vzhled u prvků, na které nejde kliknout
- pokud píšete o něčem, co už má stránku, dejte na to odkaz do textu, nespoléhejte se na to, že je ten odkaz v navigaci
Rozmístění prvků
Logo firmy nebo stránky patří do levého horního rohu každé stránky webu a kliká na hlavní stránku webu. Uživatelé jsou na to zvyklí. Zatímco ještě tak před rokem se spekulovalo o tom, jestli se to tak má dělat, dnes (podzim 2003) tvrdím, že cokoli jiného je hrubá chyba.
Vedle loga by měl být krátký text popisující poslání webu. Z textu by náhodný návštěvník měl být schopen poznat, čím se web nebo firma zabývá. Tomu krátkému textu se říká slogan.
Hledání se většinou dává doprava nahoru, ale ještě to není nezvratné pravidlo.
Poslední dobou si uživatelé zvykají na horní a levou navigaci. Vědí, že jsou tam odkazy na další stránky serveru. Zatímco horní navigaci chápou většinou jako společnou pro celý web, v levém sloupečku si častěji všimnou věci, která souvisí s aktuální stránkou. Přesto je spíše chybou dávat do levého (nebo pravého) sloupečku nějakou důležitou část textu stránky -- uživatelé by to přehlíželi.
V hlavním sloupečku čekají uživatelé text, který je unikátní jen pro tu kterou stránku. Na vrchu hlavního sloupečku očekávají uživatelé nadpis stránky. Co není v hlavním sloupečku, uživatelé velmi často ignorují. Pro tuto ideu nemám žádné spolehlivé měření, ale myslím si to hodně.
Takovýchhle pouček je víc a většinou je znáte. Třeba že odesílací tlačítko formuláře se dává dolu pod formulář. Určitě si na ta pravidla vzpomenete v praxi (a to je důležité).
Kde to jsem?
Pro zjištění, kde zrovna jsou, uživatelé používají tři věci:
- nadpis stránky
- drobečkovou navigaci
- titulek stránky
Nadpis stránky je nejdůležitější. Měl by být největším písmem v horní části textu. Pokud bude od textu nějak graficky oddělený (čára, jiná barva pozadí), je nebezpečí, že uživatel hned nepochopí, že jde o nadpis.
Drobečková nápověda je takové to Obsah > Služby > Květiny > Růže. Návštěvník stránky tak hned ví, kde je. Drobečková navigace je trochu náročná na údržbu, dobré redakční systémy by ji měly tvořit automaticky. Nemělo by to být moc velkým písmem. Nejlepším oddělovačem odkazů je znak >, všechny jiné (/|-[]) si uživatelé mohou splést. Drobečková navigace má smysl zejména na webech, které mají dobrou stromovou strukturu, nebo jsou extrémně rozsáhlé.
Titulek stránky je obsah tagu <title>, zobrazuje se v prohlížeči úplně nahoře v modrém pruhu. Uživatelé se podle něj orientují, zejména když pracují ve více oknech.
Jenom málokdo si všimne vysvícené položky v menu, ačkoli to dříve bývalo hlavní upozornění "tady jsi".
Proč je důležité, aby uživatel věděl, kde zrovna je?
- mohl se prostě ztratit
- používá více oken
- zrovna přišel z výsledků vyhledávače někam do hloubky serveru a potřebuje se zorientovat
Respektujte uživatele
Hodně lidí má nastavený prohlížeč a jeho okno tak, aby se jim s tím dobře pracovalo. Pokud se jim do toho začnete míchat (většinou javascriptem), tak sklidíte akorát nelibost.
Neotevírejte nová okna. Překvapilo mě, když jsem během různých školení zjistil, jak málo lidí ví, jak okna vlastně fungují. Nové okno hodně uživatelů zmate, neumějí se vrátit do toho původního (tlačítko zpět nefunguje). Obzvlášť velká prasárna je otevření nového okna do fullscreenu, to skoro nikdo neumí vypnout (alt F4).
Neměňte velikost oken. To javascriptem také jde a hodně lidí na to nadává.
Nezakazujte pravé tlačítko. Je to trapné. Zdrojové kódy stejně půjdou stáhnout tak jako tak.
Rozmyslete si barvení rolovací lišty. Téměř vždy je rušivé. Hodně často lidi zmate natolik, že nevědí, která část lišty ukazuje odrolovanou a která aktuální část dokumentu.
U rámů nechte uživatele, ať si je mohou přizpůsobit (nepoužívejte atribut noresize). Já si navíc třeba myslím, že rámy jsou špatně použitelné obecně.
Testování použitelnosti
Mimo oblast webových stránek je studium a testování použitelnosti normální průmyslové odvětví. Testují se letadla, auta, mobily (pročpak jen neumím ovládat svůj nový mobil?). Na internet vtrhla použitelnost jako obor teprve nedávno, až když si lidi začali všímat, jak blbě se jim s internetem dělá. V automobilkách mají na použitelnost celé týmy a standardy, za což se na internetu nechtělo nikomu utrácet (kromě největších gigantů). Naštěstí se stránky dají testovat laciněji.
O laciném testování použitelnosti pojednává celá pasáž výborné knihy Steve Kruga Nenuťte uživatele přemýšlet (v originále Don't Make Me Think). Testování spočívá v tom, že se nějaký dobrovolník posadí ke stránce a na stránce se mu zadá nějaký jednoduchý úkol. Natáčí se to na kameru, vývojový tým se na to v jiné místnosti dívá a nadává. Záznam se pak analyzuje a podle toho se předělávají stránky.
V českých poměrech znám ještě jednodušší testování použitelnosti. Vezměte si bráchu nebo ségru, posaďte je ke stránce, nemluvte jim do toho a nechte je na stránce něco udělat. Budete zpravidla zděšeni, jak je to pro ně nesrozumitelné a obtížné. Takové poučení je základ úspěchu.
Další studium
Do použitelnosti také patří něco o písmu, o pozadí a o barvách. Také se počítá srozumitelnost adres stránek. Nechám to všechno vašemu úsudku, v oblasti použitelnosti jde stejně hlavně o zkušenosti a o zdravý rozum.
Steve Krug: Nenuťte uživatele přemýšlet. Krásná tenká obrázková knížka, vydal CompeterPress 2003. Sranda a hodně informací.
Jakob Nielsen: Web Design. Oranžová, docela tlustá, vydal myslím SoftPress. Fundované, místy nudné. Je to i o přístupnosti.
Reklama
