Astăzi vom vorbi despre butoanele „Call to action” și apoi CTA. Elementele CTA, după cum sugerează și numele, încurajează utilizatorul să ia unele măsuri pe site. Cu toate acestea, designerii le tratează adesea cu dispreț. Înțelegerea principiilor în această chestiune va crește eficiența produsului finit. Din acest material veți învăța cum să creați corect un buton CTA.

Este important să aveți cel puțin o înțelegere de bază a modului în care culoarea, dimensiunea, conținutul și alți factori afectează rata de conversie a unui buton CTA. Principiile în sine sunt destul de simple, dar ele trebuie aplicate în etapa de planificare a proiectării site-ului.

Scopul butoanelor de apel la acțiune

Butoanele CTA pot transporta diverse funcții. La urma urmei, un „apel la acțiune” poate însemna orice. Dar principiu principal butoane pentru a forța un utilizator care vă vizitează site-ul să întreprindă o acțiune. De exemplu, adăugați un produs în coș, descărcați ceva, furnizați informații etc.

Deoarece apelul poate fi pentru orice acțiune, atunci când creați un buton trebuie să luați în considerare atât acțiunea în sine, cât și tipul de site și publicul țintă.

Tipuri de butoane de apel la acțiune

Sunt diverse tipuri butoane CTA. Mai jos veți găsi cele mai comune tipuri, sortate după tipul de acțiune pe care îl încurajează pe utilizator să o întreprindă.

1. Adăugați în coș

Magazinele online folosesc de obicei o serie de butoane CTA, dar cele mai populare sunt butoanele „Adaugă în coș”. Aceste butoane sunt de obicei plasate pe paginile produselor și încurajează utilizatorul să cumpere un anumit produs. Acestea sunt de obicei concepute cu text scurt cu un apel la „Cumpără” sau „Adaugă în coș” și o pictogramă a unui card bancar sau a unui coș.

2. Descărcați

Butoanele „Descărcare” arată ca tipul anterior prin aceea că oferă utilizatorului să intre în posesia articolului oferit, adică să îl descarce. În cazul acestui tip de buton, designerii preferă să ofere utilizatorului mai multe informații adăugând, de exemplu, versiunea produsului și dimensiunea fișierului.

3. Versiune de încercare

Unele site-uri încearcă să intereseze clientul oferindu-i o versiune de probă a produsului. Ar putea fi o descărcare gratuită sau cont gratuit, in functie de tipul de serviciu sau produs oferit. Unii designeri încearcă să fie conciși în designul butoanelor CTA de acest tip, în timp ce alții, dimpotrivă, oferă cu generozitate butonului informații suplimentare.

4. Aflați mai multe

Butoanele „Aflați mai multe” sunt adesea situate la sfârșitul blocului de informații teaser. De obicei, acestea sunt butoane simple, dar suficiente dimensiune mare pentru a atrage atenția utilizatorului.

5. Înregistrare

Butoanele de înregistrare se găsesc cel mai adesea în două versiuni. În primul caz, butonul duce la formularul de înregistrare, în al doilea acționează ca un buton „Adaugă în coș”, oferindu-se să plătească contul și să-l folosească în viitor.

Există și alte tipuri de butoane CTA, dar cele mai multe dintre ele sunt similare cu cele enumerate mai sus. Iar principiile care se aplică butoanelor descrise mai sus se vor aplica cel mai probabil la majoritatea celorlalți.

Lucrul cu spațiul negativ

Probabil vrei ca butoanele CTA de pe site-ul tău să iasă în evidență față de restul conținutului și să atragă atenția utilizatorului. Pentru a face acest lucru, utilizați spațiu negativ în jurul butoanelor. Creați aer între butoanele conținut și CTA. În unele cazuri (cum ar fi butoanele „Adaugă în coș”), această regulă poate fi ignorată, dar cel mai adesea va adăuga eficiență designului tău.

Este important să nu uităm de echilibru. Trebuie să calculați spațiul negativ, astfel încât să pară proporțional cu dimensiunea butoanelor. Dorim ca butoanele și conținutul să arate ca o singură compoziție, chiar dacă le separăm unul de celălalt. Așa că, uneori, s-ar putea să fii nevoit să schimbi distanța.

• Asigurați-vă că există suficient spațiu în jurul butonului spatiu liberși nu există loc pentru dezordine în design.
• Încercați să utilizați regula treimii sau raportul de aur atunci când determinați dimensiunea spațiului negativ.
• Asigurați-vă că spațiul negativ permite butonului să iasă în evidență de restul conținutului și să fie separat de acesta.

