• UŽIVATELSKÉ ROZHRANÍ A UX

Strategie návrhu produktové stránky, které zvyšují konverze

  • Felix Rose-Collins
  • 9 min read
Strategie návrhu produktové stránky, které zvyšují konverze

Úvodní stránka

Jaká je nejdůležitější stránka vašeho webu?

Ne, není to domovská stránka, i když ta hraje klíčovou roli při vytváření zapamatovatelného prvního dojmu. Vítězem je v tomto případě outsider - vaše produktová stránka (stránky).

Když se nad tím zamyslíte, je to naprosto logické. Velká část vašich e-mailů, SEO, sociálních médií a placených reklam je zaměřena na to, abyste návštěvnost neposílali na domovskou stránku, ale na konkrétní stránky produktů. Tam se odehrává skutečné rozhodování a nákup.

V průměru však pouze 2,5-3 % návštěv webových stránek elektronického obchodu vede k úspěšným konverzím. Viníkem takto nízké míry konverze je obvykle špatný design a optimalizace produktových stránek.

V tomto příspěvku se budeme zabývat tím, co tvoří dobře navrženou produktovou stránku, a vysvětlíme, proč jednotlivé strategie fungují. Vysvětlíme vám také, jak jednotlivé strategie realizovat, takže si přečtěte další informace a posuňte svůj design produktové stránky na vyšší úroveň.

Usnadněte a zjednodušte proces přizpůsobení

Značky, které v personalizaci vynikají, generují o 40 % vyšší příjmy než ty, které zaostávají. Stejná výzkumná studie ukázala, že 71 % zákazníků očekává, že společnosti budou poskytovat personalizované interakce.

Na základě těchto statistik můžeme konstatovat, že poskytování zážitků na míru a uspokojování potřeb zákazníků není volitelné. Přizpůsobení se stalo nepostradatelným prvkem každé úspěšné produktové stránky.

Seznamte se s nástrojem Ranktracker

Univerzální platforma pro efektivní SEO

Za každým úspěšným podnikem stojí silná kampaň SEO. Vzhledem k nesčetným optimalizačním nástrojům a technikám je však těžké zjistit, kde začít. No, už se nebojte, protože mám pro vás přesně to, co vám pomůže. Představuji vám komplexní platformu Ranktracker pro efektivní SEO.

Konečně jsme otevřeli registraci do nástroje Ranktracker zcela zdarma!

Vytvoření bezplatného účtu

Nebo se přihlaste pomocí svých přihlašovacích údajů

I když je přizpůsobení na internetu snazší, musíte si dát pozor, abyste své potenciální zákazníky nezahltili. Paralýza výběru je skutečná věc a dochází k ní, když je lidem předloženo množství různých možností.

Podle Hickova zákona platí, že čím více možností má člověk na výběr, tím déle mu trvá, než se rozhodne. Tato prodleva může vést k tomu, že potenciální zákazníci nákup vzdají, a tím se sníží vaše prodeje.

Jak můžete tuto paralýzu volby snížit?

Zde je několik tipů:

  • Omezte počet možností nebo alespoň zdůrazněte několik nejvýraznějších. Vždy můžete přidat tlačítko "Více", které zobrazí další, méně oblíbené možnosti.
  • Zjednodušte proces personalizace a usnadněte svým potenciálním zákazníkům přizpůsobení produktu, který se jim líbí.
  • Nabídněte výchozí, předdefinované možnosti založené na nejoblíbenějších volbách a nejprodávanějších produktech. To u některých zákazníků sníží únavu z rozhodování.

Jde o to, aby byl celý proces uživatelsky co nejpřívětivější a aby se vaši zákazníci mohli podílet na tom, jak bude výsledný produkt vypadat.

Společnost Nike odvádí skvělou práci, když dává zákazníkům kreativní kontrolu nad modelem tenisek, který si chtějí koupit. Nástroj značky pro přizpůsobení produktu je intuitivní a přehledně uvádí všechny prvky produktu, které lze upravit. Zákazníci navíc mohou kliknout na část tenisek, kterou chtějí změnit, a zobrazit si dostupné barvy nebo materiály.

Nike Air Force 1 (Zdroj: Nike)

Diverzifikujte svou galerii produktů

