9 Sfaturi importante de design CTA pentru butoanele care îi fac pe oameni să dea clic

Îndemnul dvs. la acțiune (CTA) este punctul culminant al strategiei dvs. de marketing. Indiferent dacă solicitați o achiziție, un cont sau o descărcare. Totul până în acest moment a fost pentru a atrage potențiali clienți la pagina ta de destinație. Și uneori, ai doar câteva cuvinte pentru a încheia înțelegerea.

De aceea, butonul CTA este cel mai important element de design al site-ului tău. Pentru că poate transforma vizitatorii pasivi în utilizatori activi.

Butoanele de apel la acțiune par simple. Dar sunt ușor de încurcat. Sau să fie complet ratat. Aceste 9 sfaturi de design CTA vă vor asigura că obțineți acea conversie. În plus, o mulțime de exemple utile:

1. Faceți clic pe butonul dvs
2. Fii descriptiv cu copia ta
3. Dimensiunea și spațiul corespunzător
4. Conectați-vă folosind persoana întâi
5. Creați urgență și folosiți verbe puternice
6. Încercați un subtitlu
7. Variațiile testului A/B
8. Atenție la versiunea mobilă

Faceți clic pe butonul dvs. CTA

A face ca un buton să pară „accesibil” pare o prostie. Dar nu ai crede cât de des site-urile greșesc. Și are de-a face în principal cu conturul și culoarea butonului.

Tendințele ratei de conversie vin și pleacă. La fel ca „butonul fantomă” transparent cu un chenar subțire și text care se estompează în culoarea de fundal. Deși s-ar putea să arate cool, tind să atragă mai puțină atenție. Opusul a ceea ce ar trebui să facă un CTA eficient.

Singura dată când acest design funcționează de obicei este ca buton secundar:

Sursa: UX Movement

Iată un alt exemplu de butoane CTA care nu se pot face clic în mod evident. Sigur, pagina de destinație a acestei agenții de design arată grozav. Dar ți-ar fi iertat dacă ai derulat peste acest studiu de caz:

Deci, cum îi faci pe oameni să dea clic? Pentru rate de conversie mai mari, butonul dvs. ar trebui să fie mare, îndrăzneț și să funcționeze cu schema de culori aleasă.

Netflix își folosește semnătura roșie pentru a vă atrage atenția. Aproape ca un semn de stop:

Poate funcționa și pentru a avea o culoare contrastantă, astfel încât să iasă în evidență. Cum a făcut aici platforma de comerț electronic BigCommerce:

Acest lucru este valabil și pentru textul din casetă. Asigurați-vă că contrastează astfel încât să îl puteți citi corect.

Degradeurile pot funcționa și în cadrul aceleiași scheme de culori ale mărcii. Ele conferă lucrurilor un aspect modern, mai tineresc:

Sursa: luni

Sfatul meu aici ar fi să încercați să vă păstrați designul CTA evident. A face ceva din cutie poate suna ca o idee bună, dar oamenii sunt creaturi de obicei. Și ai fi uimit de câți vor rata ideea.

Fii descriptiv cu copia ta

Una dintre cele mai simple tactici de optimizare a ratei de conversie (CRO) este redactarea excelentă. Dar nu doar cu bucăți mari de text. Microcopia este la fel de importantă și acoperă detaliile mai mici.

De obicei, îl vedeți în formularele de contact și în barele de actualizare a stării rețelelor sociale. Precum celebrul Facebook „Ce ai în minte?” sau „Începe o postare” de pe LinkedIn.

Microcopia poate ajuta:

• Spuneți utilizatorilor ce trebuie să facă
• A face recomandări
• Abordați preocupările
• Oferiți context

Copia butonului CTA este un alt exemplu. Și ar trebui să spună oamenilor exact ce vor primi/ce se va întâmpla atunci când dau clic pe el.

Acesta a fost butonul CTA al IMPACT. "Descărcare gratuită". Nu prea imaginativ, nu?

Sursa: IMPACT

Dar făcându-l mai descriptiv, au crescut conversiile cu 78,5%. „Arată-mi cum să atrag mai mulți clienți” a atras în mod clar mai mult:

Este tentant să scrieți doar „Click aici”. Dar există atât de multe alternative care vor implica utilizatorii și, sperăm, să inspire acțiunea dorită.

Deci, ce ar trebui să scrii? În primul rând, trebuie să identificați intenția de conversie. Doriți să vă aliniați cu locul în care se află utilizatorii în canal și de unde provin (sursa de trafic).

Sursa: KlientBoost

Apoi trebuie să subliniați valoarea a ceea ce oferiți. Și gestionați orice obiecție.

Sursa: Exemple de marketing

Este un proces atât de unic. Și va depinde de vocea dvs. de nișă și de brand. Dar indiferent de formularea pe care o alegeți, nu uitați să păstrați textul butonului scurt și la obiect.

Dimensiune corect și folosește spațiul alb

Designul butonului CTA este mult mai mult decât culoarea. Dimensiunea butonului este un alt mic detaliu care poate afecta cu adevărat rata de clic. Și spațiul alb este la fel de important ca și textul în sine.

Multe dintre acestea vor depinde de designul dvs. web. Spațiul negativ (alb) atrage atenția asupra anumitor elemente dintr-o pagină. Nu vrei o pagină de pornire aglomerată. Trebuie să existe o cale evidentă de urmat de vizitator.

Airbnb este unul dintre cele mai bune exemple de spațiu negativ făcut corect. Și o culoare contrastantă pentru a o face mai evidentă:

Buffer are ceva mai mult pe pagina lor de pornire, dar încă păstrează butonul CTA aproape de copia principală. În plus, un exemplu de utilizare eficientă a butoanelor fantomă. Acest lucru face foarte clar ce trebuie făcut în continuare:

Cu cât butonul este mai mare, cu atât este mai vizibil. Și trebuie să iasă în evidență pentru a atrage atenția. Dar nu atât de mult încât preia pagina și strică UX-ul.

Dacă sunteți predispus la migrene, uitați-vă în altă parte acum. Iată un exemplu despre cum să nu o faci:

Sursa: Justinmind

Atât de multe elemente de aici arată ca un buton. Nici măcar nu sunt sigur că acest site știe pe ce vrea ca vizitatorii să facă clic.

În schimb, care este primul lucru pe care îl vezi pe pagina de destinație a Spotify?

Butonul uriaș „Go Premium”, nu? Așa se proiectează o cale clară pentru utilizator.

În cele din urmă, mai ai observat ceva despre modelele CTA pentru exemplele bune? Dacă aruncați o altă privire, veți vedea ceva care aproape toate au în comun.

Oamenii de știință au descoperit că oamenilor le plac „formele cu curbe blânde, spre deosebire de punctele ascuțite”. Sunt mai plăcute pentru ochi și ne fac să ne simțim mai liniștiți. Din acest motiv, cele mai eficiente butoane pentru îndemnuri sunt dreptunghiuri cu colțuri rotunjite.

Sursa: CleverTap

Este cel mai popular format dintr-un motiv. Dar încercați diferite opțiuni. Publicul tău ar putea prefera altceva.

Conectați-vă folosind persoana întâi

Un design CTA mai bun poate fi la o modificare. Uneori, un singur cuvânt.

În copywriting, suntem învățați să folosim cuvântul „tu”. Pentru că îl face pe cititor să simtă că i se vorbește direct. Deci crezi că asta s-ar aplica și pentru copierea butonului tău, nu? În mod ciudat, nu atât.

Unbounce a descoperit că schimbarea copiei de pe pagina sa de destinație de la „Începeți perioada de încercare gratuită de 30 de zile” la „Începeți încercarea mea gratuită de 30 de zile” a crescut ratele de clic cu 90%.

Deci, de ce este asta? Ei bine, atunci când cineva se simte conectat la un produs, este mai probabil să facă o conversie. Oferă această notă personală fără a fi nevoie să știi nimic despre ei.

Psihologia marketingului arată că deciziile de cumpărare se bazează în mare parte pe emoție. Deci, doriți ca vizitatorul site-ului dvs. să simtă că este alegerea lor.