Dimensiune si culoare

Mărimea butonului CTA este foarte importantă. Un buton prea mare va umbri restul conținutului; un buton prea mic se va pierde printre conținutul din jur. Avem nevoie ca butonul nostru să iasă în evidență de fundalul altor elemente, dar în același timp să nu le suprimăm vizual.

Culoarea trebuie folosită împreună cu mărimea. Pentru nasturi mari alegeți o culoare mai puțin diferită de culoarea principală a designului dvs., dar ar trebui să fie totuși diferită de fundal. Pentru nasturi dimensiune mai mică utilizați culori strălucitoare care contrastează cu culoarea principală. Dar asigurați-vă că, în orice caz, culoarea butonului se încadrează în designul general și este combinată cu alte elemente.

• În mod ideal, butoanele CTA ar trebui să fie cele mai mari butoane de pe pagină.
• Folosiți culori contrastante pentru a evidenția butonul mic.
• Utilizați culori care contrastează mai puțin cu culoarea principală pentru a reduce vizual butonul mare.
• Butoanele CTA ar trebui să atragă atenția, dar să nu supraîncărce designul.

Text

Formularea exactă pe care o utilizați în textul butonului poate face o mare diferență. Comparați apelul „Cumpărați acum” cu apelul „Adăugați în coș”. Prima opțiune pare mult mai urgentă și chiar mai intruzivă. Mărimea textului este, de asemenea, importantă. De exemplu, dacă este necesar, textul „Încercați serviciul gratuit” poate fi înlocuit cu versiunea mai scurtă „Versiune de încercare”.

Textul pe care îl utilizați pentru a proiecta butoanele ar trebui să fie cât mai simplu și clar posibil. Este necesar ca utilizatorul să înțeleagă la prima vedere ce îl așteaptă după apăsarea butonului. Dacă are îndoieli din cauza ambiguității, s-ar putea foarte bine să pierdeți conversiile.

Nu uitați de dimensiunea textului. Fontul ar trebui să fie mare și vizibil, dar bineînțeles să fie combinat cu dimensiunea butonului în sine. Asigurați-vă că textul are suficient contrast și că este ușor de citit.

• Folosiți un limbaj simplu, ușor de înțeles.
• Utilizați un font mare, vizibil.
• Asigurați-vă că textul îndeamnă cu adevărat la acțiune.

Creați urgență

Dorim ca vizitatorii site-ului nostru să ia acțiunile pe care le dorim cât mai repede posibil. Și deși nimeni nu va păcăli vizitatorul, decât mai multe posibilitati pentru reflecție și comparație le oferiți, cu atât este mai mare probabilitatea de a primi un răspuns negativ.

Scopul nostru este să impresionăm utilizatorul că trebuie să acționeze chiar acum. Trebuie să-i încurajezi să acționeze imediat, spontan. Și nu lăsați toate butoanele CTA să funcționeze așa (mai ales dacă despre care vorbim despre achiziționarea unui produs scump), acțiunile ieftine sau gratuite ar trebui, în mod ideal, să fie efectuate de utilizator fără să se gândească.

• Încurajați utilizatorul să acționeze imediat
• Nu oferi utilizatorului niciun motiv să se gândească de două ori.
• Deși efectul de urgență este important, nu induceți niciodată în eroare utilizatorul.

Informații suplimentare

Dacă este necesar, dați utilizatorului Informații suplimentare despre ceea ce va primi făcând clic pe butonul CTA. Cel mai adesea, aceasta se referă la butoanele „Încercare” sau „Descărcare”. De obicei, în aceste cazuri sunt postate informații despre cât timp este valabilă versiunea de probă, cât cântărește fișierul pe care urmează să îl descărcați sau ce versiune a programului veți descărca.

Când plasați informații suplimentare pe un buton, asigurați-vă că îndemnul la acțiune rămâne în centrul atenției. Faceți textul apelului mai mare și informațiile suplimentare mai puțin vizibile.

• Adăugați la butoane numai informații care vor fi în mod clar utile utilizatorului.
• Informațiile suplimentare sunt adecvate numai pentru anumite tipuri de butoane CTA (de exemplu, „Încercare” și „Descărcare”).
• Asigurați-vă că îndemnul în sine este în continuare textul cel mai proeminent de pe butonul dvs.

