Ergonomie webů a eshopů v praxi, 15.1.2013 JsmeMarketing

Ergonomie webů a eshopův praxi

JsmeMarketing

Ing. Kvasnička Jan

www.kvasnickajan.czinfo@kvasnickajan.cz@Jan_Kvasnicka

Kdo z Vás se tímto tématem na svém eshopu (webu) zabýval?

Zkoušel někdo z Vás testování na svém eshopu (webu)?

Zapracovali jste výsledky testování? Jaký byl reálný přínos?

Otázky na úvod

Schopnost ovládání webu co nejjednodušeji, intuitivní chování

Přehlednost, srozumitelnost

Na základě použitelnosti vznikají pravidla

Co je to ergonomie (použitelnost) webu?

„Nenuťte návštěvníky příliš přemýšlet“

„Pokud je první zkušenost negativní, pravděpodobně už se nikdy nevrátí“

„Okolo 50% obchodů prodělává, jelikož návštěvník nenajde požadované informace“

„Není to o tom, že jeden opisuje od druhého, ale používají něco, co funguje (pozor při vymýšlení vlastních prvků)“

4 myšlenky okolo použitelnosti

Jaké jsou podle Vás nejčastější chyby v rámci použitelnosti?

Nejčastější chyby

Stránky nečteme, ale prohlížíme (přesněji: skenujeme)

Neprovádíme optimální výběry, ale děláme kompromisy

Nebádáme nad tím, jak věci fungují, jednoduše to „nějak uděláme“

3 základní skutečnosti o chování uživatelů

Vytvořte jasnou vizuální hierarchii na stránce

Neměňte zvyklosti, vše musí být jednoduše pochopitelné

Rozdělte stránky na jasně definované oblasti

Vyznačte odkazy, dejte jasně najevo, na co lze „klepnout”

Stránky nepřeplácávejte, neuvádějte zbytečná slova

5 pravidel použitelnosti

Ergonomie eshopu

Nevytvářejte složitou strukturu produktů

Obecné doporučení: maximálně 3 úrovně

3 sloupce: ustupující trend

„Vybídnutí k činnosti/aktivitě“

Jedná se o vhodné použití textů, tlačítek, formulářů atd.

Příklady textů call-to-action Přihlásit odběr / Zasílání tipů zdarma

Log in nebo Přihlásit / Přihlásit mě do systému (komunity)

Volej 777 777 777 / Zavolejte na číslo 777 777 777 pro konzultaci ZDARMA

Co je to call-to-action?

Lay the groundwork

Techniky call-to-action 1/5

Use white space

Techniky call-to-action 2/5

Use an alternative colour

Techniky call-to-action 3/5

Make it big

Techniky call-to-action 4/5

Upozornění na novinku

Techniky call-to-action 5/5

Výsledky studie 3 frází a jejich úspěšnost na magazínu (marketingsherpa.com)„click to continue“ – 8,53 % prokliků

„continue to article“ – 3,3 % prokliků

„read more“ – 1,8 % prokliků

Call-to-action – ukázky z praxe - 1/6

Call-to-action – ukázky z praxe - 2/6

111 nákupních ikon testováno (2007)

http://www.getelastic.com/add-to-cart-buttons/

Call-to-action – ukázky z praxe - 3/6

Call-to-action – ukázky z praxe - 4/6

Call-to-action – ukázky z praxe - 5/6

Call-to-action – ukázky z praxe - 6/6

Call-to-action – ukázky z praxe - 6/6

Nejčastější chyby

Nejčastější chyby - header - 1/2

Nejčastější chyby - header - 2/2

Nejčastější chyby - košík a objednávka - 1/12

Nejčastější chyby - košík a objednávka - 2/12

Nejčastější chyby - košík a objednávka - 3/12

Nejčastější chyby - košík a objednávka - 4/12

Nejčastější chyby - košík a objednávka - 4/12

Jednostránková vs Více stránková objednávka?

Nejčastější chyby - košík a objednávka - 5/12

Nejčastější chyby - košík a objednávka - 6/12

Nejčastější chyby - košík a objednávka - 7/12

Pozor na pamatování vyplněných částí v objednávce

„Přepočítat“

Nejčastější chyby - košík a objednávka - 8/12

Nejčastější chyby - košík a objednávka - 9/12

Nejčastější chyby - košík a objednávka - 10/12

