Buďme k uživateli slušní
Zeptejme se prvním pádem. Kdo? My, weboví vývojáři. Co? Slušní. Proč? Protože jsme dobře vychováni.
Existuje spousta prohřešků proti použitelnosti, jejich malou podmnožinu osobně nazývám neslušnosti nebo chcete-li sprosťárny. Úmyslně na otázku „Kdo?“ odpovídám my, nikoliv vy. Sám se totiž některých neslušností vůči uživateli dopouštím. Pojďme se tedy na některé z nich podívat a zamyslet se nad jejich nápravou.
Pop-up okna
Nepoužívejme pop-up okna. Zasahujeme tím do uživatelova soukromí, pro nás je určeno jen jedno jediné okno prohlížeče. Je to jako vlézt někomu cizímu do bytu. Nedávno jsem viděl jednu blíže nejmenovanou aplikaci, která otevírala pop-up okno podle rozlišení monitoru. Nic horšího snad uživateli udělat nemůžeme.
- Špatně: Ali Baba Programuje (přidávání komentářů), Victoria (fotogalerie)
Pokud si pohráváme s myšlenkou pop-up okna, zeptejme se sami sebe: Je to nutné? Nedá se to udělat jinak? V 95 procentech případů to jinak jde.
- Chceme-li ukázat uživateli fotku ve větším rozlišení, raději přejdeme přímo na fotku nebo ji zobrazíme v okně nad aktuálním dokumentem. Inspirovat se můžeme v aplikacích, které zobrazování fotek rozumí nejlépe – ve webových fotoalbech: Picasa, Flickr, Lightbox2
- Chceme-li uživateli zobrazit nějaký obsah bez odchodu z aktuální stránky, načteme jej AJAXem do aktuální stránky nebo odkryjeme JavaScriptem obsah skrytý pomocí CSS. Taky to můžeme nechat na uživateli: ať si sám otevře nové okno, pokud to uzná za vhodné.
Samozřejmě existují výjimky, ale je jich právě jen těch 5%.
Nová okna
Neotvírejme odkazy v novém okně. Stejně jako předchozí případ je to zásah do uživatelova soukromí. Není snad jeho věc, jestli chce odkaz otevřít v novém okně? Že to uživatel neumí je jen výmluva, právě naše aplikace ho to může naučit.
Pro toto pravidlo opět existují výjimky, doporučuji článek Should Links Open In New Windows? na Smashing Magazine nebo The Top Ten Web Design Mistakes of 1999 od Jakoba Nielsena.
Změna velikosti okna
Neměňme uživateli velikost okna prohlížeče. Tento prohřešek je ze stejného soudku jako dva předcházející: Proč bychom to neměli dělat? Protože na to nemáme právo. Díky bohu je čím dál tím těžší na takovou stránku narazit.
- Špatně: Gymnázium Jana Nerudy
Ovládací prvky
„Nesahej na to, to ti nepatří,“ by nejspíš zařval uživatel Macu, kdyby seděl vedle webdesignera, který právě k elementu <select> přidal atribut style.
Neberme uživateli jeho standardní ovládací prvky. Tady, musím se přiznat, zápasím nejvíc, jak můžete vidět i na tomto blogu. Máme tendence přizpůsobovat ovládací prvky designu stránky a vymýšlet vlastní úžasné ovládací prvky. Všeho ale s mírou. Někde to může mít význam, ale pokud je to možné, používejme neostylovaná tlačítka, textboxy, selecty a checkboxy, které nám nabízí prohlížeč. Více se o tomto tématu rozepsali třeba David Grudl a Plaváček.
- Špatně: CineStar (barevný scrollbar v IE), Skullz Clothing (formulář), Galerie Plamínek (formulář)
- Správně: Google Search
URL
Neberme uživateli URL. URL znamená Unified Resource Location tedy volně přeloženo unikátní umístění zdroje. Vše, na co by chtěl uživatel poslat odkaz nebo si uložit do oblíbených položek, musí mít vlastní URL. Představte si, že máte webový obchod a ID produktu uchováváte třeba v session nebo v cookie místo abyste jej měli v URL. Nejen, že je to neslušné vůči uživatelům, je to zároveň nestravitelné pro vyhledávače.
- Špatně: Obchůdeček, Jízdní Řády, SBB, Ali Baba Programuje (chybějící odkazy na jednotlivé články)
- Správně: Mapy.cz, Kasa.cz
Sem bohužel spadají i fotogalerie, které zobrazují fotografie jen pomocí JavaScriptu. Pro běžného uživatele je pak nemožné odkaz na fotografii někomu poslat nebo si jej uložit do oblíbených položek.
Pokud navrhujeme aplikaci, dobře si promysleme, co do URL patří a co ne.
Tlačítko Zpět
Neberme uživateli funkci tlačítka Zpět, které sídlí v okně prohlížeče úplně vlevo nahoře. Úzce to souvisí s předchozím problémem, ale dodržení této zásady je ještě o chlup složitější. Uživatelé jsou zvyklí tlačítko Zpět využívat a je slušné jim ho poskytnout. A jak je o něj připravíme?
- Manipulujeme přímo s historií prohlížeče, posíláme uživatele JavaScriptem tam a zpět, jak se nám zamane.
- Provádíme jedno či více přesměrování pomocí JavaScriptu nebo meta tagu. Přál bych všem vidět bezradného uživatele, když se nemůže dostat v historii zpět, protože krok zpět znamená přesměrování vpřed. Jediné, co mu pak zbývá, je dvojklik na tlačítko zpět. Ne každý tento workaround ale zná.
- Používáme AJAX na místech, kde není vhodný. Uživatel má pak pocit, že přešel na další stránku, ale není tomu tak.
- Používáme AJAX na místě, kde je vhodný, ale neměníme URL, ačkoliv bychom mohli. Možná to už nespadá do neslušností vůči uživateli, přesto nám uživatel poděkuje, pokud mu URL poskytneme. O čem mluvím? O mapách od Seznamu. Při pohybu po mapách se mění URL, vždy se tedy uživatel může vrátit na předchozí pozici nebo někomu poslat odkaz na pozici aktuální.
- V aplikační vrstvě se snažíme zabránit bezstavovosti, ale neuchováváme historii ve stejném rozsahu jako prohlížeč. Při manipulaci s historií tak může uživatel přivést aplikační vrstvu do jiného stavu. Chci říci do stavu, se kterým si nedokáže poradit. Myslíte, že si vymýšlím? Věřte mi, není tomu tak.
- Špatně: jQuery Documentation (otevřít dokumentaci k nějaké metodě)
- Správně: Mapy.cz
Stručnost
Buďme struční. Ušetříme tím uživateli drahocenný čas. Nevážíme-li si uživatelova času, nevážíme si ani uživatele samotného. Na internetu je záplava informací a najít mezi nimi ty kvalitní je čím dál tím těžší. Víte vůbec, jak málo uživatelé na internetu čtou?
- Špatně: SM System, Holiday privats Mertlík
- Správně: Tomáš Pojeta, Phillip Toledano – Days with My Father
Jednoduchost
KISS. Stejně jako v případě stručnosti, pokud bude aplikace jednoduchá, ušetříme uživateli čas. Než začneme navrhovat aplikaci, popřemýšlejme, jestli by to nešlo jednodušeji. Pokud aplikace má být komplexní, skryjme uživateli komplexnost. Složitější funkcionalitu v základním nastavení schovejme nebo jasně zvýrazněme, co je podstatné. Nepřeplácávejme stránky zbytečnými informacemi, zkusme věci vymyslet jednodušeji.
- Špatně: Alza.cz, Amazon.com,
- Správně: Sluchatka.net, Usable Interface
Uživatelova data
Na konec jsem si nechal to nejdůležitější: Za každou cenu ochraňujme uživatelova data. Nesmí o ně přijít jen protože klikl na ikonku nápovědy, nesmí o ně přijít, když nechal stránku příliš dlouho otevřenou, nesmí o ně přijít, když něco jen špatně vyplnil.
Není pro uživatele nic víc frustrujícího, než ztráta jeho práce.
- Špatně: Jízdní řády
- Správně: Google Docs
Tak co, jste taky hříšníci? Tento seznam není určitě kompletní a všechna doporučení nelze brát doslovně. Stačí při návrhu webových stránek nebo aplikací přemýšlet a snažit se aplikaci vidět očima uživatele. V tomto směru vám může výrazně napomoci uživatelské testování, o kterém píše třeba můj kolega z práce na svém blogu.
Co tedy říci závěrem? Asi: Buďme k uživateli slušní.
- Datum modifikace
- 13. 09. 2008
- Sekce
- Webdesign
Další články na tomto blogu
- Předchozí:
- WebExpo 2008 – Warming Up
- Následující:
- Katastr nemovitostí vyhraje Křišťálového hňupa