Prioritate

Este necesar să prioritizați butoanele atunci când există mai multe dintre ele pe pagină. Puteți sublinia importanța unui element în diverse moduri, dar cel mai adesea acest lucru se face folosind culoarea și dimensiunea.

Utilizați o culoare care contrastează cu culoarea principală a designului pentru a sublinia importanța butonului. Utilizați culori mai puțin contrastante pentru a reduce vizual importanța butonului. Aceeași poveste cu dimensiunea. Evidențiați importanța butonului făcându-l mai mare și micșorându-l pentru a-i reduce prioritatea.

Icoane și imagini

Proiectarea butoanelor CTA cu pictograme poate ajuta, de asemenea, la creșterea conversiei. Un exemplu ar fi pictograma coș de cumpărături de pe butonul „Cumpără” sau săgeata de pe butonul „Descărcare”. Puteți utiliza, de asemenea, pictograme și imagini unice, dar asigurați-vă că acestea transmit cu exactitate scopul butonului și nu induc în eroare utilizatorul.

• Asigurați-vă că imaginea plasată pe buton ajută la înțelegerea scopului acestuia și nu derutează utilizatorul.
• Pictogramele ușor de recunoscut pot transmite instantaneu utilizatorului sensul butonului.
• Nu vă fie teamă să folosiți pictograme mai puțin populare, dar asigurați-vă că semnificația lor este clară.

Exemple

Mai jos veți găsi exemple de modele de butoane CTA de succes. Și deși unele dintre ele nu sunt proiectate după toate principiile menționate mai sus, majoritatea regulilor sunt încă respectate și butoanele funcționează eficient.

Jurnal de bord
Folosirea de culori diferite pentru butoanele Descărcare și Cumpărare le separă unele de altele și subliniază importanța butonului Cumpără.

Întrebarea pare destul de evidentă. Dar ce este un îndemn la acțiune sau un CTA? De prea multe ori nu ne uităm mai în profunzime și nu o vedem ca pe o oportunitate pierdută de a atrage cititorii sau ascultătorii mai adânc în marca dvs.

Ce este chemarea la acțiune? Aceasta este de obicei partea a ecranului care încurajează cititorul să facă clic pentru a-l atrage mai departe în procesul de cumpărare/branding. Uneori, aceasta poate fi o imagine, alteori doar un buton sau doar un câmp care conține informații care necesită acțiune. Apropo, îndemnul la acțiune în traducere înseamnă un îndemn la acțiune. De fapt, nu numai site-urile web au îndemn la acțiune, de fapt orice tip de conținut poate fi considerat un îndemn la acțiune.

De exemplu, webinarii ar trebui să aibă îndemnuri, infograficele ar trebui să aibă un CTA eficient și, desigur, prezentările ar trebui să le aibă. De exemplu, la unele prezentări pe care le oferă cadou gratuit pentru schimbul de cărți de vizită, funcționează fantastic de eficient. A face pe cineva să descarce, să se înregistreze sau chiar să facă clic pe un articol relevant este deja considerat un bun CTA.

Chiar trebuie ca totul să aibă un Call-to-action? Nu veți găsi prea mult conținut care să aibă propriul îndemn și, în general, nu există foarte mult din el în rețea. Nu tot ceea ce faci ar trebui să încerci să vinzi, o parte din conținutul tău ar trebui să creeze încredere și autoritate cu clienții potențiali. Vânzarea întotdeauna poate fi mantra în multe companii de vânzări și marketing, dar accentul pus pe vânzări poate descuraja mulți utilizatori de la conversie. Regula principală este să ai întotdeauna un îndemn la acțiune atunci când scopul tău este să motivezi vizitatorul să meargă mai departe în implicarea în produsul tău.

Cum să creezi îndemnuri eficiente la acțiune?

Există metode dovedite utilizare eficientă strategii CTA. Iată câteva dintre ele.

Păstrați întotdeauna apelul la acțiune la vedere. Amplasarea CTA ar trebui să fie aproape sau în concordanță cu locul în care se concentrează cititorul. Cel mai adesea, apelurile la acțiune sunt inserate în partea dreaptă continut, cum ar fi mișcare naturală Ochiul utilizatorului pe pagină îl atrage. Unele site-uri fac CTA plutitoare, astfel încât atunci când utilizatorul derulează, CTA în sine rămâne cu ele.