Nejčastější chyby - košík a objednávka - 11/17

Nejčastější chyby - košík a objednávka - 12/12

Je opravdu

nutná

registrace?

Nejčastější chyby - navigace - 1/7

Nejčastější chyby - navigace - 2/7

Které menu je přehlednější?

Nejčastější chyby - navigace - 3/7

Které menu

je přehlednější?

Nejčastější chyby - navigace - 4/7

Nejčastější chyby - navigace - 5/7

Nejčastější chyby - navigace - 6/7

Nejčastější chyby - navigace - 7/7

Drobečková navigace

Nejčastější chyby - výpis produktů - 1/3

Nejčastější chyby - výpis produktů - 2/3

Nejčastější chyby - výpis produktů - 3/3

Nejčastější chyby - detail produktu - 1/3

Nejčastější chyby - detail produktu - 2/3

Nejčastější chyby - detail produktu - 3/3

Nejčastější chyby - mezikrok nákupu - 1/3

Nejčastější chyby - mezikrok nákupu - 2/3

Nejčastější chyby - mezikrok nákupu - 3/3

Nejčastější chyby - filtrování a vyhledávání -1/4

Nejčastější chyby - filtrování a vyhledávání -2/4

Nejčastější chyby - filtrování a vyhledávání -3/4

Nejčastější chyby - filtrování a vyhledávání -4/4

Nejčastější chyby - porovnávání - 1/2

Nejčastější chyby - porovnávání - 2/2

Nejčastější chyby - patičky - 1/1

Nejčastější chyby - patičky - 2/2

Z eshopů a webů účastníků

Z eshopů a webů účastníků - 1/31

Hlavnístrana

Z eshopů a webů účastníků - 2/31

Služby

Z eshopů a webů účastníků - 3/31

Hlavní strana

Z eshopů a webů účastníků - 4/31

Nabídka

Z eshopů a webů účastníků - 5/31

Hlavní strana

Z eshopů a webů účastníků - 6/31

Nabídka článků

Z eshopů a webů účastníků - 7/31

Hlavní strana

Z eshopů a webů účastníků - 8/31

Detail produktu

Z eshopů a webů účastníků - 9/31

Mezikrok nákupu

Z eshopů a webů účastníků - 10/31

Objednávka

Z eshopů a webů účastníků - 11/31

Výpis produktů

Z eshopů a webů účastníků - 12/31

Recenze

Z eshopů a webů účastníků - 13/31

Header

Z eshopů a webů účastníků - 14/31

Detail produktu

Z eshopů a webů účastníků - 15/31

Levé menu

Z eshopů a webů účastníků - 16/31

Výpis produktů

Z eshopů a webů účastníků - 17/31

Detail

produktu

Z eshopů a webů účastníků - 18/31

Hlavní strana

Z eshopů a webů účastníků - 19/31

Výpis produktů

Z eshopů a webů účastníků - 20/31

Hlavní strana

Z eshopů a webů účastníků - 21/31

Detail produktu

Z eshopů a webů účastníků - 22/31

Upozornění a nákupní košík

Z eshopů a webů účastníků - 23/31

Hlavní strana

Z eshopů a webů účastníků - 24/31

Výpis kategorií

Z eshopů a webů účastníků - 25/31

Header

Z eshopů a webů účastníků - 26/31

Výpis produktů

Z eshopů a webů účastníků - 27/31

Levé menu

Z eshopů a webů účastníků - 28/31

Header

Z eshopů a webů účastníků - 29/31

Výpis produktů

Z eshopů a webů účastníků - 30/31

Header

Z eshopů a webů účastníků - 31/31

Výpis produktů

Shrnutí

Vždy důkladně testujte funkčnost (před spuštěním, za běhu)

Testování ať provádí lidé různého věku a zaměření

Sledujte aktuální trendy a vývoje silných eshopů (platí za vývoj, proč se nepřiučit)

Stále opakované: „Nenuťte uživatele přemýšlet“

Snažte se také testovat a hrát si se slovy: „lákání uživatelů na akce atd.“

Navigace a jednoduchost procesu nákupu je klíčová

Pozor na cílovou skupinu

Děkuji za pozornost

JsmeMarketing

Ing. Kvasnička Jan

www.kvasnickajan.czinfo@kvasnickajan.cz@Jan_Kvasnicka

Možnost odběru novinek na webu