Když navštívíme většinu webových stránek, máme často na mysli cíl. K dosažení tohoto cíle je obvykle řada kroků, které musíme podniknout, a první krok začíná kliknutím na tlačítko CTA (výzva k akci). Přemýšlejte o tom, kdy jste se poprvé přihlásili ke službě nebo jste stáhli aplikaci, protože proces pravděpodobně zahrnoval interakci s tlačítkem výzvy k akci.

Tlačítka CTA jsou tlačítka, která používáte na svých webových stránkách a která přiměje uživatele ke konverzi cílů. Celým účelem CTA je nasměrovat návštěvníky svých stránek na požadovaný postup. Mezi běžné příklady CTA patří:

  • "Začněte zkušební verzi"
  • "Stáhnout aplikaci / knihu / průvodce"
  • "Registrace pro aktualizace"
  • "Získejte konzultaci"

Dnes budeme diskutovat o 5 osvědčených postupech pro navrhování tlačítek CTA spolu s nejlepšími reálnými příklady, které vám pomohou získat z vašich vstupních stránek co nejvíce kliknutí.

1. Tlačítko pro vizuální nádech

Vaše barva tlačítka je důležitá. Ve skutečnosti, pokud budete chtít vzít jen jednu radu z tohoto článku, měla by být tato: "Zvažte barvu tlačítka CTA". Použitím barvy můžete určitá tlačítka vyniknout více než ostatní, tím, že jim dáte větší vizuální vystupnost.

Používejte kontrastní barvy

Kontrastní barvy fungují nejlépe pro tlačítka CTA, pomocí kontrastní barvy je možné vytvořit výrazné knoflíky, které vyniknou. Měli byste si zvolit kontrastní barvu z barevného schématu webové stránky a současně se s ní spojit s celkovým designem. Zvažte příklad Firefoxu níže. Zelená barva tlačítka CTA na stránce Firefox vyskočí ze stránky a okamžitě získá pozornost uživatele.

image13

Tlačítko Firefox CTA je jasně zelené a vyniká dobře na tmavě modrém pozadí

Další další zajímavé tlačítko CTA naleznete na domovské stránce Hipmunk. Jasné oranžové tlačítko zachycuje pozornost uživatele a definuje další možné kroky.

image7

Negativní prostor

Nejen, že barva je důležitá pro CTA, ale i prostor kolem ní. Bílý prostor (nebo záporný prostor) vytváří nezbytnou místnost pro dýchání a odděluje tlačítka CTA od ostatních prvků vašeho uživatelského rozhraní. Stará domovská stránka Dropboxu byla dobrým příkladem využití negativního prostoru, aby se poprvé objevila CTA. Modrá CTA "Zaregistrujte se zdarma" stojí na světle blues pozadí.

image11

2. Akční text

Psaní textu pro tlačítko výzvy k akci, které přiměje návštěvníky, aby podnikli správné kroky, není snadný úkol. Naštěstí existuje několik věcí, které vám mohou pomoci:

Začněte slovesem

Měli byste se vyvarovat vágních a nudných slov jako "Zadejte pro více informací" pro vaše tlačítka CTA a nahraďte je více slovy zaměřenými na akce, jako je například "Spustit zkušební verzi zdarma" nebo "Získat slevu nyní". Evernote má jednu z nejběžnějších, ale stále pracují na textech orientovaných na akce pro své tlačítko CTA.

image18

Začněte slovesem jako "Start", "Get" nebo "Join"

Zajímavějším příkladem je domovská stránka Treehouse. CTA na webových stránkách Treehouse neříká jen "Zahájit bezplatnou zkušební verzi". říká "Vyžádejte si bezplatnou zkušební verzi." Rozdíl ve znění se může zdát jemný, ale "Vyžádejte si svobodnou studii" zní mnohem osobněji.

image15

Použijte stručný a snadno srozumitelný text pro tlačítka

Nezapomeňte uvést přesně to, co návštěvník získá, pokud klikne na CTA. V ideálním případě byste si měli ponechat text tlačítka na dvě až pět slov.

Přidat návrh hodnot

S největší pravděpodobností jste si všimli, že mnoho tlačítek má ve své kopii slova "volná" a není to náhoda. Použitím takových slov v kopírování knoflíků se zdůrazňuje nabídka hodnoty vaší nabídky. Při psaní vašeho CTA se tedy pokuste najít způsob, jak integrovat jednu (nebo všechny) tři přesvědčivá slova:

  • Volný, uvolnit
  • Bonus
  • Okamžitě