Păstrați-vă îndemnurile simple. Fie că este vorba de o imagine sau de o propoziție în discursul tău, asigură-te că detaliile sunt explicate într-un mod foarte clar. Cu cât îi explicați mai simplu și mai clar esența utilizatorului, cu atât numărul celor care dau clic sau apelează va fi mai mare pe CTA.

Fiți întotdeauna clar când scrieți CTA. Folosiți cuvinte precum: sunați, descărcați, faceți clic, înregistrați-vă, începeți etc. Aceste cuvinte trebuie folosite. Dacă este o imagine ca un CTA, le vei vedea adesea pe butoane ca acestea. Utilizatorii rețelei sunt obișnuiți să facă clic pe butoane și astfel de imagini sunt asociate automat cu acțiunea care trebuie făcută.

Adăugați un sentiment de urgență. Se scurge timpul? Oferta expiră? Mai sunt locuri limitate? Orice lucru care ajută să-l convingă pe cititor să ia o acțiune acum și nu mai târziu, vă va îmbunătăți ratele de conversie. Adăugarea unui sentiment de urgență este esențială componentă importantă fiecare CTA.

Concentrați-vă pe beneficii în loc de funcționalitate. Multe companii sunt mândri de ceea ce fac pentru a aduce valoare clienților lor. Nu asta vinde, beneficiul este ceea ce tentează clientul să cumpere. Oferiți posibilitatea de a simplifica lucrurile? Obțineți rezultate instantanee? Primiți sfaturi gratuite?

Planificați-vă calea către conversii. De exemplu, pentru postările de pe blog, calea este adesea simplă. Citiți -> vezi CTA -> înregistrează-te pentru pagina de destinație-> Conversie. Calea dvs. către conversie poate fi diferită, dar vizualizarea și planificarea căii pe care ar trebui să o urmeze un utilizator prin conținutul dvs. vă va ajuta să vizualizați mai bine situația și să creșteți conversiile printr-o strategie de îndemn.

Testați-vă CTA. Dezvoltați mai multe versiuni ale indemnurilor dvs. pentru a identifica pe cea care oferă cea mai buna afacere rezultate. O singură versiune nu este suficientă, multe companii nu petrec timpul dezvoltării de modele alternative, sloganuri, folosind diferite culori și dimensiuni. Uneori simplitatea este ideală, iar uneori un gif animat strigător poate fi cea mai bună soluție.

Testează-ți propunerile. Probă gratuită transport gratuit, 100% satisfacție garantată, reducere etc. Ar trebui să încercați întotdeauna mai multe oferte atrăgătoare care vă vor crește conversiile. Asigurați-vă că puteți măsura eficiența deplină a fiecărei oferte, ținând cont de păstrarea clienților și de conversiile ulterioare. O mulțime de companii oferă o reducere incredibilă chiar de la prima pagină, doar pentru a pierde cumpărătorul la sfârșitul călătoriei de cumpărare. Specialiștii de marketing neexperimentați se bazează adesea pe această abordare, crezând că cel puțin un procent din cumpărători vor fi convertiți în achiziții. Cu toate acestea, această opinie este greșită nu numai că site-ul va pierde un cumpărător în etapa de conversie. Nu se va mai întoarce niciodată la ea. Acest lucru distruge pur și simplu reputația și încrederea în resursă.

Vă prezentăm o infografică vizuală despre ce să faceți și să nu faceți pentru a crea în mod eficient îndemnul la acțiune.

Combinând cercetarea științifică despre psihologia culorilor cu unele principii de design, puteți crea un buton de îndemn (CTA) excelent pentru site-ul dvs. și puteți crește semnificativ conversiile. Există 4 instrumente care vă vor ajuta să realizați acest lucru: plasarea butonului, forma (și dimensiunea), mesajul și culoarea.

În acest articol voi vorbi despre aspectul culorii.

Dar să începem în ordine...

Ce sunt butoanele de apel la acțiune?

Imaginați-vă că site-ul dvs. este un lanț de acțiuni pe care utilizatorii trebuie să le parcurgă pentru a găsi ceea ce au venit. Pentru a le ușura viața, este absolut necesar să faceți acest lanț cât mai simplu posibil (adică. ușor de utilizat), pe cât posibil, și ghidați-i către pagina dorită fără nicio intervenție.

