Lukáš Pítra nedávno napsal článek, co zkontrolovat před spuštěním webu z hlediska SEO. Tak jsme se domluvili, že na to navážu, a sepíšu obdobný seznam z hlediska uživatelské přívětivosti a použitelnosti.
Tak jdeme na to. Jen podotýkám, abyste tohle brali jako inspiraci, spíš než dogma. Některá doporučení mohou ve vašem konkrétním případě znamenat i zhoršení (díky za tip od Honzy Kvasničky). Takže jak říká Chris Goward – We should test it.
Na celém webu
- Responzivní web – mělo by to fungovat na všech možných zařízeních. Mobily počínaje a velkými obrazovkami konče. Pokud už máte mobilní verzi, zvažte verzi pro velké monitory (s adekvátním zvětšením obrázků).
- Fungující na různých zařízeních, prohlížečích vč. starších verzí. Konverzní pyramida – začněte technickými nedostatky. Snadno se odstraní a výrazně zvednou konverzi.
- Zrychlete web – lidem ušetříte nervy, zvýšíte obrat a zlepšíte i pozice ve vyhledávačích.
- Slogan/výhoda oproti konkurenci – jasně lidem řekněte: co děláte, proč by je to mělo zajímat, a co mají dělat dál.
- Košík vč. ceny a počtu položek – Udělejte tlačítko výrazné, kontrastní a velké. A pamatujte si obsah košíku i po odchodu uživatele z webu.
- Vyhledávání – nakonfigurujte našeptávač, počítejte s překlepy, nabízejte kategorie i hledání v konkrétním umístění/výsledcích.
- Navigace – udělejte navigaci pochopitelnou i pro lamy. A nezapomeňte na drobečkovou navigaci. Taky ji zbytečně neschovávejte za ikonu hamburgeru ☰, lépe třeba takto M☰NU :).
- Dejte možnost změnit jazyk i měnu. Zkuste toto zjistit předem pomocí geo-ip lokace či nastavení operačního systému.
- Přihlášení a registrace – přihlášení si pamatujte pro příští návštěvu.
- Poštovné zdarma – pokud ho nabízíte, vrazte ho do hlavičky. Je to důležité hledisko při koupi.
- Kontakt – ukažte telefon, zařiďte si online chat. Do patičky dejte otevírací dobu, hledání poboček – pokud máte i prodejnu(y).
- Doprava, platba, reklamace, soukromí, obchodní podmínky – dejte to do patičky. Stejně tak, jako odkaz na desktop/mobilní verzi.
- Ubezpečovače – ukažte loga partnerů, platebních karet/bran, certifikací (Apek), heuréka, shop roku, dopravu, atd.
- Newsletter – pokud píšete užitečný newsletter, tak dejte možnost se přihlásit. Nabídněte slevu na další nákup.
Domovská stránka
- Šířka sortimentu – ukažte hlavní kategorie, oblíbené produkty, loga značek, případně navštívené produkty. Ale nepřeplácejte to.
- Prototypovost – respektujte očekávání uživatelů, jak má web ve vašem odvětví vypadat. Bez dobrého prvního dojmu a vybudované důvěry jste v pytli.
- Vizuální hierarchie – jednoduchá, přehledná a graficky čistá domovská stránka je základ.
- Social proof – ukažte, jak vás má hodně lidí rádo :).
Více v článcích:
Efektivní domovská stránka
Jak vybrat fotku na homepage
Kategorie
- Zobrazení produktů – dejte možnost ukázat produkty v tabulce, řádkovém zobrazení a výlohy (lookbook). Výloha je nový koncept, dost možná vám nebude fungovat.
- Náhled – ukažte velký náhled s cenou, hodnocením, dostupností. Možná i tlačítko koupit, pokud se lidi nemusí dívat na detail produktu.
- Řazení – uveďte minimálně tyto 4 možnosti: cena, prodávanost, relevance (jen u vyhledávání), hodnocení uživatelů (pokud jich máte dostatek).
- Filtrace – filtruje výsledky podle podkategorie, vlastností produktu (cena, výrobce, barva, …). Ukažte, kolik zbývá produktů při použití filtru. Použité filtry ukažte nad výpisem produktů.
- Pomocník s výběrem – dejte lidem možnost si vybrat i jinak, než pouhou filtrací, veďte je trochu za ručičku. Např.: kytky – podle příležitosti, hračky podle věku a pohlaví dětí, atd.
- Nejprodávanější – ukažte nejprodávanější produkty. Dejte tipy na top produkty v podkategoriích (výdrž, design, pokemon go)
- Stránkování – většinou je lepší mít tlačítko Nahrát dalších X, paginace nefunguje na malých obrazovkách.
Produkt
- Název produktu – jasný, srozumitelný, s klíčovými slovy.
- Fotky – velké fotky ze všech úhlů vč. možnosti zoomovat. Video, pokud je k dispozici.
- Tlačítko přidat do košíku – musí být nepřehlédnutelné. A po kliknutí musí být jasné, že se produkt přidal do košíku.
- Cena – u tlačítka. Dejte vědět, zda je s DPH, o kolik je zlevněná, kolik stojí doprava, možnosti platby.
- Hodnocení – za počtem hvězdiček dávejte i počet hodnocení.
- Dostupnost – skladem, kdy to dorazí k vám domů, na jaké je to prodejně. Pokud není dostupný, zvýrazněte to.
- Varianty – barevnost, atd.
- Velikosti – hlavně u oblečení, včetně tabulky pro jednotlivé země.
- Množství – počet kusů. Navíc ukažte omezené množství na skladě, vede to k impulzivnějším nákupům kvůli tzv. FOMO principu (fear of missing out).
- Popis produktu – zvýrazněte výhody daného produktu (odolnost, prodloužená garance), včetně kompatibility. Níže uveďte podrobný popis.
- Recenze – ukažte recenze ostatních uživatelů, spokojenost s produktem.
- Wishlist, hlídací pes – možnosti nechat si koupi na později nebo hlídat určitý parametr (dostupnost, cenu, variantu produktu)
- Upsell a cross-sell – lepší verze a doporučené produkty, příslušenství.
- Sdílení – s citem prosím. Jen dvě sociální sítě + e-mail. A neukazujte počet, pokud je tam nula.
Více v článcích:
17-elementu-produktove-stranky
upsell a cross-sell
Košík
- Registrace – nenuťte uživatele registrovat se před nákupem. Přicházíte tak o 20-25 % objednávek.
- Konečná cena – ukažte cenu včetně poštovného, balného. Prostě sakumprásk. Nejistá cena je hlavní důvod opuštění košíku.
- Náhled produktů – včetně fotky, počtu kusů, jednotkové ceny, daně a dalších poplatků, poštovného a možnosti odebrat.
- Doručení – ukažte přesné datum doručení, cenu dopravy – ideálně zdarma, varianty (do 90 minut, do druhého dne)
- Upsell jen na mobilu – ukažte doporučené produkty v mobilu. Tam to lidem nevadí. U desktopu jste jim to ukazovali na stránce produktu.
- Tlačítka – tlačítka pro další krok dejte jak nad, tak pod košík.
- Uložit na později – dejte možnost dokončit nákup jindy. A pak na to upozorněte e-mailem.
- Slevové kódy – tohle trochu upozaďte, nebo vám lidi začnou utíkat a hledat slevu.
- Možnosti placení – u dražších produktů dejte možnost více plateb.
Objednávkový proces
- Zbavte se balastu – navigace? Pryč. Patička? Pryč. Jako Amazon. Jedno tlačítko směřující dopředu. Nic víc. Nedá se dokonce ani kliknout na předchozí kroky a logo(!).
- Guest checkout – objednávka bez registrace. Můžete pak už jen na děkovné stránce požádat o heslo. Nebo ho rovnou vytvořit a poslat e-mailem.
- Košík > Doprava a adresa > Platba > Souhrn > Děkujeme – tohle je nejčastější pořadí kroků. Dejte možnost se vrátit a pamatujte si vyplněné údaje. Prosím!
- Progress bar – ukažte uživateli, kolik a jaké jsou kroky v objednávce. U složitějších dejte vědět, kolik to zabere času (nebo taky ne a uveďte procenta). Nebo z toho udělejte hru, jako linkedin u vyplňování profilu.
- Online podpora – když ne tady, tak už nikde.
- Viditelný obsah košíku – ukažte obsah košíku v každém kroku (na velkých monitorech).
- Platba – dejte více možností. Karta, dobírka, splátky, převodem.
- Doprava – pokud si to vyzvednu v Uložence, nepotřebujete mojí adresu. Alzo sakra. Opět… více možností (i rychlosti dodání).
- Bezpečnost – zvyšte pocit bezpečí SSL šifrováním, a ukázáním log ubezpečovačů.
- Formuláře – ptejte se jen na to, co potřebujete. Velikost polí odpovídá vstupu. Měňte klávesnici v závislosti na typu obsahu (číslo, e-mail, telefon).
- Děkovná stránka – poděkujte, řekněte, co se bude dít dál. Dejte možnost založit účet, přihlásit se k newsletteru, pochlubit se na sociálních sítích, …
Závěr
Určitě to není konečný seznam. Ale píšu to z hlavy, tak kdybyste měli připomínky, tak budu rád.
Smysluplná debata