• UI & UX

Kattintson a kattintásra: 8 tipp a hatékony CTA-tervezéshez

  • Felix Rose-Collins
  • 6 min read
Kattintson a kattintásra: 8 tipp a hatékony CTA-tervezéshez

Intro

A Google keresési találatok első oldalának elérése és a közönség figyelmének felkeltése igazi kihívás, mivel az emberek ritkán kattintanak a második oldalon található találatokra. Oldalának SEO-optimalizálása elengedhetetlen e cél eléréséhez.

Ez azonban nem jelenti azt, hogy az első tíz helyezett feltétlenül jó konverziós rátát biztosít Önnek. Igaz, hogy a weboldal látogatottságának növekedésére számíthat, de van egy másik, a konverzió szempontjából döntő fontosságú elem is - a hatékony felhívás a cselekvésre.

A CTA fő szerepe, hogy a látogatókat a következő lépés felé irányítsa, és cselekvésre ösztönözze őket - feliratkozás egy hírlevélre, e-könyv letöltése, termék vagy szolgáltatás megvásárlása, vagy feliratkozás egy próbaverzióra.

Egy rosszul megtervezett CTA azonban olyan jó, mintha nem is lenne, mivel nem fog kattintásokat generálni, és nem fogja megkönnyíteni a konverziót.

Ebben a cikkben a legjobb tippeket fogjuk ismertetni az ellenállhatatlan CTA-k megtervezéséhez, amelyekre a potenciális vásárlók nem tudnak majd nem rákattintani. Olvasson tovább, hogy többet tudjon meg!

1. Használjon ragadós oldalsáv CTA-t

A CTA-k lényege, hogy megragadják a látogatók figyelmét, és rávegyék őket a kattintásra.

Egyes weboldalakon, például a kezdőlapokon vagy blogbejegyzésekben sok tartalom van, és a CTA-k könnyen elvegyülnek a többi elem között, és gyakorlatilag láthatatlanná válnak.

Ismerje meg a Ranktracker-t

Az All-in-One platform a hatékony SEO-hoz

Minden sikeres vállalkozás mögött egy erős SEO kampány áll. De a számtalan optimalizálási eszköz és technika közül lehet választani, ezért nehéz lehet tudni, hol kezdjük. Nos, ne félj tovább, mert van egy ötletem, ami segíthet. Bemutatom a Ranktracker all-in-one platformot a hatékony SEO-ért.

Végre megnyitottuk a Ranktracker regisztrációt teljesen ingyenesen!

Ingyenes fiók létrehozása

Vagy Jelentkezzen be a hitelesítő adatokkal

Adjon meg egy ragadós oldalsáv CTA-t.

Ez a lebegő gomb a weboldal oldalára van rögzítve, és látható marad, ahogy a felhasználó felfelé és lefelé görget az oldalon, anélkül, hogy túlságosan tolakodó vagy zavaró lenne. Nem kell aggódnia, hogy a potenciális vásárló elfelejti-e a fantasztikus ajánlatát, miközben egy cikket olvas vagy ügyfélértékeléseket nézeget.

Az ATH Sport 10% kedvezményt ad az első megrendelésre, és ezt az ösztönzőt a honlapjukon és az egész weboldalukon egy "Mentés 10%" feliratú, ragadós oldalsávos CTA bevezetésével népszerűsíti. Így a látogatókat finoman emlékeztetik arra, hogy cselekedjenek és igényeljék a kedvezményt.

Use a sticky sidebar CTA (Forrás: ATH Sport)

2. A negatív tér kihasználása

Az egyik legnagyobb hiba, amit a CTA-val elkövethetsz, hogy egy hatalmas szövegtömb közepébe temeted. Ez egy biztos módja annak, hogy a látogatók ne vegyék észre, és konvertálás nélkül távozzanak.

Ne féljen kihasználni a negatív teret, vagyis a tervnek azt a területét, amelyet nem foglal el szöveg vagy más elem. Ha fehér térrel veszi körül a CTA-t, vizuális törést hozhat létre, amely segít a néző figyelmét a gombra irányítani.