Deoarece unele dintre aceste acțiuni sunt mai importante decât altele, ele vor trebui să fie evidențiate în interfață. Vrei să captezi atenția utilizatorilor încercând să-i convingi să ia măsuri (chemare la acțiune). Acest lucru se face cel mai adesea folosind un marker vizual, elemente de interfață cu un apel la acțiune. Iată câteva exemple acțiuni posibile: achiziționarea unui produs, abonarea la un buletin informativ, crearea unui cont nou, depunerea unei cereri, descărcarea ultima versiune DE,..

Dar de ce culorile au o asemenea semnificație?

Psihologia culorii

Fiecare culoare evocă diferite sentimente sau dispoziții în oameni și, prin urmare, reacții diferite. Medicii și asistentele poartă alb, ceea ce este un semn de sterilitate. Sălile de sport sunt adesea vopsite în albastru, deoarece studiile au arătat că sălile de sport albastre permit halterofililor să ridice mai multe greutăți.

După cum puteți vedea, culorile sunt foarte instrumente puternice a încuraja sau, dimpotrivă, a bloca anumite sentimente. Adică, puteți, într-o oarecare măsură, să ghidați utilizatorii prin interfața dvs., permițându-le să ia deciziile pe care doriți să le ia, folosind culorile potriviteŞi combinatii de culori. Dar nu începe să colectezi chiar acum. scheme de culori. Mai sunt unul sau două lucruri pe care trebuie să le știi.

Deși percepția culorilor este subiectivă, unele efecte de culoare au sens universal. De exemplu: albastrul este rece, iar roșul este cald.

În al doilea rând, percepția culorilor se bazează pe caracteristicile culturale. Să luăm ca exemplu negrul (care nu este o culoare din punct de vedere științific). Deși negrul este asociat cu moartea și doliu în multe culturi, în Egiptul antic simbolizează și viața și renașterea.

Susan Weinshenk ( Susan Weinschenk), Ph.D. și autorul cărții „Intuitive Web Design: What Makes People Click”, a scris un articol interesant despre acest lucru. Nu uitați să verificați McCandless Color Wheel, pe care o puteți descărca în partea de jos a paginii.

Kissmetrics a realizat o infografică grozavă despre modul în care culorile influențează achiziția.

O mică teorie a culorii

După cum explic mai jos, cel mai bine este să folosiți un contrast bun atunci când proiectați butoane importante. Când vorbesc despre culori contrastante, mă refer de fapt la culori complementare. Culorile complementare sunt situate una vizavi de alta pe roata de culori (vezi imaginea de mai jos). Dacă le așezi una lângă alta, par să arate mai strălucitoare.

Un alt exemplu de utilizare a culorilor complementare este îmbrăcămintea pe care o poartă medicii în timpul lucrului în sala de operație. În cele mai multe cazuri, este verde sau albastru. Aceste două culori permit medicilor să perceapă mai bine obiectele roșii, și anume sângele și măruntaiele pacientului, să le vadă mai clar și să observe cele mai mici nuanțe ale corpului uman. Roșul și verdele sunt culori complementare.

Deci, ce culoare ar trebui să aleg pentru butonul meu?

După cum am menționat la începutul articolului, un buton CTA este un set de 4 lucruri: locație, formă, mesaj și culoare. Dacă aceste 4 aspecte se corelează bine între ele, aveți un buton grozav de îndemn la acțiune.

Având în vedere acest lucru, există, de asemenea, câteva principii și linii directoare de bază de proiectare de reținut. Dacă doriți ca un element de design să iasă în evidență, îl puteți colora într-o culoare complementară fundalului (gândiți-vă la exemplul pe care l-am dat din The Resumator).

Un mic sfat: pentru butoanele mari, folosește o culoare mai puțin strălucitoare (față de elementele din jur și fundal), iar pentru butoanele mici, dimpotrivă, ai nevoie de culori mai strălucitoare. Dar indiferent de culoarea pe care o alegeți, asigurați-vă că butonul pe care îl proiectați va fi vizibil fără a interfera cu designul principal.

Deși acest articol se bazează pe cercetarea stiintifica despre psihologia culorilor și câteva principii de design, tu Întotdeauna ar trebui să vă testați singur butoanele de îndemn la acțiune pentru a vedea ce funcționează cel mai bine pentru site-ul dvs. Puteți utiliza testarea A/B sau multivariată sau pur și simplu le puteți urma

Căutați un studio web care să vă ofere implementare de înaltă calitate? Consultați rezultatele evaluării creativității studioului web.

