Články

Spíte dobře? Připravili jsme pro Vás články, které Vám nedají spát.

Zbytečné vady navigace

10. 5. 2007 | Josef Šíla

Podívejte se na příklady 10 vad či nešvarů navigace, které by se správně na webu neměly vůbec vyskytovat. Přestože se poslední dobou hodně majitelů webů snaží své stránky vylepšovat a často sahají k složitým řešením, zanedbávají věci základní. Navštívíte-li libovolný web, byť i velmi nákladně zbudovaný, patřící velké společnosti, ve většině případů najdete alespoň jednu z následujících chyb navigace.

Sdílejte článek: del.icio.us RSS
Josef Šíla

Josef Šíla

Account Manager
Josef má rád kreativní prostředí a baví ho komunikovat se zákazníky. Zajímá se o internetový marketing a chování uživatelů na webu.
Poslední články autora:

Jedná se sice o dílčí drobnosti, které v celkovém pohledu neohrožují funkčnost webu, ale klidně můžeme tyto vady přirovnat k situaci, kdy na drahém mercedesu nefungují stěrače nebo dálková světla. Víme, že to sice neznamená, že celý automobil je špatný a musíme jej dát do šrotu. Avšak právě takovýto detail nám může velmi znepříjemnit celkové používání vozu. V našem případě webu. 

Obecně se nám tedy věc dobře používá, pokud pohodlně funguje v každé potřebné maličkosti. A právě tak i pohodlná a srozumitelná navigace slouží k hladkému ovládání webu. Upozorňuji předem, že naprostou většinu z následujících vad budete znát, a to možná právě proto, že se na webech ještě v poměrně rozšířeném množství vyskytují. Ovšem naštěstí se jedná o chyby, které lze velmi jednoduše opravit. Jak, ukazují následující názorné příklady z webů, které jsou často velmi precizně provedené a jejich uvedení v ukázkách rozhodně nesnižuje jejich celkovou kvalitu. 

1. vada - chybí zřetelný odkaz na úvodní stránku

Problém: Návštěvník stránky se chce dostat na úvodní stránku, ale bohužel nikde nevidí žádný odkaz, a tak je frustrován a zkouší různá náhradní řešení (pokud ho ovšem napadnou).

Ukázka webu se zmíněným problémem

Ukázka webu s tímto problémem 

Řešení: Není žádný důvod, abyste své návštěvníky takto trápili a blokovali jim cestu po Vašem webu. Nenechávejte to na náhodě, protože například odkaz umístěný na logu nestačí. Neváhejte proto umístit odkaz na úvodní stránku přímo a zřetelně do Vaší navigace.
Podívejte se na ukázku dobrého řešení. 

2. vada - není označena aktuální položka

Problém: Návštěvník v navigaci nepozná, na které stránce nebo v jaké sekci se nachází. Často se stane, že klikne na položku, v níž se nachází, a poté je zmaten, že se nenačte žádná nová stránka, protože zůstává stále na té samé, což je velmi podivné a stránky vypadají rozbitě.

Ukázka webu se zmíněným problémem

Podívejte se na ukázku s tímto problémem 

Řešení: Označte položku v navigaci, do které patří aktuální stránka, barevně, podtržením nebo vysunutím záložky, podle toho, jaký typ navigace máte. Každopádně se nebojte provést to hezky viditelně!
Podívejte se na ukázku dobrého řešení. 

3. vada - matoucí drobečková navigace

Problém: Návštěvník nedokáže naprosto jednoznačně poznat, na jaké stránce a na jakém místě ve struktuře webu se právě nachází, protože v drobečkové navigaci není vizuálně odlišena  aktuální stránka, a navíc jsou všechny položky drobečkové navigace klikací, nebo v ještě horším případě nejsou klikací vůbec.

Ukázka webu se zmíněným problémem

Ukázka webu s tímto problémem 

Řešení: Díky správně řešené drobečkové navigaci rozpozná návštěvník stránky, na jaké stránce a na jakém místě ve struktuře webu se právě nachází. Zároveň má možnost přejít na kteroukoliv z vyšších úrovní struktury webu dané sekce. Proto jsou v drobečkové navigaci uvedeny odkazy až na nejvyšší úroveň (úvodní stránku webu) a jednotlivé úrovně jsou klikací a podtržené. Naopak aktuální stránka, která je také v drobečkové navigaci uvedena, není podtržená a není klikací. Neváhejte prosím svou drobečkovou navigaci takto opravit.
Podívejte se na ukázku dobrého řešení. 