Minél kevesebb zavaró tényező van a CTA körül, annál könnyebben kattintható.

Ismerje meg a Ranktracker-t

Az All-in-One platform a hatékony SEO-hoz

Minden sikeres vállalkozás mögött egy erős SEO kampány áll. De a számtalan optimalizálási eszköz és technika közül lehet választani, ezért nehéz lehet tudni, hol kezdjük. Nos, ne félj tovább, mert van egy ötletem, ami segíthet. Bemutatom a Ranktracker all-in-one platformot a hatékony SEO-ért.

Végre megnyitottuk a Ranktracker regisztrációt teljesen ingyenesen!

Ingyenes fiók létrehozása

Vagy Jelentkezzen be a hitelesítő adatokkal

A Flamingo a CTA-nak a honlapon elegendő teret ad, és elkülöníti a többi elemtől, így a látogatók figyelmét a fő célra - a távozáskövető hozzáadására a Slackhez - irányítja. A sok fehér tér ellenére a design nem tűnik üresnek vagy befejezetlennek, így a megfelelő egyensúly megtalálása kulcsfontosságú.

Leverage negative space (Forrás: Flamingo)

3. A sürgősség érzetének megteremtése

A sürgősség és a szűkösség erőteljes konverziós ösztönzők, ezért ezeket a pszichológiai alapelveket be kell építenie a CTA-szövegébe.

Vegyen példát az Amazonról és az okos "Csak 1/2/3 maradt raktáron" feliratról, amely még a bizonytalan ügyfeleket is arra ösztönzi, hogy azonnal rendeljék meg a terméket, mielőtt valaki más elkapja.

Az emberek a ritka vagy hamarosan elfogyó termékeket értékesebbnek érzékelik, ami viszont a kihagyástól való félelmet (FOMO) váltja ki. Ezt a jelenséget kihasználhatja, ha olyan CTA-szövegeket készít, amelyek a korlátozott termékelérhetőség körül forognak.

A sürgősség hangsúlyozásához használjon olyan időzítő szavakat, mint a Most, Azonnal vagy Ma.

A Bed Bath & Beyond honlapjának CTA-ja remek példa a sürgősség és a szűkösség kombinálására. A vásárlókat a "Vásárolj most" felkérésre invitálják, mivel az ajánlat január 8-ig érvényes, de ezt a lehetőséget a "Amíg a készlet tart" hozzáadásával még tovább minimalizálják. Az a tény, hogy maga a CTA egy nagy piros bannerben található, amely a hajtás fölött helyezkedik el, még feltűnőbbé és meggyőzőbbé teszi azt.

Create a sense of urgency - Bed Bath & Beyond (Forrás: Bed Bath & Beyond)

Ajanuári honlapon a CTA egy kicsit másképp veszi a sürgősséget. A gondosan kidolgozott "Csatlakozz a várólistához" megfogalmazás az alkalmazás körüli pezsgést és keresletet teremt azáltal, hogy azt sugallja, hogy vannak más potenciális ügyfelek is, akik türelmetlenül várják a bevezetést. Ez az egyszerű, mégis érdekes CTA azért működik, mert egyfajta exkluzív hangulatot áraszt - olyan, mintha felkerülne egy VIP-klub listájára.

Create a sense of urgency - January (Forrás: január)

4. Beleértve a hatalmi szavakat

Ahogy a nevük is sugallja, az erőszavak képesek érzelmeket kiváltani a potenciális vásárlókból. A vásárlási döntések 95%-a tudat alatt történik, ami azt jelenti, hogy az érzelmek fontos szerepet játszanak a folyamatban.

Tehát, beleértve az olyan hatalmi szavakat, mint

  • Ingyenes
  • Csodálatos
  • Új
  • Hatékony
  • Easy
  • Azonnal
  • Garantáltan
  • Nincs kockázat
  • Tanúsított
  • Védett
  • Tesztelt
  • Ellenőrzött
  • Extra