Jednou z největších překážek nakupování online je nemožnost zákazníků si produkty osahat, osahat, vyzkoušet a vyzkoušet. I po nákupu mohou tyto faktory poškodit vaše prodeje, protože jsou zodpovědné za to, že 10-15 % produktů zakoupených online bude vráceno. V některých odvětvích, jako je například móda, je toto číslo ještě vyšší a dosahuje 50 %.

Seznamte se s nástrojem Ranktracker

Univerzální platforma pro efektivní SEO

Za každým úspěšným podnikem stojí silná kampaň SEO. Vzhledem k nesčetným optimalizačním nástrojům a technikám je však těžké zjistit, kde začít. No, už se nebojte, protože mám pro vás přesně to, co vám pomůže. Představuji vám komplexní platformu Ranktracker pro efektivní SEO.

Konečně jsme otevřeli registraci do nástroje Ranktracker zcela zdarma!

Vytvoření bezplatného účtu

Nebo se přihlaste pomocí svých přihlašovacích údajů

Zatímco zapojení všech smyslů je stále výsadou kamenných obchodů, můžete použít další nejlepší věc - rozmanitou galerii produktů.

1. Poskytněte tolik obrázků, kolik je potřeba

Ukažte svůj produkt z různých úhlů a detailů, aby si ho zákazníci mohli lépe představit. Používejte pouze vysoce kvalitní obrázky, ale ujistěte se, že jsou optimalizované tak, aby nezpomalovaly vaše webové stránky.

Zrnité nebo pixelové obrázky pouze snižují míru konverze, protože nezobrazují vaše produkty správně, a nepřidávají tak žádnou hodnotu. Takové faux pas negativně ovlivní vnímání vašich produktů zákazníky a poškodí vaši pověst. Nezapomeňte, že vizuální přitažlivost je rozhodujícím faktorem, pokud jde o důvěru a důvěryhodnost, což znamená, že návštěvníci vašich stránek vám nebudou chtít dát číslo své kreditní karty, pokud budou vaše produktové stránky působit pochybně.

2. Nabídněte 360stupňový pohled na produkt

Funkce 360stupňového zobrazení nahrazuje návštěvu kamenného obchodu, protože umožňuje zákazníkům pohybovat se po produktu a prohlížet si ho z různých úhlů.

Navíc díky implementaci tohoto prvku UX budete moci nahrát méně obrázků, aniž by to bylo na úkor uživatelského komfortu.

3. Povolení funkce přiblížení

Když si zákazníci prohlížejí produkty v kamenném obchodě, chtějí si je vždy pozorně prohlédnout a zkontrolovat detaily.

Funkce přiblížení napodobuje tuto situaci a umožňuje návštěvníkům webu lépe si představit produkt a vidět jeho strukturu. Když si mohou produkt prohlédnout takto podrobně, potenciální zákazníci se cítí jistější při nákupu.

4. Ukažte své produkty v provozu

Každý produkt dejte do souvislostí a ukažte potenciálním zákazníkům, jak ho používají ostatní.

Díky tomu získají představu o tom, jak výrobek vypadá v reálném světě a jak by se měl používat. Například oděvní součástku je možné lépe a poutavěji ukázat na modelu, než ji umístit na rovný povrch.

Díky fotografiím v kontextu si zákazníci mohou udělat lepší představu o střihu oděvu.

Je dobré zahrnout modely různých velikostí a etnického původu, abyste emocionálně navázali kontakt se všemi segmenty publika.

5. Využití videa

88 % lidí tvrdí, že je sledování produktového videa přesvědčilo k nákupu.

Schopnost tohoto formátu shrnout velké množství informací v krátkém časovém úseku je obzvláště silná. Již jsme se zmínili o problému krátké pozornosti a místo toho, abyste nutili své potenciální zákazníky číst o vlastnostech a výhodách produktu, je mnohem efektivnější ukázat vše v krátkém videu.

6. Ukažte velikost produktu v reálném prostředí

Při nakupování online záleží na velikosti.

Pokud nechcete své potenciální zákazníky uvést v omyl, ujistěte se, že si dokáží představit, jak velký nebo malý je daný produkt. Uveďte všechny rozměry výrobku i obalu a u oblečení a obuvi přidejte tabulku velikostí.

