Jak na CTA (Call to Action) tlačítko, které zvedá prodeje o desítky procent? Většina webů ho používá špatně.
By Jakub KluckýTichý zabiják konverzí, kterého máte přímo na webu
Máte krásné, moderní webové stránky. Investovali jste nemalé peníze do jejich vytvoření. Máte skvělé fotky, texty a možná i slušnou návštěvnost. Jenže... telefon nezvoní. Poptávky nechodí. E-shop neprodává. Kde je chyba?
Je velmi pravděpodobné, že viníkem je malý, často přehlížený prvek: CTA (Call to Action) tlačítko. Tedy "výzva k akci".
Je to ten nejdůležitější most mezi pasivním návštěvníkem a platícím zákazníkem. A co je na tom nejhorší? Většina firem, možná i vaše konkurence, ho používá naprosto špatně. Používají vágní fráze, nevýrazné barvy a špatné umístění.
V tomto komplexním průvodci se nebudeme bavit jen o tom, jakou barvu má tlačítko mít. Půjdeme do hloubky. Ukážeme si psychologii, textařské triky i designové principy, které dokáží zvednout vaše prodeje a poptávky o desítky procent. Toto jsou přesně ty principy, které aplikujeme při tvorbě stránek pro naše klienty, ať už v Pardubicích nebo po celé ČR, abychom zajistili, že jejich vlastní webové stránky nejsou jen hezkou vizitkou, ale výkonným obchodním nástrojem.
Pojďme se podívat, jak přestat ztrácet zákazníky a začít konečně vydělávat.
Kapitola 1: Co je to CTA a proč je to nejdůležitější prvek vašich internetových stránek?
Call to Action (CTA), neboli výzva k akci, je přesně to, co název napovídá. Je to jakýkoliv prvek na webu (nejčastěji tlačítko, ale i textový odkaz nebo banner), který říká návštěvníkovi, co má udělat dál.
- "Koupit hned"
- "Odeslat poptávku"
- "Stáhnout e-book zdarma"
- "Domluvit si konzultaci"
- "Zaregistrovat se"
Představte si, že váš web je obchod. Návštěvník vejde dovnitř. Rozhlíží se. Líbí se mu vystavené zboží (design webových stránek). Přečte si popisky (obsah). Ale nikde není pokladna. Nikde není prodavač, který by řekl: "Líbí se vám to? Můžete si to rovnou odnést."
Návštěvník je zmatený. Možná by i koupil, ale neví jak. Tak se otočí a odejde ke konkurenci, která má proces nákupu jasně daný.
Přesně to se děje na webu bez silného CTA.
Vytvoření webových stránek je investice. Ať už byla cena vytvoření webových stránek jakákoliv, cílem je, aby se vám vrátila. CTA je ten motor, který zajišťuje návratnost této investice. Bez něj máte jen drahý online leták. S ním máte prodejní stroj.
Kapitola 2: 5 nejčastějších chyb, které zabíjejí vaše konverze
Než se vrhneme na to, jak to dělat dobře, pojďme si ukázat, jak to většina dělá špatně. Vidíme to denně, když k nám klienti chodí s poptávkou na redesign webových stránek.
1. Vágní a nudný text ("Více zde", "Odeslat")
Toto je hřích číslo jedna. Text na tlačítku musí být jasný, akční a musí komunikovat HODNOTU, kterou uživatel získá.
- Špatně: "Více zde" (Co "více"? Proč bych měl klikat?)
- Lépe: "Prohlédnout kompletní specifikace"
- Špatně: "Odeslat" (Tohle nikdo nechce. Zní to jako práce. Co odesílám? Kam?)
- Lépe: "Chci nezávaznou poptávku" nebo "Zaslat můj dotaz"
2. Design, který splývá (tzv. "Ghost Buttons")
Grafika webových stránek je klíčová, ale někdy designér v zájmu minimalismu "zabije" konverze. Tlačítko, které má stejnou barvu jako zbytek prvků nebo je jen průhledné s tenkým rámečkem (ghost button), je snadné přehlédnout. CTA musí "křičet" o pozornost. Musí být vizuálně nejvýraznějším prvkem na dané části stránky.
3. Špatné umístění (Hledání pokladu)
Návštěvník by neměl CTA hledat. Mělo by být přesně tam, kde ho intuitivně očekává. Nejčastější chyba je mít CTA až "pod ohybem" (below the fold) na úvodní stránce webu, takže ho uživatel bez scrollování nevidí. Nebo ho "schovat" doprostřed dlouhého textu, kde zanikne.
4. Příliš mnoho možností (Paralýza z výběru)
Chcete, aby se přihlásili k newsletteru, koupili produkt, sledovali vás na Facebooku a ještě si stáhli katalog? Pokud dáte na jednu stránku pět stejně výrazných tlačítek, uživatel neudělá nic. Bude paralyzován výběrem. Musíte mít jedno primární CTA a případně jedno méně výrazné sekundární.
5. Ignorování mobilních zařízení
Moderní webové stránky musí být responzivní. Ale jen "zmenšit" web nestačí. Je CTA tlačítko na mobilu dostatečně velké, aby se na něj dalo pohodlně kliknout palcem? Není příliš blízko jiného odkazu? Pokud se uživatel na mobilu netrefí, je frustrovaný a odchází.
Kapitola 3: Anatomie dokonalého CTA – Text (Copy), který prodává
Text je 80 % úspěchu vašeho tlačítka. Návrh webové stránky může být geniální, ale pokud text nestojí za nic, nikdo neklikne.
1. Začněte silným slovesem
CTA je výzva k akci. Musí tam být akce. Zapomeňte na podstatná jména.
- Místo: "Náš ceník"
- Použijte: "Zobrazit ceník"
- Místo: "Registrace"
- Použijte: "Zaregistrovat se zdarma"
2. Dejte jasnou hodnotu (Co získám?)
Uživatel se vždy podvědomě ptá: "Co z toho budu mít?". Odpovězte mu přímo na tlačítku.
- Slabé: "Stáhnout"
- Silné: "Stáhnout e-book zdarma"
- Slabé: "Objednat"
- Silné: "Objednat konzultaci bez závazků"
3. Používejte první osobu ("Chci...")
Tohle je pokročilý psychologický trik. Když text změníte z rozkazu ("Získejte") na osobní přání ("Chci"), uživatel si danou akci v hlavě "přivlastní".
- Dobré: "Získejte svůj audit SEO"
- Geniální: "Chci svůj bezplatný audit SEO"
- Dobré: "Stáhněte si případovku"
- Geniální: "Chci vidět případovou studii"
4. Vytvořte pocit naléhavosti (Urgency)
Proč by to měl udělat právě teď?
- "Objednejte dnes a získejte dopravu zdarma"
- "Posledních 5 míst v kurzu"
- "Začněte ihned"
5. Zbavte se rizika (Microcopy)
Přímo pod tlačítko můžete přidat krátký text (tzv. microcopy), který rozptýlí poslední obavy.
- "Objednat schůzku"
- (Microcopy: Vše je 100% nezávazné)
- "Spustit 30denní zkušební verzi"
- (Microcopy: Nevyžadujeme platební kartu)
- "Odeslat poptávku"
- (Microcopy: Ozveme se vám do 24 hodin)
Kapitola 4: Vizuální stránka CTA – Jak na design webových stránek, který vede oko?
Když máte text, je čas na webové stránky design. Jak má tlačítko vypadat?
1. Kontrast je král
Tlačítko NESMÍ splývat. Musí být tou nejkontrastnější věcí na obrazovce. Zapomeňte na chvíli na vaši "korporátní paletu", pokud je celá v odstínech šedé a béžové.
- Psychologie barev:
- Oranžová: Často se uvádí jako nejlepší konverzní barva. Je energická, přitahuje pozornost (Amazon ji používá).
- Zelená: Skvělá pro "pozitivní" akce (Začít, Registrovat se zdarma). Symbolizuje "Jdi", "Vpřed".
- Červená: Budí pozornost, ale i varování. Může fungovat pro naléhavé akce ("Koupit hned - sleva končí!"), ale buďte opatrní.
- Důležitější než barva je KONTRAST. Pokud je váš web modrý, udělejte tlačítko oranžové. Pokud je zelený, udělejte ho žluté. Musí "vyskakovat".
2. Tvar a velikost
- Velikost: Musí být dostatečně velké, aby bylo k nepřehlédnutí a snadno klikatelné (hlavně na mobilu), ale ne tak obří, aby působilo agresivně.
- Tvar: Mírně zaoblené rohy jsou pro oko přívětivější a studie ukazují, že vedou pohled "dovnitř" tlačítka, na text. Extrémně ostré rohy mohou působit až varovně.
3. Nechte ho dýchat (Whitespace)
Okolo tlačítka musí být dostatek volného (bílého) místa. Pokud ho "nalepíte" na text nebo obrázek, zanikne. Volný prostor okolo něj mu dává vizuální důležitost.
4. Použijte vizuální nápovědy
Oko můžete k tlačítku doslova "dovést". Může to být šipka, ikona, nebo dokonce fotografie člověka, který se dívá směrem k tlačítku. Naše oči instinktivně následují pohled ostatních.
Kapitola 5: Kam CTA umístit? Strategické pozice
Můžete mít dokonalý text i design, ale pokud je tlačítko na špatném místě, nikdo ho nenajde.
- "Nad ohybem" (Above the Fold) na hlavní stránce: Každá úvodní stránka webu musí mít jedno jasné, primární CTA hned nahoře, viditelné bez scrollování. Návštěvník musí do 3 sekund vědět, kdo jste, co nabízíte a co má udělat. Příklad: Chci webové stránky na míru
- Na konci každé stránky/článku: Když si návštěvník dočetl váš blogový článek nebo popis služby, je v ideálním rozpoložení pro další krok. Co má udělat teď? Nabídněte mu relevantní akci. Příklad po článku o SEO: Chci bezplatný SEO audit
- V ceníku: U každé cenové varianty musí být jasné tlačítko. "Vybrat tento plán" nebo "Poptat tuto službu".
- Fixní (Sticky) lišta: Velmi efektivní je mít CTA v horní liště (headeru), která zůstává viditelná i při scrollování. Uživatel tak má možnost provést akci kdykoliv, aniž by musel hledat.
- Exit-Intent Pop-up (Opatrně!) Vyskakovací okno, které se objeví, když uživatel míří myší pryč z okna prohlížeče. Je to poslední šance, jak ho zaujmout. Ale musí nabízet skutečnou hodnotu ("Neodcházejte! Získejte 10% slevu").
Kapitola 6: Primární vs. Sekundární CTA
Ne každá akce má stejnou váhu. Váš hlavní cíl je zřejmě poptávka webové stránky nebo prodej. Ale někdo ještě není připraven nakoupit. Můžete mu nabídnout "měkčí" konverzi.
- Primární CTA: Váš hlavní cíl. Musí být vizuálně dominantní (např. plná oranžová barva).
- Příklad: "Objednat nyní"
- Sekundární CTA: Alternativní, méně závazná akce. Musí být vizuálně podřízená (např. jen textový odkaz nebo "ghost button" – průhledné s rámečkem).
- Příklad: "Více o produktu"
Chyba: Mít dvě stejně barevná tlačítka vedle sebe. "Koupit" a "Zrušit". Uživatel se může snadno splést.
Kapitola 7: Klíč k úspěchu? Nikdy nehádejte – Testujte!
Vše, co jsme si doteď řekli, jsou osvědčené postupy. Ale váš byznys a vaši zákazníci jsou unikátní. Co funguje jednomu, nemusí fungovat vám.
Jediný způsob, jak zjistit pravdu, je A/B testování.
- Vytvoříte dvě verze stránky (Varianta A a Varianta B), které se liší POUZE v jednom prvku – třeba v textu na CTA tlačítku.
- Verze A: "Objednat službu"
- Verze B: "Chci nezávaznou poptávku"
- Polovině návštěvníků ukážete A, polovině B.
- Po týdnu změříte, která verze přinesla více poptávek.
Testovat můžete cokoliv: barvu, text, umístění, velikost. Často i drobná změna, jako je záměna jednoho slova, může vést k nárůstu konverzí o oněch desítek procent.
Kapitola 8: Proč je CTA klíčové při vytvoření webových stránek
Mnoho lidí se při poptávce webové stránky soustředí jen na cenu webových stránek. Chtějí "nějaký web" co nejlevněji. Jenže cena za tvorbu webových stránek je relativní.
Levné webové stránky (třeba stránky webnode nebo od studenta) mohou mít hezkou grafiku webových stránek, ale postrádají strategii. Postrádají promyšlenou cestu zákazníka a chybí jim silná, testovaná CTA. Ve výsledku jsou to vyhozené peníze, protože web nevydělává.
Naopak profesionální webové stránky od studia, které rozumí marketingu, nemusí být nutně nejdražší, ale cena webových stránek odráží přidanou hodnotu. Tato hodnota spočívá v návrhu webové stránky tak, aby každý prvek, každá html stránka, vedla uživatele k cíli.
Vývoj webových stránek není jen kódování. Je to psychologie, marketing a obchodní strategie v jednom.
Kapitola 9: Jak vám studio (nejen) v Pardubicích může pomoci?
My víme, že jako majitel firmy nemáte čas řešit A/B testování nebo psychologii barev. Chcete výsledek. Chcete, aby vaše vlastní stránky generovaly zisk.
A přesně proto nabízíme víc než jen zhotovení webových stránek. Jsme studio, které se na vás dívá komplexně. Pro naše klienty v Pardubicích i po celé republice zajišťujeme prémiový servis bez stresu.
- Analyzujeme váš cíl: Než napíšeme řádek kódu, ptáme se: "Čeho chcete dosáhnout?".
- Navrhneme strategii: Vytvoříme webové stránky na míru, kde každý prvek, včetně CTA, má svůj smysl a vede k cíli.
- Dodáme vše v balíčku: Postaráme se o design webových stránek, vývoj, profesionální fotografie, texty, a následně i o SEO a marketing.
- Optimalizujeme: Naše práce nekončí spuštěním. Sledujeme data a optimalizujeme CTA tlačítka tak, aby vaše online stránky vydělávaly maximum.
Neprodáváme jen webové stránky. Prodáváme funkční obchodní nástroj.
Závěr: Přestaňte být pasivní
Přestaňte doufat, že si vás zákazník "nějak najde" a "nějak poptá". Váš web musí být aktivní prodejce. Musí každého návštěvníka chytit za ruku a jasně mu říct, co má udělat dál.
Projděte si teď hned své internetové stránky a položte si u každé stránky otázku:
- Je zde jasná výzva k akci?
- Je dostatečně kontrastní?
- Je text akční a nabízí hodnotu?
- Je snadno k nalezení?
Pokud je odpověď byť jen jednou "ne", přicházíte o peníze.
Máte pocit, že vaše webové stránky nefungují na 100 %?
Nechte si od nás udělat nezávazný audit. Podíváme se na vaše CTA, SEO i celkový design a navrhneme, jak z vašeho webu udělat stroj na peníze.
Chci nezávaznou konzultaci zdarma. Ozveme se do 24 hodin a probereme vaše cíle.)