a megfelelő akkordot fogja megütni a közönségedben, és cselekvésre készteti őket.

Amint láthatja, néhány ilyen szó célja, hogy meggyőzze a vásárlót arról, hogy nyugodtan kattintson a gombra, és vásároljon vagy iratkozzon fel egy hírlevélre. Mások az ajánlatod értékjavaslatának kiemelésére összpontosítanak.

AzEvernote honlapja azt ígéri a felhasználóknak, hogy az alkalmazással képesek lesznek rendszerezni az életüket, míg a CTA ingyenes regisztrációra csábítja őket. És ki tudna visszautasítani egy ilyen csábító ajánlatot?

Include power words - Evernote (Forrás: Evernote)

Hasonlóképpen, a BaseLang honlapjának CTA-ja arra hívja fel a felhasználókat, hogy "mindössze 1 dollárért" kezdjék el a spanyol leckéket, ami a legjobb dolog az ingyenes szolgáltatás mellett. A márka általános üzenetküldése más erőteljes szavak segítségével, mint például a "korlátlan" vagy az "all-you-can-eat", amelyek mindkettő az ajánlat értékét kommunikálják, miszerint a potenciális ügyfelek egy hétig kipróbálhatják az ajánlatot, és egy jelképes 1 dolláros díjat fizetnek.

Include power words - BaseLang (Forrás: BaseLang)

5. Tegye a CTA-t pop

Bizonyára hallott már a 15 másodperces szabályról, amely szerint mindössze negyed perc áll rendelkezésére, hogy megragadja látogatói figyelmét. Ez nem ad túl sok mozgásteret, ami azt jelenti, hogy gyorsan kell cselekednie, és gondoskodnia kell arról, hogy a CTA az első dolgok között legyen, amit az emberek észrevesznek, amikor a weboldalára érkeznek.

A színpompa az egyik legjobb módja ennek a célnak az elérésére. Különböző vélemények léteznek arról, hogy melyik szín növeli a konverziót, de a zsűri még mindig nem döntött ebben a kérdésben. Az azonban biztosra vehető, hogy nem annyira arról van szó, hogy pirosat, zöldet, kéket vagy sárgát választasz-e, hanem arról, hogy kontrasztot teremts.

Használhat például úgynevezett komplementer színeket, amelyek a színkör ellentétes oldalán helyezkednek el. Ha a weboldala többnyire kék színű, akkor egy narancssárga CTA erős kontrasztot fog teremteni.

AMenlo Caoching honlapja fehér és szürke színekben pompázik, így a CTA-nak választott merész piros szín azonnal láthatóvá teszi azt. A dizájn a negatív térből is profitál, ami még jobban kiemeli a CTA gombot, és kiemeli a semleges háttérből.

Make your CTA pop (Forrás: Menlo Coaching)

6. Ne legyen homályos

Ne várja el a látogatóitól, hogy következtetéseket vonjanak le arra vonatkozóan, hogy mi történik ezután - mondja el nekik.

A "Kattints ide" vagy "Küldés" CTA gombok csak összezavarják az embereket, és ez a legrosszabb dolog, amit tehetsz.

A trükk az, hogy világosan közölje a látogatókkal, milyen előnyökkel jár számukra a cselekvés, és tájékoztassa őket a következő lépésről.

A Dropbox ezt a "mit hoz nekem" megközelítést alkalmazza a honlapján azzal, hogy azt mondja a potenciális ügyfeleinek, hogy a CTA gombra kattintva megtalálják a számukra legjobb csomagot. Nyilvánvaló, hogy a következő oldalon olyan tervezési részleteket, funkciókat és összehasonlításokat találnak, amelyek segítenek nekik a döntés meghozatalában.

Don’t be vague (Forrás: Dropbox)

7. Társadalmi bizonyíték hozzáadása