Pokud existuje byť jen malá šance, že by velikost výrobku mohla být zavádějící, ukažte měřítko umístěním vedle předmětů, které lze použít jako referenční body.

Somnifix je skvělým příkladem diverzifikace galerie produktů. Stránka produktu této značky je plná užitečných obrázků, ilustrací a dalších vizuálních prvků, které ukazují, jak jejich produkt použít, kdo ho může používat a jaké jsou jeho hlavní výhody.

Show the Product Size in Real Life (Zdroj: Somnifix)

Využití cenového ukotvení

Marketing se do značné míry opírá o lidskou psychologii. Cenotvorba se neliší a ke zvýšení konverzního poměru můžete použít několik strategií.

Zákazníci nemají představu o tom, kolik by měl určitý výrobek stát, a názor na to, zda je cena dobrá, si vytvářejí na základě několika referenčních bodů. Zjistí si například, kolik stojí podobný výrobek, a použije ho jako měřítko.

Pokud je po produktu vysoká poptávka, lidé jsou ochotni zaplatit více. Například společnost Hermès toho již po desetiletí využívá tím, že kolem své ikonické kabelky Birkin vytváří umělý nedostatek a auru exkluzivity.

Tento hodnotící mechanismus tedy naznačuje, že vnímání ceny vašimi zákazníky jsou

  1. Relativní
  2. Náchylnost k manipulaci

V roce 2010 Steve Jobs při jedné ze svých hlavních prezentací představil zbrusu nový produkt společnosti, iPad. Při diskusi o ceně tohoto honosného zařízení se Jobs vyjádřil ke spekulacím, že jeho cena bude těsně pod 1 000 USD, což je průmyslový kódový název pro 999 USD. V tu chvíli se toto číslo objevilo na velké obrazovce v pozadí, aby bylo o 60 sekund později rozdrceno cenovkou 499 dolarů, během níž se diváci dozvěděli více o výhodách tohoto zařízení.

Když pak cena "klesla", zákazníci nabyli silného dojmu, že ušetří 500 dolarů a získají úžasný produkt za pouhý zlomek jeho skutečné hodnoty.

Tato kognitivní předpojatost, kterou Jobs mistrně využil, je jádrem cenového ukotvení. Stejného efektu můžete dosáhnout tím, že u zákazníků vyvoláte dojem, že skutečná cena produktu je mnohem vyšší. Trik spočívá v uvedení původní ceny, jejím přeškrtnutí a umístění nové, nižší ceny vedle ní. A voilá! Vaši zákazníci si nyní budou myslet, že získají výhodnou nabídku.

Použití vizuálně výrazných CTA

Efektivní výzva k akci může udělat zázraky s konverzním poměrem. To je důvod, proč jí v tomto článku věnujeme druhou položku.

Ačkoli se může zdát, že vytvoření těchto několika slov umístěných na prvku ve tvaru tlačítka není žádná raketová věda, ve skutečnosti tento proces vyžaduje spoustu výzkumu, dat a A/B testování. Receptem na neodolatelné CTA je vymyslet správnou kombinaci kopie, velikosti, barvy a umístění.

Vytváření kopií zaměřených na akci

Smyslem CTA je sdělit návštěvníkům, co mají dělat dál, a přimět je k akci.

Ale místo toho, abyste říkali "Kupte", musí být vaše formulace přesvědčivější a přesvědčivější. Fráze jako "Zjistěte více", "Ano, chci zkušební verzi zdarma", "Získejte slevu" nebo "Dejte mi exkluzivní nabídku" jsou přitažlivější a silnější.

Společnost Going kombinuje tento princip s chytrými slovními hříčkami na své produktové stránce Levné lety. Název značky se hodí k roztomilé slovní hříčce, která upoutá pozornost a zároveň motivuje k akci.

Create Action-Oriented Copy (Zdroj: Going)

Výběr správné velikosti

Na jedné straně chcete, aby byl text v CTA čitelný, na druhé straně nechcete mít obrovské tlačítko, které bude vypadat lacině a nevhodně.

Správnou rovnováhou by bylo dostatečně velké tlačítko, které by vyniklo, ale zároveň by nepřehlušilo ostatní obsah stránky.