Poziția ocupată în ratingul de creativitate al studiourilor web depinde de numărul de victorii și de statutul competițiilor. Îți plac mai multe echipe deodată? Făcând clic pe butonul verde, îi puteți invita să participe la licitație în doar două clicuri.

Cititorii obișnuiți ai blogului nostru sunt conștienți de ce este un „Buton de apel la acțiune” pe o pagină de destinație și de cât de important este rolul acestui element de interfață web în afaceri.

În noul nostru articol, vom vorbi despre cum să creați un buton de îndemn la acțiune extrem de eficient - garantat pentru a atrage atenția vizitatorilor și a maximiza rata de conversie și.

Ține minte! Butonul CTA ar trebui să se simtă ca un element legitim, natural și armonios al arhitecturii paginii de destinație. Un element CTA care pare „atașat în grabă” va indica involuntar vizitatorului neprofesionalismul dezvoltatorilor săi.

Metoda 1: Atrageți atenția utilizatorului prin creșterea dimensiunii butonului CTA.

Există o regulă nescrisă în web design: dimensiunea unui element de pagină este direct proporțională cu importanța acestuia, cu alte cuvinte, cu cât elementul este mai mare, cu atât rolul său pe pagină este mai semnificativ.

Exemplul 1: butonul de apel la acțiune este mai mare decât elementele din jur.

Să demonstrăm această metodă de a atrage atenția utilizatorilor folosind exemplul unei pagini de destinație din Lifetree Creative.

Deci, să comparăm dimensiunea butonului CTA cu dimensiunea unui alt element important al paginii - logo-ul companiei. Pentru a atrage atenția vizitatorilor, dezvoltatorii au făcut butonul cu 20% mai lat decât logo-ul. Astfel, designerii au obținut un rezultat lăudabil: în ciuda faptului că logo-ul este situat mai sus decât elementul CTA, ochii vizitatorilor sunt atrași ca un magnet de butonul de apel la acțiune, care se remarcă vizibil prin dimensiunea sa printre alte elemente ale pagina de destinație.

Exemplul 2: dacă pagina dvs. de destinație are mai multe butoane de îndemn, butonul mai important ar trebui să fie mai mare.

O pagină de destinație poate conține mai multe elemente de îndemn. Pentru a indica importanța relativă a unui apel la acțiune față de ceilalți, puteți redimensiona butoanele corespunzătoare.

Așa a luat viață acest concept pe site-ul paramore|redd - butonul care invită vizitatorul să se aboneze la newsletter este mult mai mare decât butonul „permite” utilizatorului să continue să citească blogul. Scopul de conversie al acestei pagini este clar și clar - abonament!

Metoda 2: Captați atenția utilizatorului folosind regulile binecunoscute de plasare a unui element CTA pe o pagină web.

Locul în care plasați CTA pe pagina de destinație este esențial pentru a atrage atenția vizitatorilor.

Plasarea butoanelor CTA în locuri proeminente, cum ar fi partea superioară pagina web poate duce la creșterea conversiilor, deoarece este mai probabil ca utilizatorii să observe elementul de design și să ia măsuri pentru a încuraja conversia.

Exemplul 1: plasați îndemnul la acțiune „un nivel mai înalt” decât restul conținutului paginii de destinație.

Simplu, dar extrem mod eficient evidențiați elementul CTA - plasați-l „deasupra suprafeței” paginii. Puteți vedea această idee pusă în practică pe site-ul dailymile, unde butonul de apel la acțiune pare să „zboare” deasupra altor elemente de pagină (diagrame). Un efect similar poate fi obținut cu ușurință atunci când așezați o pagină folosind Cascading Style Sheets (CSS).

Exemplul 2: CTA în partea de sus a paginii de destinație.

Dovedit, simplu, dar foarte mod eficient atrageți atenția utilizatorului - plasați un element CTA chiar în partea de sus a paginii, astfel încât să fie sigur că va intra în câmpul vizual al vizitatorului.

Exemplul 3: CTA în centrul vizual.

Un alt loc potrivit pentru a plasa un buton CTA este „centrul vizual”. Pentru a atrage atenția asupra butonului - situat exact în mijlocul dimensiunii orizontale a paginii - puteți folosi și alte elemente de design care îl flanchează.

Această metodă a funcționat excelent pentru pagina PicsEngine, dar rețineți că locația pe care o alegeți nu trebuie să fie prea departe de partea de sus a paginii web.

Metoda 3: Folosiți spațiu alb.

