Jak navrhnout úvodní stránku online obchodu

Vaše úvodní stránka je často první, co někdo uvidí, když se doslechne o vaší značce. Má asi tři sekundy na odpověď na jednu otázku: je to pro mě? Pokud odpověď není hned zřejmá, návštěvník je pryč. Navrhnout úvodní stránku, která funguje, neznamená, aby…

Koncept

Úvodní stránka není galerie ani brožura. Je to směrovací mechanismus. Jejím jediným úkolem je dostat správného návštěvníka ke správnému produktu co nejrychleji. Každé designové rozhodnutí na úvodní stránce by mělo tomuto cíli sloužit.

Tento článek popisuje, jak navrhnout úvodní stránku online obchodu, která funguje. Co zahrnout, co vynechat, jaké chyby zabíjejí konverze a jak přemýšlet o rozvržení na mobilu, kde většina vašich kupujících prochází.

Pokud chcete znát celý obraz toho, jaké stránky váš e-shop potřebuje, začněte článkem jaké stránky potřebuje každý online obchod.

K čemu úvodní stránka vlastně slouží?

Úvodní stránka slouží návštěvníkům, kteří se ještě nerozhodli. Něco o vaší značce vědí nebo vás našli přes vyhledávání či sociální sítě, ale k nákupu se ještě nezavázali. Úvodní stránka je okamžik, kdy zjišťují, zda jít dál.

Musí okamžitě odpovědět na tři otázky. Co tento e-shop prodává? Je to pro někoho, jako jsem já? Co mám udělat dál? Pokud je kterákoli z těchto odpovědí nejasná, návštěvníci odcházejí. Ne proto, že by vaše produkty byly špatné, ale protože jim úvodní stránka nedala důvod zůstat.

Jak navrhnout úvodní sekci (hero)

Úvodní sekce (hero) je první, co návštěvník uvidí. Leží nad ohybem, než začne posouvat, a nese většinu váhy prvního dojmu.

Silná úvodní sekce má čtyři prvky. Nadpis, který prostými slovy pojmenuje, co prodáváte. Krátký podpůrný řádek, který přidává kontext, často klíčový přínos nebo odlišnost. Vizuál, který ukazuje produkt nebo výsledek, který vytváří. A jedno tlačítko s výzvou k akci, které návštěvníkovi řekne přesně, kam jít.

Nejdůležitější je nadpis. Držte ho konkrétní. "Ručně vyráběné kožené tašky pro každodenní nošení" funguje. "Kde řemeslo potkává funkci" ne. Kupující čtou rychle. Pokud váš nadpis vyžaduje výklad, už jste je ztratili.

Tlačítko s výzvou k akci by mělo pojmenovat cíl, ne pocit. "Nakupovat tašky" nebo "Zobrazit novinky" funguje. "Zjistit víc" nebo "Prozkoumat" ne. Dejte návštěvníkovi směr, ne návrh.

Vizuál v úvodní sekci by měl produkt ukazovat jasně. Obrázky z reálného použití fungují dobře, když produkt potřebuje kontext, aby dával smysl, například oblečení nebo zboží do domácnosti. Obrázky samotného produktu fungují lépe, když záleží víc na jasnosti než na touze, například u nářadí nebo elektroniky. Používejte kvalitní obrázky. Rozmazaná nebo špatně osvětlená úvodní sekce podkopává všechno ostatní.

Co ukázat pod úvodní sekcí

Jakmile návštěvník posune za úvodní sekci, hledá konkrétnější důvody zůstat. Tato část úvodní stránky by měla ukázat produkty nebo kategorie, které odpovídají tomu, co vaši kupující nejspíš chtějí.

Nesnažte se ukázat všechno. Vyberte své bestsellery, produkty s nejvyšší marží nebo kategorii, ve které skončí většina vašich kupujících. Tři až šest zvýrazněných produktů je rozumný rozsah. Víc už začíná působit zahlceně a vytváří ochromení rozhodování.