Stránky produktůspolečnosti Cotton Bureau obsahují nápadné CTA, které jsou snadno čitelné, a přesto nezastíní ostatní prvky stránky a nepůsobí příliš prodejně.

Pick the Right Size (Zdroj: Cotton Bureau)

Použití kontrastních, ale doplňkových barev

Různé studie se pokoušely určit nejefektivnější barvu CTA, ale na barvě záleží hlavně proto, aby tlačítko CTA vyniklo na pozadí.

Použití doplňkových barev (barev na opačných stranách barevného kruhu) vytvoří nejlepší kontrast a zvýší viditelnost výzvy k akci.

Dalším způsobem, jak zviditelnit a zvýraznit CTA, je využití negativního prostoru.

Společnost Kettle & Fire využívá všech těchto osvědčených postupů; její CTA je jasně červené a dobře viditelné na bílém pozadí. Dalším důvodem, proč tento příklad funguje, je snadné přizpůsobení objednávky a průhlednost.

Zákazníci si mohou zvolit počet balení, která chtějí koupit, a přesně zjistit, kolik jim bude účtováno. K dispozici je také možnost vybrat si mezi jednorázovou objednávkou a předplatným.

Use Contrasting but Complementary Colors (Zdroj: Kettle & Fire)

Přijměte vysvětlující videa

Diváci tvrdí, že si z videa zapamatují téměř 95 % sdělení.

I když si myslíte, že toto číslo je poněkud nadsazené, nelze popřít, že tento formát je neskonale účinnější při předávání marketingového sdělení a ukazování výhod a případů použití konkrétního produktu.

Není divu, že 96 % lidí tvrdí, že se na vysvětlující video podívali, aby se dozvěděli více o produktu nebo službě, která je zajímá. Tento formát je obzvláště užitečný pro komplexní produkty služeb ve světě SaaS. Pokud je váš produkt pro typickou osobu kupujícího neznámý, investujte do vytvoření jednoho nebo dvou videí pro své produktové stránky.

Vysvětlující videa se skvěle hodí pro ukázku toho, jak produkt používat, protože lépe poskytují návod. Místo toho, abyste zákazníkům předkládali stěnu textu popisující konkrétní produkt, nabídněte jim krátké, poutavé video, které ukáže, jak funguje, a rychleji předá vaše sdělení.

Lidé navíc dvakrát častěji sdílejí videa se svými sítěmi než jakýkoli jiný formát, což znamená, že můžete také rozšířit svůj dosah a generovat větší návštěvnost.

SpolečnostBay Alarm Medical využívá vysvětlující video, aby ukázala, jak nainstalovat svůj lékařský výstražný systém, aby potenciální zákazníci nemuseli hledat písemné pokyny.

Embrace Explainer Videos (Zdroj: Bay Alarm Medical)

Řešení běžných překážek konverze

Nakupování online je pohodlné, protože zákazníci mohou výrobek zakoupit z pohodlí domova. Existují však některé překážky, které mohou bránit konverzi, a nejčastější z nich jsou:

Transakční zabezpečení

Vaši zákazníci se obávají, jak bezpečná bude jejich platba. 18 % lidí opouští nákupní košík kvůli obavám o bezpečnost. Kromě zavedení systému, který zajistí bezpečnost citlivých údajů a informací o kreditních kartách vašich zákazníků, používejte odznaky důvěry, které budou ukazovat, že postupujete s náležitou pečlivostí.

Odznaky bezpečné pokladny a přijaté platby spolu s potvrzeními třetích stran vzbudí ve vašich zákaznících důvěru a povzbudí je, aby své nákupy dokončili.

Přepravní náklady a zásady vracení zboží

Náklady na dopravu a zásady vracení zboží mohou mít významný vliv na konverze. Pokud vaši zákazníci nevidí celkové náklady předem, je pravděpodobné, že opustí nákupní košík, aniž by dokončili nákup.

Stejně tak vzhledem k tomu, že si objednané zboží nemohou vyzkoušet, je velkorysá politika vrácení zboží něčím, co je může odradit.

Dostupnost poprodejní podpory

Konverze není konec cesty kupujícího. Jakmile u vás někdo nakoupí, je zásadní poskytnout mu výjimečnou zákaznickou zkušenost a uspokojit jeho potřeby. Pokud si lidé nebudou jisti, co se stane, pokud budou potřebovat podporu po nákupu, nebudou s vámi chtít obchodovat.