Scrierea „meu” îl ajută pe utilizator să vizualizeze acțiunea pe care urmează să o întreprindă. Le oferă control și (sperăm că) îi îndeamnă spre luarea deciziilor.

În plus, poate arăta că vor obține valoare imediată. Like pe pagina de pornire a lui Crazy Egg:

Sursa: Crazy Egg

1-800 Contacts este cel mai mare magazin de lentile de contact din lume. Dar ei fac la fel. Ei se asigură că butoanele lor CTA sunt destinate doar unei singure persoane:

Sursa: 1-800 Contacte

Nu multe companii folosesc această tehnică. Ceea ce înseamnă că iese în evidență când îl vezi. Deci, de ce să nu încerci?

Creați un sentiment de urgență și folosiți verbe puternice

Copia dvs. trebuie să creeze un sentiment de urgență și să atragă atenția utilizatorilor. Acest lucru funcționează bine în special pentru afacerile de comerț electronic. Folosirea cuvintelor precum „acum” și „azi” poate ajuta la stimularea acțiunii. Pentru că ei sugerează că oferta nu va fi disponibilă pentru totdeauna.

„Cumpără acum” este un clasic. Dar putem face mai bine decât atât cu designul nostru CTA.

Sursa: GoSquared

Ai putea încerca formularea de genul:

• „Rafata-te azi”
• „Deblocați reducerea acum”
• „Descărcare gratuită unică”

De asemenea, vrei să-ți faci oferta atractivă și să stârnești curiozitatea. Deci, începeți cu un verb puternic. Nu ceva care pare să fie un efort. Acesta este un mod ușor de a descuraja oamenii.

Iată câteva exemple de ceea ce vreau să spun:

Partea din stânga pare că utilizatorii dvs. vor obține ceva din clic. Partea dreaptă pare că vor trebui să renunțe la timp sau bani.

Poți fi și tu cu adevărat creativ. Ca această versiune a paginii de pornire a lui Huemor:

Sursa: FastCapital360

Sau vechea pagină de destinație a județului Humboldt, care îi dă o întorsătură mistică:

Sursa: ConEmprendimiento

Brainstorming idei cu echipa ta. Oricât de ridicol. Ai fi surprins cu ce vei veni și vei ajunge să folosești. Dar indiferent de formularea pe care o alegeți, nu uitați să vă îndepliniți promisiunea la celălalt capăt.

Încercați un subtitlu lângă butonul de îndemn

Uneori, oamenii au nevoie de un mic ghiont. Și un pic de text sub butonul CTA poate face truc. Nu este un „subtitlu” obișnuit. Dar este cel mai simplu mod de a o descrie.

Dacă ne gândim la textul butonului drept titlu, cel mai popular subtitlu pe care îl veți vedea este „Nu sunt necesare detalii despre cardul de credit”. Dar ai tăi pot spune orice. Și este distractiv să fii puțin creativ cu el.

De multe ori, ele sunt folosite pentru a oferi încredere potențialului client. Și pot aborda principalele puncte dureroase pe care le-ar putea avea oamenii:

Sursa: CoSchedule

CoSchedule înțelege că utilizatorii ar putea crede că este doar o încercare gratuită. De ce nu? Este gratuit pentru totdeauna” clarifică.

De asemenea, le puteți folosi pentru a adăuga câteva dovezi sociale:

Sursa: Basecamp

Acest lucru vă oferă credibilitate instantanee, deoarece utilizatorii pot vedea clar că ceilalți au deja încredere în dvs. De asemenea, poate inspira FOMO, deoarece oamenii cred că trebuie să existe motive pentru atât de mulți abonați.

Dacă aveți o ofertă specială sau o valoare suplimentară care vine cu serviciul dvs., utilizați subtitlul pentru a o evidenția:

Sursa: Moz

Microcopie este o șansă ca vocea mărcii dvs. să strălucească. Chiar dacă este doar o singură propoziție. Deci, nu vă fie teamă să fiți puțin obraznic dacă se potrivește:

Sursa: KlientBoost

De asemenea, puteți fi precis cu exact ce se va întâmpla după ce oamenii dau clic. Spune-le:

• Ce vor primi (idei noi de marketing)
• Câte (17+)
• Și de ce ar trebui să le pese (sunt mai buni decât ceea ce ai tu)