Utilizarea spațiului alb (spațiu gol sau „mort”) funcționează excelent pe paginile de destinație unde există o mulțime de alte elemente în apropierea butonului CTA.

Exemplul 1: Folosiți spațiul alb pentru a evidenția vizual un îndemn.

Folosind exemplul paginii de destinație a serviciului IconDock, este ușor de observat cât de eficientă este această metodă: un buton mic de o culoare modestă gri deschis atrage ferm atenția.

Exemplul 2: Reduceți spațiul alb pentru a indica o relație logică între două elemente ale paginii.

Cum mai mult spatiu, existent între butonul de apel la acțiune și oricare dintre elementele paginii din jur, cu atât conexiunea logică dintre ele este mai puțin vizibilă. Dacă utilizați alte elemente ale paginii de destinație pentru a convinge utilizatorul să întreprindă acțiunea dorită, reducerea spațiului alb cu aceste elemente și butonul CTA este o mișcare inteligentă.

De exemplu, pe pagina companiei Donor Tools, lângă butonul de apel la acțiune, există o listă de beneficii pe care le primește abonatul. Prin reducerea decalajului dintre lista de beneficii și CTA, aceste două elemente sunt combinate într-un grup vizual care sporește impactul apelului datorită conexiunii logice clare „acțiune - beneficii primite”.

Metoda 4: Folosiți culori cu contrast ridicat pentru a crea și evidenția CTA.

Asigurați-vă că decideți singur ce culori veți folosi - acest lucru este foarte important. Cele mai multe mod de încredere atrageți atenția - utilizați culori care contrastează clar cu elementele care înconjoară butonul CTA și fundalul paginii.

Exemplul 1: Folosiți culori care contrastează cu elementele paginii din jur.

Iată un exemplu grozav în acest sens pe o pagină de destinație Notepod: toate elementele din jur sunt negre, în timp ce apelul la acțiune este albastru strălucitor. Cel mai neatent utilizator nu va rata butonul dorit. :)

Exemplul 2: Utilizați contrastul între culoarea butonului și culoarea fundalului din jur.

Această metodă este simplă și eficientă: plasați butonul subliniat culoare strălucitoare(de exemplu, galben spectral) peste alb-negru sau monocrom imagine de fundal, așa cum au făcut, de exemplu, creatorii acestei pagini.

Metoda 5: Invitați vizitatorul să folosească un buton de apel la acțiune suplimentar/alternativ.

Mai multe elemente de îndemn la acțiune pot coexista în mod pașnic pe o pagină web. În practică, se poate întâmpla să fie nevoie să oferi vizitatorului o altă acțiune, suplimentară, pentru a-l convinge să efectueze mai târziu acțiunea principală dorită.

Această tehnică este utilizată în principal pe site-uri web. Când creați pagini de destinație, este mai bine să respectați principiul dovedit: „O singură pagină de destinație, un element de îndemn”.

De exemplu, înainte de a se abona la un serviciu web, un utilizator poate dori să obțină mai mult informatii detaliate despre prețurile și modalitățile de plată existente pentru servicii.

Oferă-i această oportunitate instalând un alt buton CTA pe pagină care să permită vizitatorului, de exemplu, să vizioneze un videoclip care explică politica de preturi a acestui serviciu.

Exemplul 1: plasarea unui element secundar lângă butonul CTA principal.

Site-ul web OfficeVP afișează două butoane de îndemn unul lângă celălalt. Butoanele sunt realizate în culori contrastante, ceea ce face ușor pentru vizitator să înțeleagă că li se oferă doi moduri diferite acțiuni: fie înregistrați-vă chiar acum, fie efectuați o acțiune secundară - obțineți Informații suplimentareîn timpul unui tur educațional gratuit.

Vă rugăm să rețineți: aici butonul pentru acțiunea principală dorită este localizat în conformitate cu regula clasică a percepției informației - linia este citită de utilizator de la stânga la dreapta, ceea ce înseamnă că primul cuvânt din linie (în cazul nostru, butonul) vor primi atenție maximă din partea vizitatorului.

Pagina de destinație Transmissions a folosit o abordare diferită pentru a plasa orizontal două elemente de îndemn. Butonul principal de acțiune - evidențiat într-o culoare contrastantă - este situat în spatele elementului CTA suplimentar. Cu toate acestea, această aranjare a elementelor este pe deplin justificată: o acțiune suplimentară (descărcarea unui fișier gratuit versiune de încercare aplicația), dacă este executată mai întâi, poate împinge vizitatorul să întreprindă acțiunea principală sugerată pe pagină - plătirea pentru o versiune cu funcții complete a programului testat.