Dejte jim tedy vědět, že se na ně mohou obrátit v případě, že se setkají s problémem nebo se prostě chtějí dozvědět, jak co nejlépe využít zakoupený produkt nebo službu.

Společnost Mannequin Mall odstraňuje všechny překážky konverze tím, že tyto problémy jasně řeší na své stránce produktu a hned na začátku. Jejich potenciální zákazníci tak mohou získat všechny potřebné odpovědi, aniž by museli prozkoumávat webové stránky a klikat sem a tam a hledat informace o pravidlech přepravy nebo vrácení zboží.

Availability of After-Sales Support (Zdroj: Mannequin Mall)

Myslete na mobilní zákazníky

Očekává se, že do roku 2025 dosáhnou výdaje na mobilní elektronické obchodování 728,28 miliardy dolarů.

Pro 59 % spotřebitelů je možnost nakupovat přes mobilní telefon důležitým faktorem, který berou v úvahu při rozhodování, kde nakoupit.

Seznamte se s nástrojem Ranktracker

Univerzální platforma pro efektivní SEO

Za každým úspěšným podnikem stojí silná kampaň SEO. Vzhledem k nesčetným optimalizačním nástrojům a technikám je však těžké zjistit, kde začít. No, už se nebojte, protože mám pro vás přesně to, co vám pomůže. Představuji vám komplexní platformu Ranktracker pro efektivní SEO.

Konečně jsme otevřeli registraci do nástroje Ranktracker zcela zdarma!

Vytvoření bezplatného účtu

Nebo se přihlaste pomocí svých přihlašovacích údajů

A konečně, 57 % uživatelů internetu tvrdí, že nedoporučí značku se špatně navrženým mobilním webem svým přátelům a rodině.

Všechny tyto statistiky jsou pádným argumentem pro vytvoření e-shopu vhodného pro mobilní zařízení. Proto byste při navrhování mobilní verze stránky produktu měli vždy používat osvědčené postupy.

Zde je několik tipů, jak vytvořit web vhodný pro mobilní zařízení, který nebude návštěvníky obtěžovat:

  • Zachovejte jednoduchý design a umožněte snadnou navigaci.
  • Používejte velká tlačítka, abyste zabránili chybě tlustého prstu.
  • Vyhněte se používání vyskakovacích oken, protože na mobilním zařízení je lze obtížně zavřít.
  • Optimalizujte obrázky pro mobilní zařízení, abyste zvýšili rychlost načítání.
  • Použijte rámec AMP (Accelerated Mobile Pages) pro zlepšení výkonu serveru a zvýšení rychlosti načítání.
  • Vypnutím automatických oprav ve webových formulářích urychlíte proces vyplňování.
  • Používejte snadno čitelná standardní písma.

Společnost Many Mornings implementovala na svých produktových stránkách design vhodný pro mobilní zařízení. Jednoduchost, snadná navigace, velká tlačítka CTA a jasný přehled procesů usnadňují zákazníkům procházení sekcí produktů, přidávání produktů do košíku a rychlý přístup k již vybraným položkám.

Keep Mobile Shoppers in Mind (Zdroj: Many Mornings)

Závěrečné myšlenky

Dobře promyšlené a optimalizované produktové stránky vedou k výrazně vyššímu počtu konverzí. Když se zákazník dostane na produktovou stránku, obvykle to znamená, že je připraven k nákupu, a je na vás, abyste mu usnadnili proces objednávky a zajistili, aby byl co nejplynulejší a nerušivý. Tyto strategie vás nasměrují správným směrem a provedou vás procesem optimalizace kritických prvků produktové stránky.

Felix Rose-Collins

Felix Rose-Collins

Co-founder

is the Co-founder of Ranktracker, With over 10 years SEO Experience. He's in charge of all content on the SEO Guide & Blog, you will also find him managing the support chat on the Ranktracker App.

Začněte používat Ranktracker... zdarma!

Zjistěte, co brání vašemu webu v umístění.

Vytvoření bezplatného účtu

Nebo se přihlaste pomocí svých přihlašovacích údajů

Different views of Ranktracker app