Folosiți aceste exemple ca șabloane pentru inspirație. Sau faci ceva total diferit. Doar asigurați-vă că se potrivește în identitatea mărcii dvs. și distrați-vă cu el.

Nu uitați de testarea A/B

Majoritatea instrumentelor CRO urmăresc îmbunătățirea experienței utilizatorului (UX). Și este posibil să faci deja acest lucru cu părțile principale ale paginilor tale web. Dar ar trebui să o faci și cu elementele mici.

Amazon este notoriu pretențios în ceea ce privește designul butoanelor CTA. Mai ales în cazul utilizării de la terți. Deci, asigură-te că nu încalci nicio regulă cu ale tale.

După aceea, mici modificări aduse designului butoanelor pot avea un impact uriaș. Deci, comparați diferite tipuri de butoane CTA. Apoi, variațiile testului A/B ale:

• Culoarea butonului
• copie CTA
• Font
• Plasarea în designul paginii
• Ferestre pop-up
• Formulare de contact

Sursa: Snov

După cum am discutat mai devreme, uneori schimbarea unui singur cuvânt poate crește rata de conversie sau de clic. Dar înainte de a intra, trebuie să înțelegeți cum navighează vizitatorii pe site-ul dvs.

Vrei să afli lucruri precum:

1. Cu ce ​​elemente încearcă să interacționeze
2. De unde vin
3. Călătoria utilizatorului/pâlnia de cumpărare a site-ului dvs
4. Motivația oamenilor de a fi acolo

Sursa: GIPHY

Odată ce obțineți aceste informații, puteți experimenta lucruri bazate pe fapte, nu pe presupuneri.

De obicei, este mai ușor să compari o versiune A și B cu designul CTA. Dar puteți crește acest lucru și încercați testarea multivariată. Mai simplu este de obicei mai bine la început. Astfel, vei avea un câștigător clar.

Dar nimic nu te împiedică să încerci acel câștigător împotriva unei alte versiuni după aceea. Ar trebui să testați și să comparați întotdeauna. Chiar și atunci când ai găsit ceva care funcționează. Asta fac brandurile de succes.

Atenție la versiunea mobilă

Un sfat rapid pentru a termina. Elementele dvs. de design vor arăta foarte diferit pe un ecran mobil. Lucrezi cu un afișaj mult mai mic și mai puțini pixeli. Așa că aglomerația devine mult mai ușoară.

Tot ceea ce am acoperit devine mai răspândit în versiunea dvs. mobilă. Culorile contrastante trebuie să iasă mai mult în evidență:

Spațiul negativ ar trebui să fie o prioritate:

Și chiar și subtitlul dvs. s-ar putea să se afle într-un loc diferit. Deoarece este posibil ca utilizatorii de telefonie mobilă să nu deruleze suficient de departe pentru a-l vedea dedesubt:

Mulțumiți lui CleverTap pentru acele grafice

Trebuie să se gândească mai mult la UX-ul tău în general pe mobil. Deoarece mobilul reprezintă peste jumătate din tot traficul global de căutare. Nu vă puteți aștepta ca versiunea dvs. desktop să se traducă. Și un pic de efort ar putea duce la o rată de clic mult mai mare.

Concluzie

Designul eficient al CTA este alcătuit din multe dintre aceste mici detalii. Am spus-o de atâtea ori de-a lungul timpului, dar cea mai mică modificare ar putea fi tot ce este nevoie. Chiar și ceva la fel de nesemnificativ precum culoarea sau forma conturului.

Testarea A/B este singura modalitate prin care vei afla. Și nici măcar nu aveți nevoie de un instrument CRO scump pentru a face acest lucru. Urmăriți-vă conversiile. Fa o schimbare. Și vezi dacă există o creștere sau o scădere față de numărul obișnuit.

Doar acordați butonul de îndemn la acțiune atenția pe care o merită. Ar putea fi diferența dintre un client nou sau o oportunitate pierdută.

Ați văzut recent vreun model CTA original? Ați făcut o mică schimbare care a crescut numărul de conversii? Anunțați-ne în comentariile de mai jos.