Exemplul 2: plasați un element CTA secundar sub butonul principal de îndemn la acțiune.

Acest tip de plasare poate fi util dacă doriți să îmbunătățiți separarea vizuală a îndemnurilor dvs. principale și secundare.

Vă rugăm să rețineți: acțiunea suplimentară este evidențiată prin utilizarea unui fundal „întunecat” (comparativ cu restul spațiului paginii).

Metoda 6: Grăbește-ți vizitatorul paginii.

Lăsați butoanele de apel la acțiune „să vorbească” pe un „ton de comandant” încrezător și peremptoriu. Utilizatorul trebuie să se gândească că, dacă nu răspunde imediat la apelul dumneavoastră, va pierde o oportunitate unică de a profita de oferta dumneavoastră.

De exemplu, pe pagina tap tap tap.com, ideea de „a grăbi utilizatorul” a fost implementată într-un mod foarte ingenios: plasată în imediata apropiere a butonului CTA cu apelul „cumpără acum”, se arată în anunț. că produsele sunt supuse unui anumit „preț de pornire”.

Aici este implicat un mecanism destul de subtil de creare a „anticipării anxioase”: juxtapunând cuvintele „acum” și „preț de pornire”, utilizatorul începe să bănuiască că riscă să plătească mai mult dacă plătește produsul mai târziu, la „prețurile de pornire”. (pe care cumpărătorul îl asociază subconștient cu începutul cea mai simplă numărătoare inversă de la mic la numere mari: 1, 2, 3...) cu siguranță se va schimba în sus. ;)

Și, bineînțeles, când vii cu o legendă de plasat pe butonul de îndemn, nu uita de cuvintele puternice „convingătoare”: „acum”, „imediat”, „chiar acum”, etc.

Metoda 7: Spuneți utilizatorilor că acțiunea pe care o sugerați este ușor și simplu de efectuat.

Adesea, ezitarea utilizatorilor de a vă accepta sau nu propunerea provine din faptul că aceștia presupun că acțiunea pe care o propuneți va avea ca rezultat o pierdere de timp, efort și bani pentru ei. Cu toate acestea, puteți rezolva această problemă plasând text pe butonul CTA care va crea încredere în rândul vizitatorilor dvs. că acțiunea pe care o propuneți va fi ușor și simplu de finalizat.

De exemplu, pe pagina de destinație Basecamp, textul de pe butonul de îndemn la acțiune indică clar timpul necesar utilizatorului pentru a se înscrie (60 de secunde) și explică că un abonament de probă de 30 de zile este gratuit.

Acest lucru este foarte punct important, încercați să nu uitați de asta: atunci când „proiectați” legenda pentru elementul dvs. CTA, nu uitați să menționați versiuni gratuite produsele sau termenele limită de înregistrare, dacă există, și convingeți utilizatorul că înregistrarea pe resursa dvs. nu îi va lua mult timp.

Metoda 8: explicați în mod deschis și detaliat utilizatorilor ce vor obține folosind butonul CTA.

Iată ultimul sfat, ultimul ca număr pe listă, dar nu în ultimul rând ca importanță: câștigă încrederea vizitatorilor tăi spunându-le în detaliu și deschis ce vor primi dacă răspund la oferta ta.

Specialiști Mozilla Firefox, de exemplu, au reușit să plaseze pe suprafața butonului de descărcare a aplicației toate informațiile cele mai necesare utilizatorilor: informații despre costul produsului (gratuit), informații despre versiunea produsului oferit (versiunea de browser web 3.5). .3, conceput pentru sistemul de operare Windows cu o interfață în limba engleză) și dimensiune descărcabilă fișier de instalare(7,7 MB).

Iată cum arată cu adevărat grija de vizitatorul paginii de destinație.

Și nu uitați principalul lucru: testați fiecare schimbare pe care o faceți.

Se știe că totul este mai mult sau mai puțin mărci celebre Piața americană este pur și simplu „obsedată” de testarea resurselor sale de internet. Înțelegerea faptului că o creștere cu 0,5% a conversiilor poate genera mii de dolari suplimentari în profit anual este o motivație excelentă pentru optimizarea ratei de conversie a paginii de destinație/site-ului.