Bloky kategorií fungují dobře u e-shopů se širokým sortimentem. Místo jednotlivých produktů ukažte tři nebo čtyři hlavní kategorie s jasným obrázkem a popiskem u každé. Nechte kupující, ať se sami zařadí do správné části e-shopu.

Zvýrazněná sekce by měla být také dynamická. Střídejte sezónní produkty, zlevněné položky nebo novinky. Úvodní stránka, která se nikdy nemění, nedává vracejícím se návštěvníkům důvod posouvat.

Jak využít sociální důkaz na úvodní stránce

Kupující důvěřují jiným kupujícím víc než e-shopům. Sociální důkaz na úvodní stránce buduje důvěryhodnost dřív, než návštěvník dojde na stránku produktu.

Nejúčinnější formy sociálního důkazu na úvodní stránce jsou krátké recenze zákazníků nebo hvězdičková hodnocení, počet zákazníků nebo odeslaných objednávek, zmínky v médiích nebo loga médií a odznaky důvěry třetích stran, například ikony zabezpečené platby nebo uznávané certifikační značky.

Držte to stručné. Jedno nebo dvě silná doporučení jsou účinnější než zeď pětihvězdičkových recenzí. Jediné logo z rozpoznatelného média udělá víc než seznam deseti neznámých jmen. Vyberte důkaz, který bude znamenat nejvíc pro kupujícího, který je nejskeptičtější vůči nákupu u vás poprvé.

Máte přidat sekci s příběhem značky?

Krátká sekce s příběhem značky na úvodní stránce je volitelná, ale v určitých kontextech pomáhá. Funguje nejlépe, když je příběh zakladatele součástí důvodu, proč by kupující zvolil tuto značku místo větší konkurence. Ruční výroba, etické zdroje, komunitní značky a produkty vedené zakladatelem, všechny těží z krátkého lidského okamžiku na úvodní stránce.

Pokud ji přidáte, držte ji krátkou. Stačí dvě nebo tři věty a odkaz na úplnou stránku o nás. Nedávejte ji nad ohyb ani nad zvýrazněné produkty. Příběh přidává teplo, ale rozhodnutí řídí produkty.

U e-shopů, kde produkt obstojí sám, sekci s příběhem vynechte. Stránka prodávající běžné zboží příběh původu nepotřebuje. Použijte to místo raději pro větší vystavení produktů.

Co úvodní stránka nepotřebuje

Nepořádek na úvodní stránce škodí stejně jako chybějící sekce. Každý prvek, který nemá úkol, bere pozornost něčemu, co ho má.

Běžné chyby úvodní stránky zahrnují příliš mnoho výzev k akci soupeřících na stejné úrovni, automaticky přehrávaná videa nebo animace, které stránku zpomalují, velké bloky textu, které nikdo nečte, navigační menu s víc než šesti nebo sedmi položkami a vyskakovací okna, která se objeví dřív, než měl návštěvník čas cokoli vidět.

Každá další volba, kterou návštěvníkovi vnutíte, je malý náklad na tření. Úvodní stránka by měla působit jasně, ne rušně. Pokud se nemůžete rozhodnout mezi dvěma prvky, odstraňte ten, který nesouvisí přímo s tím, aby se návštěvník dostal k produktu.

Návrh úvodní stránky pro mobil

Víc než polovina veškeré návštěvnosti e-shopů pochází z mobilů. Návrh vaší úvodní stránky by měl být postaven nejdřív pro mobil, ne dodatečně upravený z počítačové verze.

Na mobilu by měl být nadpis v úvodní sekci dost krátký, aby se dal přečíst na dva řádky. Tlačítko s výzvou k akci by mělo být dost velké, aby se na ně snadno klepalo. Obrázky produktů by se měly čistě skládat do jednoho sloupce. Navigace by se měla sbalit do menu, které nedominuje displeji.

Každou změnu úvodní stránky vyzkoušejte na telefonu, než ji zveřejníte. Co vypadá čistě na monitoru počítače, se může na malém displeji proměnit v matoucí posouvání. Zážitek kupujícího na mobilu je vaším hlavním návrhovým omezením, ne dodatečným nápadem.