Ha a potenciális ügyfelek megtérítéséről van szó, semmi sem működik jobban, mint a társadalmi bizonyíték. A vásárlási döntések 87%-a online kutatással kezdődik, a vásárlók pedig átlagosan tíz véleményt olvasnak el, mielőtt megrendelik a terméket.

Mivel azonban nem szeretné, ha potenciális ügyfelei elhagynák weboldalát, miközben ügyfélértékeléseket és ajánlásokat keresnek, a legjobb, ha a CTA megjelenése előtt már itt megmutatja nekik a társadalmi bizonyítékot.

Így bizalmat építhet, és eloszlathatja a vásárlással kapcsolatos esetleges kételyeiket.

A Buffer pontosan ezt teszi a honlapon. A CTA-kat boldog ügyfelek idézeteivel párosítják, amelyek kiemelik, hogy a platform használata hogyan könnyíti meg az életüket. A hitelesség további fokozása érdekében a márka az ügyfelek neveit és fényképeit is beillesztette. Ez az egyszerű taktika sokat segít, mivel arcot ad a névhez, és hitelesebbé teszi a társadalmi bizonyítékot.

Add social proof (Forrás: Buffer)

8. Tartsa a dolgokat egyszerűen

Az eddig tárgyalt tippek azt a benyomást kelthetik, hogy a CTA-knak túlzónak kell lenniük ahhoz, hogy működjenek.

Az igazság azonban az, hogy az egyszerűséget gyakran alábecsülik.

Ismerje meg a Ranktracker-t

Az All-in-One platform a hatékony SEO-hoz

Minden sikeres vállalkozás mögött egy erős SEO kampány áll. De a számtalan optimalizálási eszköz és technika közül lehet választani, ezért nehéz lehet tudni, hol kezdjük. Nos, ne félj tovább, mert van egy ötletem, ami segíthet. Bemutatom a Ranktracker all-in-one platformot a hatékony SEO-ért.

Végre megnyitottuk a Ranktracker regisztrációt teljesen ingyenesen!

Ingyenes fiók létrehozása

Vagy Jelentkezzen be a hitelesítő adatokkal

Sok esetben nagyszerű eredményeket érhetsz el, ha a CTA-t egyszerűvé teszed mind a design, mind a konverziós folyamat szempontjából.

AJira honlapjának CTA-ja a "Continue with Google" CTA-val minden lehetőséget kipipál. Az ördög a részletekben rejlik, és bár látszólag semmi különös nem történik itt, ennek a CTA-nak a hatékonysága abban rejlik, hogy szuperegyszerűvé teszi a dolgokat azok számára, akik a regisztráció mellett döntenek.

A bonyolult regisztrációs folyamat helyett a Jira időt takarít meg a felhasználóknak azzal, hogy a Google-fiókjukon keresztül férhetnek hozzá a platformhoz. Mindössze néhány kattintást vesz igénybe, és nincs idegesítő űrlapkitöltés, ami sok elhagyott regisztrációért és bevásárlókocsiért felelős. Ráadásul a szöveg tartalmazza azt a mágikus, nyitott szezámos hatalomszót, a Free-t, amely képes meggyőzni a bizonytalankodókat, hogy kattintsanak és folytassák.

Keep things simple (Forrás: Jira)

Befejezés

A cselekvésre való felhívás lehet a legkisebb tervezési elem a weboldaladon, de jelentősége óriási. Enélkül a potenciális ügyfelek nem tudnák, hogy mit vársz el tőlük, és mi legyen a következő lépésük. Ezért alaposan fontolja meg a CTA-k kialakítását, és ne becsülje le őket. Ezek a taktikák segítenek abban, hogy a kattintások özönleni fognak.

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.

Kezdje el használni a Ranktracker-t... Ingyen!

Tudja meg, hogy mi akadályozza a weboldalát a rangsorolásban.

Ingyenes fiók létrehozása

Vagy Jelentkezzen be a hitelesítő adatokkal

Different views of Ranktracker app