4. vada - vysouvací navigace ujíždí pod rukama

Problém: Návštěvník stránky se chce dostat pohodlně a rychle k informaci, kterou hledá. Ještě neví, kde se tato informace na webu nachází, a tak musí prozkoumat obsah webu pátráním v navigaci, zda nenalezne nějaké slovo nebo výraz, které mu bude hledanou informaci připomínat. Hledání správné sekce mu však znepříjemňuje fakt, že vysouvací navigace mu vždy "zmizí pod rukama", jakmile z ní omylem vyjede. Takže prostě musí celý proces opakovat znovu. Komu se trochu či více třese ruka nebo má špatně citlivou myš, jistě tento pocit zažívá na příliš živě se vysouvací navigaci poměrně často.

Ukázka webu se zmíněným problémem

Ukázka webu s tímto problémem 

Řešení: Rozšiřte jednotlivé položky ve vysouvací navigaci tak, aby byly jednotlivé plochy větší (hlavně na výšku). Po nechtěném vyjetí z položky navigaci ihned neschovávejte, ale nechte ji alespoň po určitý čas rozbalenou, abyste umožnili další práci s navigací. Je to lepší, než nutit návštěvníka celý průchod položkami absolvovat znovu. Můžete také vizuálně označit položku aktuálně zobrazované stránky.
Podívejte se na ukázku dobrého řešení  nebo také na tomto webu  .

5. vada - položky jsou nepřehledné a bez jasné struktury

Problém: Navigace je rozmístěna takovým způsobem, že neumožňuje návštěvníkovi udělat si jasný obrázek o struktuře webu a jeho sekcích. Položky jsou zároveň rozmístěné tak, že není na první pohled jasná jejich hierarchie a důležitost. Návštěvník je nucen těkat očima po různých místech a částech obrovského množství položek, než nalezne hledanou informaci.

Ukázka webu se zmíněným problémem

Ukázka webu s tímto problémem 

Řešení: Shlukněte podobné stránky a sekce do jednotlivých hlavních kategorií navigace a snažete se neumisťovat zbytečně veliké množství odkazů a položek najednou. Oddělte jasně doplňkovou navigaci od hlavní a dopřejte prostoru i volného místa pro navození přehlednosti.
Podívejte se na ukázku dobrého řešení. 

6. vada - položky nejsou pojmenovány srozumitelně

Problém: Návštěvník nenalezne požadovanou informaci, protože je umístěna v navigaci webu pod položkou, jejíž název mu nic neříká. V navigaci se objevuje příliš odborný název či označení produktu, který návštěvník ještě nezná, a tak si jej samozřejmě nedokáže spojit s funkcí nebo službou, který se pod ním ukrývá. Návštěvník se příliš nemá podle čeho orientovat, na první pohled se v tom prostě nevyzná a říká si, "proč to nepojmenujou nějak normálně?"

Ukázka webu se zmíněným problémem

Ukázka webu s tímto problémem 

Řešení: Pojmenovávejte položky navigace naprosto jednoznačně a srozumitelně. Pokud nemáte k dispozici výzkum, že daný název zná naprostá většina veřejnosti, tak raději uveďte do položky název obecnější. Pokud opravdu chcete mít něco speciálního, dejte to například jako doplněk do závorky či prostě vyjádřete, o co se jedná. Nejlépe však uděláte, když hlavní položky navigace necháte naprosto srozumitelné.
Podívejte se na ukázku dobrého řešení. 

7. vada - nečitelné a drobné písmo navigace

Problém: Malé písmo v navigaci, či dokonce špatně čitelná navigace, znamená zbytečně zpomalený a nepříjemný pohyb po webu. Samozřejmě, že některé návštěvníky malé písmo dokonce rozčílí, což se pak zbytečně přenáší na vnímání společnosti jako takové.

Ukázka webu se zmíněným problémem

Ukázka webu s tímto problémem  nebo také tento web 

