Cum să utilizați elementele de design pentru a crește numărul de conversii

Doriți să vă creșteți conversiile site-ului dvs.? Revizuirile evidente ar include apelul dvs. la acțiune, venind cu ceva mai atrăgător și mai captivant. Sau, poate, materialele de marketing și promoționale în sine. La urma urmei, dacă îi interesează pe oameni înainte de a ajunge pe site-ul tău, sigur vor face conversii, nu?

De fapt, s-ar putea să fii surprins să știi că totul începe cu designul. Fără îndoială, înțelegeți elementele de bază ca manager de marketing sau proprietar de mică afacere. Aveți de-a face cu același concept atunci când vă alegeți logo-ul, culorile și tema și atunci când vă echipați magazinul fizic. Totul se rezumă la prezentare și experiența pe care o oferiți vizitatorilor dvs.

Aproape jumătate dintre consumatori (46,1%) designul simt este cel mai bun mod de a decide dacă o companie sau o marcă este sau nu credibilă. În afară de asta, oamenii vor abandona pur și simplu site-ul tău dacă este urât – un total de 38% din toți vizitatorii , mai exact.

Care este, prin urmare, cea mai bună modalitate de a vă asigura că site-ul dvs. este atractiv, sporind totodată potențialul de conversie? Răspunsul este prin respectarea principiilor de bază ale designului: culoare, dimensiune, spațiu, linie, formă, textură, valoare.

1. Culoare

În mod fundamental, culoarea este folosită pentru a provoca emoții, pentru a spori atractivitatea vizuală și pentru a evidenția elemente cruciale. Culorile pe care le alegeți au un efect la un nivel mai visceral. Sigur, alegerea a două culori pentru o temă care nu se îmbină este tulburătoare, dar sentimentele și emoțiile pe care le provoacă vizitatorilor tăi sunt cele care le vor împiedica experiența generală.

Culorile calde și active, cum ar fi portocaliul și roșul, tind să provoace răspunsuri mai vibrante. Culorile reci și pasive precum albastrul și violetul sunt mult mai plăcute, motiv pentru care atât de multe studii arată că albastrul este culoarea fericirii .

Veți dori să acordați atenție acestui lucru atunci când alegeți culori pentru fundal, elemente vizuale și accente suplimentare, tipografie și multe altele. Luați în considerare tonul site-ului dvs., produsele, serviciile și ceea ce doriți să obțineți. Dacă doriți să oferiți o impresie mai relaxantă și mai liniștitoare, culorile reci, precum o varietate de albastru profund, vor funcționa grozav. Dacă vrei să captezi atenția, culorile mai strălucitoare sunt alegerea clară, dar, din nou, pe care le vei folosi va depinde de atenția pe care o generezi.

Puteți citi mai multe despre utilizarea psihologiei culorilor pentru a crește rata de conversie în acest articol detaliat de Neil Patel. Îmi place această roată a emoțiilor de la Conversioner pentru a descrie diferitele declanșatoare emoționale ale culorilor:

2. Dimensiunea

Mărimea, după cum știți, este cât de mic sau mare este un articol sau element. Când vine vorba de elementele de design, dimensiunea este adesea despre o relație a unui articol cu ​​celelalte din jurul lui. Cu cât un element este mai mare, cu atât va ieși mai mult în evidență vizual. Prin urmare, puteți folosi dimensiunea pentru a defini importanța, a genera interes vizual, a atrage atenția, a orienta concentrarea aproape ca o poveste și multe altele.

Dacă doriți să vă asigurați că un titlu sau un titlu de produs captează atenția unui vizitator instantaneu, utilizați un font mare, atractiv, care iese în evidență în comparație cu orice altceva de pe pagină. Aceasta este, de asemenea, o modalitate excelentă de a crește conversiile fără a vă modifica întregul design. Îndemnul dvs. la acțiune, de exemplu, poate fi mărit în dimensiune, astfel încât să iasă în evidență față de conținutul dvs. obișnuit.

Dacă nu sunteți familiarizat cu codul, poate fi intimidant să faceți astfel de modificări pe cont propriu. Din fericire, dacă site-ul dvs. rulează pe WordPress, există plugin-uri care vă vor face schimbarea dimensiunii titlului o simplă. Încercați pluginul gratuit Personalizare .

3. Spațiu

Spațiul reprezintă zonele goale din jurul diferitelor elemente, inclusiv tipografie, marginile din jurul textului și multe altele. Strategiile de design minime favorizează utilizarea mai multor spațiu și punând accent pe componentele vizuale care există. Într-un fel, păstrează o interfață curată care ajută totul să iasă în evidență și să arate, ei bine, frumos.

Spațiul poate fi folosit pentru a separa elemente sau grupuri. Poate descompune textul - așa cum este cazul întreruperilor de rând și a noilor paragrafe - și poate chiar adăuga atractivitate vizuală. Mai important, spațiul oferă ochilor privitorului o odihnă, ca să spunem așa. Deoarece nu include nimic important sau cuprinzător de privit, poate fi folosit și pentru a ghida privirea sau concentrarea publicului dvs.