Na mobilu záleží i na jasnosti dopravy. Kupující na telefonech jsou často blízko rozhodnutí o nákupu. Viditelný banner s hranicemi dopravy zdarma nebo odhadovaným doručením na úvodní stránce může změnit procházení v nákup. Víc o nastavení dopravy pro váš e-shop najdete v článku jak nastavit dopravu pro váš online obchod.

Jak WEMASY podporuje návrh úvodní stránky

E-shop od WEMASY zahrnuje nástroje pro rozvržení úvodní stránky vytvořené pro online obchody. Úvodní sekce, mřížky zvýrazněných produktů, bloky kategorií a sekce sociálního důkazu jsou k dispozici bez vlastního kódu. Rozvržení pro mobil řeší tentýž systém automaticky.

Které nástroje úvodní stránky a e-shopu jsou k dispozici v jednotlivých tarifech, uvidíte v ceníku WEMASY.

Často kladené otázky

Kolik výzev k akci má mít úvodní stránka?

Jednu hlavní výzvu k akci nad ohybem a pak vedlejší výzvy dál na stránce vázané na konkrétní sekce. Hlavní výzva by měla být nejdůležitější akcí, kterou chcete od nového návštěvníka, obvykle "Nakupovat" nebo odkaz na konkrétní kategorii. Soupeřící hlavní výzvy se stejnou vizuální váhou rozmělňují pozornost a snižují počet kliknutí na všechny. S Tvůrcem webů WEMASY to můžete nastavit přímo ve svém e-shopu.

Mám na úvodní stránce ukazovat ceny?

Ne nutně na samotné úvodní stránce, ale zobrazení cen na kartách zvýrazněných produktů je užitečné. Kupující prolétávají cenová rozmezí, aby zjistili, zda e-shop odpovídá jejich rozpočtu. Skrývání cen až na stránku produktu přidává tření a může působit vyhýbavě. Pokud jsou vaše produkty prémiové, zobrazení výchozí ceny nastavuje očekávání pozitivně, místo aby vytvářelo překvapení.

Jak často mám úvodní stránku aktualizovat?

Zvýrazněné produkty a sezónní sekce aktualizujte, kdykoli máte novinky, běží akce nebo se mění sezónně to, co kupující hledají. Úvodní sekce může zůstat stabilní déle, ale obnovte ji, když se změní vaše hlavní nabídka nebo pozicování. Úvodní stránka, která vypadá stejně celý rok, signalizuje e-shop, který není aktivní.

Ovlivňuje rychlost načítání úvodní stránky prodeje?

Ano. Úvodní stránka, která se na mobilu načítá déle než tři sekundy, ztrácí značnou část návštěvníků dřív, než cokoli uvidí. Nejčastější příčinou jsou velké nekomprimované obrázky. Obrázky před nahráním zkomprimujte, v úvodní sekci se vyhněte automaticky přehrávanému videu a omezte skripty třetích stran. Rychlost je rozhodnutí v návrhu úvodní stránky, ne jen technické.

Má úvodní stránka odkazovat na každou kategorii produktů?

Ne nutně. Odkazujte na kategorie, které bude chtít většina vašich kupujících. Navigační menu může nést úplný seznam kategorií. Tělo úvodní stránky by mělo ukázat kategorie, které přinášejí nejvíc konverzí nebo které chcete upřednostnit. Odkazování na všechno vytváří vizuální šum a rozmělňuje stránky, na kterých nejvíc záleží.

Kam na úvodní stránce patří odznaky důvěry?

Blízko úvodní sekce, poblíž výzvy k akci, nebo do vyhrazeného pruhu důvěry mezi úvodní sekcí a zvýrazněnými produkty. Kupující nejspíš hledají signály důvěry ve chvíli, kdy zvažují kliknutí na výzvu k akci. Odznaky jen v patičce zasáhnou jen kupující, kteří už došli na konec, což je pro většinu nových návštěvníků pozdě.

Využijte to hned
na vlastním webu.

Začněte zdarma s WEMASY a postavte si web za pár minut.