Řešení: Položky i texty navigace proveďte raději ve větší než menší velikosti a pro jistotu si čitelnost ověřte.
Podívejte se na ukázku dobrého řešení. 

8. vada - nesrozumitelné ikony v navigaci

Problém:  V navigaci jsou uvedeny ikony, které směřují na důležité funkce či stránky, ale není na první pohled jasné, co znázorňují. Návštěvník tak musí zkoušet (pokud se k tomu vůbec rozhodne) kliknout nebo přejet myší a zjistit, kam že to vlastně vede. Význam ikon znají přesně pouze jejich tvůrci, a tak zůstává jistě dobrý záměr nedotažen.

Ukázka webu se zmíněným problémem

Ukázka webu s tímto problémem 

Řešení: Použití ikon v navigaci může být zpestřením a také pomáhá v rychlejší orientaci, protože ikonu (pokud je jednoznačná) vnímáme rychleji než slovní vyjádření položky. Přesto však není vhodné riskovat a trápit návštěvníky nutností hádat, proto umisťujeme k ikoně i slovní vyjádření.
Podívejte se na ukázku dobrého řešení. 

9. vada - pořadí položek neodpovídá jejich důležitosti

Problém: Určitým standardem a rozšířeným prvkem navigace webu, který od sebe navzájem všichni tvůrci odkoukávají, je umisťování položky "O nás" nebo "O společnosti" na první pozici. Určitým do sebe zahleděným dojmem je, že to je právě ta informace, která návštěvníka nejvíce zajímá. Opak je však pravdou, jedná se často o nejméně navštěvovaná část webu. Návštěvníka totiž zajímá jeho situace, hledá řešení, produkt, službu apod. V navigaci tedy daleko více ocení přístup směrem k jeho potřebám.

Ukázka webu se zmíněným problémem

Ukázka webu s tímto problémem 

Řešení: Nedávejte položku "O nás" na první místo hlavní navigace. Často můžete dokonce tuto položku umístit do doplňkové navigace. Nevylijte však s vaničkou i dítě a v navigaci nechejte výrazný odkaz na "Kontakty".
Podívejte se na ukázku dobrého řešení  nebo také na tomto webu  .

10.  vada - chybí vyhledávání nebo mapa stránek

Problém: Návštěvník hledá informaci a nenapadá ho, v jaké sekci navigace se nachází. Protože má málo času, chce prostě jen zadat hledaný výraz do interního vyhledávání webu a dostat se tak rychle na danou stránku. K orientaci na webu mu také pomůže zobrazení takzvané mapy stránek, kde vidí před sebou celou strukturu a obsah webu. Je to podobné, jako když si prohlédne obsah knihy, dříve než se s chutí pustí do její četby nebo přejde rovnou na kapitolu, která ho zajímá.

Ukázka webu se zmíněným problémem

Ukázka webu s tímto problémem 

Řešení: Je možné namítnout, že vyhledávání a mapa stránek nejsou navigací webu. Přesto však můžeme tyto funkce za formu navigace považovat, protože slouží k nalezení informací, slouží k pohybu po stránkách. Takže neváhejte a doplňte na web interní vyhledávání a mapu stránek, každý web by je měl mít.
Podívejte se na ukázku dobrého řešení  .

A na závěr malý dárek

Pokud jste ve čtení dospěli až na toto místo, možná si říkáte, že oněch 10 vad Vám připadá zbytečně malicherných. Chápejme ale prosím, že jsou to vady zbytečné a lze je snadno odstranit. Snad Vás tento článek inspiroval k přemýšlení o tom, jak svou navigaci kromě zmíněného ještě více vylepšit. Doporučuji Vám pomoci si uživatelským testováním, které Vám odhalí, na co sami nepřijdete.


Nyní máme za sebou jednoduché opatření v navigaci, v mém příštím článku se již můžete těšit na to, že si ukážeme, jak zaměřit položky navigace co nejvíce směrem k uvažování a potřebám návštěvníků.

A zcela na závěr bych Vám chtěl podat pomocnou ruku (abychom opravdu uváděli věci do praxe) a nabízím všem, kteří mi do 20. května 2007 pošlou odkaz na svůj web, že jim pošlu 1 stručný tip na vylepšení jejich navigace.

Sdílejte článek: del.icio.us RSS
Vaše názory