Pune suficient spațiu în jurul unui anumit obiect, imagine sau element și ai definit cu adevărat importanța acestuia. Este atât de esențial, de fapt, încât se află pe cont propriu printre marea de text și conținut de pe site-ul tău.

Dacă utilizați WordPress, căutați o temă care să includă un generator de pagini. Creatorii de pagini vă oferă mult mai mult control asupra dimensiunii și spațierii elementelor de pe pagina dvs. de destinație. Una dintre preferatele mele este tema Salient .

4. Linie

Strict vorbind, o linie este marcajul dintre două puncte opuse. După cum știți deja, există multe tipuri de linii și vin în diferite dimensiuni și forme. Aveți linii drepte, linii ondulate, linii curbe, linii îndrăznețe, linii subțiri etc.

Liniile - asemănătoare cu spațiul - sunt o componentă universală a designului modern . Le puteți folosi pentru o varietate de lucruri, de la simplu la avansat. Puteți folosi linii de accent pentru a accentua un cuvânt, o expresie sau o imagine. Puteți conecta elemente împreună folosind o singură linie trasată. Desigur, nu se termină aici.

Cea mai bună strategie pentru a stimula conversiile cu linii este să le folosiți pentru a atrage atenția către CTA sau un formular de clienți potențiali. Într-un studiu de caz publicat de ConversionXL , o firmă de avocatură împărțită a testat o serie de indicii vizuale pentru a vedea care dintre ele a avut cele mai bune rezultate în studiile de urmărire a ochilor. O săgeată îndreptată către formularul de generare de clienți potențiali a fost câștigătorul clar.

5. Formă

Forma este, în esență, combinația de înălțime și lățime atunci când o descompuneți. În școală, și de obicei chiar mai devreme, ați început să lucrați cu aceste blocuri de bază. Există triunghiuri, pătrate, cercuri și sfere, hexagoane și multe altele. Formele ciudate sau mai puțin obișnuite pot fi folosite pentru a atrage atenția - de aceea semnele de oprire sunt modelate așa cum sunt, în combinație cu culoarea roșu aprins, desigur.

Formele pot fi împărțite în trei tipuri esențiale: geometrice, naturale și abstracte.

• Geometrice: triunghiuri, pătrate, dreptunghiuri, cercuri etc.
• Natural: frunze, animale, copaci, oameni, obiecte etc.
• Rezumat: icoane, stilizări, reprezentări grafice, simboluri, contururi etc.

Puteți folosi forme pentru a extinde atractivitatea vizuală a unei secțiuni, element sau zonă. De exemplu, includerea unui apel la acțiune într-un buton sau într-un alt container - care este în sine o formă - este o modalitate excelentă de a capta atenția. Îmi place acest exemplu din Visual Website Optimizer :

6. Textura

În realitate, cunoaștem textura ca senzația unui articol sau a unei suprafețe. Este aspru ca betonul sau neted ca lemnul lustruit? În design, acest lucru nu se traduce tocmai deoarece nu puteți simți de fapt elementele unei pagini sau pe un ecran. Cu toate acestea, puteți afișa textura prin aspectul unui articol.

Modelul binecunoscut al cărămizii așezate, de exemplu, poate fi folosit pentru a adăuga profunzime vizuală și interes unei culori blânde și solide. Sigur, este o textură implicită, dar funcționează la fel de eficient , mai ales cand alegi un stil potrivit.

Puteți folosi texturi precum cărămidă, beton și piatră pentru a implica rezistență sau încredere. Ați putea folosi un stil de cereale a lemnului pentru a înfrumuseța aspectul sau eleganța. Totul se întoarce la cum și unde utilizați texturile vizuale și ce fel de răspuns emoțional provoacă atunci când vizualizați designul.

Într-un studiu de caz, o organizație de caritate care a colectat telefoane mobile uzate a aplicat un fundal bogat în texturi formei lor de generare de clienți potențiali , și a crescut donațiile cu 53%. Acesta este un truc simplu care poate fi realizat cu CSS .

7. Valoare

În marketing, definim valoarea ca fiind ceva care dă înapoi, într-un fel. Care este valoarea inerentă a unui produs sau a unei componente?

În design, valoarea este indicată prin luminozitatea sau întunericul unei zone. Un gradient - popular în designul modern - este una dintre cele mai comune moduri de a prezenta valoarea. De obicei, progresează de la întuneric la lumină sau solid la transparent.

La fel ca multe dintre celelalte componente de aici, puteți folosi valoarea sau gradienții pentru a conduce privirea. Mai important, ele pot fi folosite pentru a sublinia importanța unui anumit corp sau concept. Puteți plasa CTA în secțiunea cea mai vibrantă a unui gradient sau puteți înconjura butonul CTA într-o strălucire colorată pentru a-l scoate în evidență.

În exemplul de mai jos, dintr-un concept design de Denis Absullin pe Dribbble , puteți vedea o strălucire subtilă în jurul unui buton CTA pentru a adăuga produsul în coș.

Punând elementele de design să lucreze pentru dvs

Designul este o componentă critică în succesul unui site web, dar nu trebuie să fie complicat. Pur și simplu păstrarea elementelor de design în minte poate oferi fundația pentru un site remarcabil, care vă poate promova în mod eficient marca.