Všichni analytici a UX designeři vám řeknou, že vše na webu se musí testovat a je nutné provést uživatelský výzkum, před jeho navrhováním. Je to blbost. Zároveň to blbost není. Nechápejte mě špatně – vstupní analýzy, testování a výzkumy jsou mi svaté. Také testuji vše, co se dá. Jen nezastávám názor, že se musí testovat vše. Jsou pravidla, která by se měla dodržovat a testy na nich nic nezmění. Po stovkách výzkumů a testování jsem zjistil, že jsou věci, které na webu fungují nejlépe a to v jakémkoliv oboru.
Že je to odvážné tvrzení? Jsou to zkušenosti.

Důvod, proč se chci věnovat tomuto tématu je, že jsem včera byl na přednášce Jana Řezáče. Ten mimo jiné představoval některé jeho “vydařené” projekty, které k mému překvapení obsahovaly několik zásadních chyb. Přemýšlel jsem, zda Honza ztrácí formu, nebo jestli mu nezačal ujíždět vlak. Zmíněné chyby souvisí s pravidly, které vám teď sdělím.

Vezměme to od vrchu. Jedná se o menu a záměrně říkám od vrchu.

Horní menu / navigace

Menu se objevuje v záhlaví stránky přes 20 let a lidé ho tam očekávají. Znáte to: zklamání pramení z očekávání a pokud lidem přesunete navigaci dolů, schováte ji pod burger menu, nebo ji v horším případě hrdině nacpete na levou nebo pravou stranu a ještě k tomu vertikálně, tak budou zmatení, zklamaní a frustrovaní. Vážně chcete, aby uživatel, který se dostane na váš web, byl již od první sekundy zmatený a frustrovaný? Jak asi takový zákazník bude nakupovat? Na mysli mám samozřejmě desktop verzi webu. U mobilního zobrazení je to složitější. To si necháme na jindy.

Prostě dejte menu vždy nahoru, nemusíte již testovat jeho umístění, ušetříte tak spoustu času, financí i nervů. Spodní nebo postranní menu jsou jen výstřelky, které nejsou funkční. Navíc postrádají smysl asi jako zimní pánská bunda s kapsami na prsou místo na bocích – když si dáte ruce do kapes, vypadáte, jako byste si stimulovali bradavky.

USP

Uniqe selling points (jedinečný prodejní argument). Ten prostě na web patří. Tak jako v inzerátu na seznamce musíte prodat své vlastnosti, abyste zaujali (vysoká, štíhlá bruneta se smyslem pro humor…), musíte stejně prodat váš web, službu či produkt.

Nejvhodnější umístění USP je těsně pod oblastí, která se nazývá Nad ohybem (vrchní část webu viditelná při vstupu na web, ukončená spodní hranou displeje).

Výhody musí být stručné, přesvědčivé a měly by reflektovat charakter vaší společnosti nebo služby. Stačí 3 až 4 výhody. Když jich je více, jde to proti přehlednosti.

Tlačítko s výzvou k akci

Bez výzvy k akci (CTA) je web v podstatě jen hezký obrázek – na nic nebo na okrasu. Návštěvník na vašich stránkách potřebuje vědět, jak má pokračovat v případě, že si chce objednat váš produkt nebo službu. To mu nejlépe naznačíte tlačítkem (buttonem) a výzvou k akci (CTA – call to action).

Tlačítko: jistě jste viděli spoustu tlačítek. Hranatá, bez výplně (ghost button), kulatá apod. S jistotou mohu říci, že nejvyšší konverzi mají plná, obdélníková tlačítka se zaoblenými rohy a stínem. Tlačítko musí být plastické, sexy a “stlačitelné”. Uživatel na něj musí chtít kliknout – něco podobného jako když před někoho dáte panel s velkým červeným tlačítkem s nápisem stiskni – každý ho bude chtít stisknout.

Výzva k akci: doporučuje se jedno až 2slovná. Ideální nejvyšší počet znaků je 14 a nejnižší 5. Jmenuje se to výzva k akci, takže by měla uživatele vyzývat.

Konverzní barva

Je to barva, která se používá na konverzní prvky (nejčastěji tlačítka). Konverzní tlačítko s CTA musí být nejvíce viditelný prvek na webu. Jak button vypadá jsme si již řekli a nyní mu musíme dát barvu. Volte vždy opačnou než je dominantní barva celého webu. Např. když na vašem webu převládá modrá barva, tlačítko by mělo mít červenou, zelenou nebo oranžovou barvu. Je vcelku jedno jakou barvu zvolíte, hlavním parametrem bude jedinečnost na vašem webu. Nejvíce konverzní barvy jsou: modrá, červená, zelená a oranžová. Vyvarujte se šedivé, černé a bílé – tyto barvy jsou obvykle používány pro neaktivní tlačítka, takže to může uživatele zmást a neklikne tam, kam potřebujete.

Přístupnost

Zjednodušeně se jedná o pravidla pro bezbariérový přístup na váš web. Zohledňují uživatele se zrakovou poruchou (barvoslepost, slabozrakost, tupozrakost apod.), důchodce, uživatelé jiných zařízení (Smart TV, Smart Watches, PDA atd.) a dokonce i roboty vyhledávačů (google, bing, seznam apod.). Pro weby státní správy je přístupnost webu daná zákonem.

V čem pravidla spočívají:

Text: Písmo v dostatečné velikosti s kontrastním poměrem vůči pozadí min 4,5. Pozadí bez rušivých vzorů. Kratší a srozumitelnější věty. Vyvarujte se dlouhým řádkům a odstavcům. Používejte nadpisy.

Jednoduché a pochopitelné ovládání: Musí být stejná na všech stránkách a musí být viditelně oddělena od dalšího obsahu.

Dalšími pravidly už se zabývat nebudu, jelikož se zabývají spíše kódem – beru to pouze z pohledu designu. Více informací o přístupnosti zjistíte např. zde.

U návrhu webu je dobré brát také ohledy na lehčí mozkové disfunkce. Třeba pro uživatele s lehčí formou autismu nebo hyperaktivity je velmi obtížné procházet web s animovanými bannery nebo s videem na pozadí. Ono je to někdy peklo i pro relativně zdravé jedince.

Něco o mně

Mám více než 10 let zkušeností s UX, CRO, psychologií a neuromarketingem. Pomohu vám vytvořit jedinečný, přehledný a hlavně výdělečný web, eshop nebo i jiný design (obal, print i online).

Chcete také mít přesvědčivý, přístupný a  uživatelsky přívětivý web, aby se k vám uživatelé rádi vraceli? Tak mi napište

Jsem drahý? Ano, jsem. Za kvalitu se v dnešní době platit musí, ale vaše investice se mnohonásobně vrátí.
​​​​​www.draphic.cz

1 komentář: „5 věcí, které web musí mít

Zanechat odpověď

Vyplňte detaily níže nebo klikněte na ikonu pro přihlášení:

Logo WordPress.com

Komentujete pomocí vašeho WordPress.com účtu. Odhlásit /  Změnit )

Google photo

Komentujete pomocí vašeho Google účtu. Odhlásit /  Změnit )

Twitter picture

Komentujete pomocí vašeho Twitter účtu. Odhlásit /  Změnit )

Facebook photo

Komentujete pomocí vašeho Facebook účtu. Odhlásit /  Změnit )

Připojování k %s

Tento web používá Akismet na redukci spamu. Zjistěte více o tom, jak jsou data z komentářů zpracovávána.