Dovolte mi, abych vám dal příklad: Jeden velký uživatel strachu, který mají uživatelé předtím, než se zavázali, že se zaregistrují na něco, je, že bude bolest zrušit jejich předplatné, pokud se jim služba nebude líbit. Netflix zmírňuje tento strach pomocí slibu "Zrušit kdykoli" hned vedle seznamu "Připojit zdarma za měsíc" CTA.

image10

Vytvořte pocit naléhavosti

Vytvoření pocitu naléhavosti vašich tlačítek CTA může poskytnout impozantní míru prokliku. Například můžete použít tlačítko, jako je "Zaregistrujte se a získejte 25% pouze z dnešního dne!" Omezení času, kdy někdo musí učinit rozhodnutí, dělá, že lidé chtějí požádat o nabídku, dokud mohou.

Užitečný text

Někdy můžete zvážit přidání dalšího řádku informací do textu tlačítka. Tato praxe je běžná s bezplatnými zkušebními tlačítky. Tlačítko bezplatné zkušební verze může například v malém textu pod tlačítkem CTA obsahovat text 30denní zkušební, žádná kreditní karta s textem "Spustit bezplatnou zkušební verzi". Tento extra text by měl usnadnit rozhodovací proces.

3. Ukažte jej bez posouvání

Umístění tlačítek výzvy k akci je stejně důležité jako barva a zpráva. Tlačítko CTA by mělo být umístěno na snadno vyhledávaném místě, které organicky vyplývá z toku webové stránky. Měli byste se snažit držet tlačítko CTA nad záhybem tak, aby jej uživatelé nikdy nezmeškali. V ideálním případě by vaše tlačítko CTA mělo být jednou z prvních věcí, které uživatel na stránce vidí, když se k němu dostanou. Doplňkové informace by měly zůstat pod záhybem, kde zůstávají přístupné, ale neruší.

4. Velké tlačítko se zaoblenými rohy

Přemýšlejte o tom, jak design sděluje přínos. Jak uživatelé chápou prvek jako tlačítko? Použijte tvar a velikost pro vytvoření prvku jako tlačítka.

Udělejte to dost

CTA by měla být dostatečně velká, aby se dala vidět z dálky, ale ne tak velká, že by ztratila pozornost z hlavního obsahu na stránce

Uživatelské tlačítka se zaoblenými rohy

Tvar tlačítka může hrát velkou roli. To je prokázané skutečnosti že zaoblené rohy jsou pro oči jednodušší. V testu ContentVerve se zaokrouhlené zelené tlačítko dalo lepší než modrý obdélník.

image8

5. Méně je více, když jde o volby

Mějte na paměti, že pokud chcete, aby vaši zákazníci podnikli kroky, musíte jim pomoci, odstraněním všech možných překážek. Když mají uživatelé příliš mnoho možností, mají tendenci se zmást. Takže je lepší nabídnout potenciálním zákazníkům pouze jednu možnost.

Pokud stále chcete zahrnout několik možností tlačítek, přenechejte váhu jedné volbě než ostatní, abyste pomohli uživatelům přivést k určité cestě. Jeden dobrý příklad je Evernote: jakmile se dostanete do dolní části stránky Evernote, je docela jasné, že výhodnější volbou je "Registrace zdarma", zatímco CTA pro uživatele, kteří porovnávají plány, je velmi sekundární.

image16

Závěr

Chcete-li dosáhnout efektivního designu CTA, musíte zvážit více než samotné tlačítko. Je také důležité přemýšlet o barvě pozadí, obklopujících obrázcích, okolním textu a mnoha dalších prvcích. Skupina Basecamp pochopila důležitost těchto prvků a navrhla dokonalé uspořádání pro vstupní stránku. Dokonce i mikroskopie, kterou používají pod tlačítkem CTA ("4,714 firem se přihlásilo tento týden!") Zvyšuje důvěru potenciálních klientů.

image14

Doufám, že tipy uvedené v tomto článku vám pomohou vytvořit pro vaše webové stránky tlačítko pro lepší výzvu. Posledním okamžikem je důležitost testování - pokud se rozhodnete obnovit CTA na vašem webu, nezapomeňte vyzkoušet, zda funguje pro vaše publikum.