E-poštni obrazci: vodnik po oblikovanju in optimizaciji za višje konverzije

Vsak e-poštni seznam, vsak prodajni lijak za potencialne stranke in vsak odnos s stranko se začne z obrazcem. E-poštni obrazec je kraj, kjer se zanimanje spremeni v dejanje, kjer se naključni obiskovalec odloči deliti svoje kontaktne podatke in povabiti vaše podjetje v svoj nabiralnik.

Toda večina e-poštnih obrazcev je oblikovanih brez premisleka. Besedilno polje, gumb za pošiljanje in upanje, da ga bodo obiskovalci izpolnili. Rezultat je predvidljiv: nizke stopnje konverzije, visoko opuščanje in zamujene priložnosti.

Ta vodnik pokriva načela in taktike, ki ločijo visoko konverzijske e-poštne obrazce od tistih, ki jih obiskovalci prezrejo.

Vloga e-poštnih obrazcev v vaši trženjski prodajni poti

E-poštni obrazci služijo različnim namenom na različnih stopnjah trženjske prodajne poti. Razumevanje teh vlog vam pomaga oblikovati pravi obrazec za vsak kontekst.

Obrazec za prijavo na glasilo na vašem blogu mora biti povsem drugačen od obrazca za zahtevo za demo na vaši strani izdelka. Namen obiskovalca, informacije, ki jih potrebujete, in psihologija konverzije so vse drugačni.

Osnovna načela oblikovanja e-poštnih obrazcev

Načelo 1: Zmanjšajte trenje na vsakem koraku

Trenje je vse, kar otežuje dokončanje obrazca. Vsak vir trenja zmanjša vašo stopnjo konverzije:

• Vizualno trenje: Zmešano oblikovanje, preveč elementov, ki tekmujejo za pozornost
• Kognitivno trenje: Nejasne oznake, dvoumna navodila, nepotrebne odločitve
• Fizično trenje: Majhna območja za dotik, besedilo, ki ga je težko prebrati, slaba izkušnja na mobilnih napravah
• Podatkovno trenje: Zahtevanje informacij, ki jih obiskovalec ne želi deliti ali jih nima takoj pri roki

Preverite obstoječe obrazce skozi to lečo trenja. Vsak element bi moral bodisi zmanjšati trenje ali zagotoviti dovolj vrednosti, da upraviči trenje, ki ga dodaja.

Načelo 2: Prilagodite kompleksnost obrazca namenu obiskovalca

Količina informacij, ki jih lahko zahtevate, je neposredno v korelaciji z vrednostjo, ki jo ponujate v zameno.

Izmenjava z nizko vrednostjo (glasilo, posodobitve bloga):

• Največ 1 polje (samo e-pošta)
• Pričakovana stopnja konverzije: 3-8 %

Izmenjava s srednjo vrednostjo (e-knjiga, predloga, orodje):

• 2-3 polja (e-pošta, ime, podjetje)
• Pričakovana stopnja konverzije: 15-25 %

Izmenjava z visoko vrednostjo (demo, posvetovanje, ponudba):

• 4-7 polj (e-pošta, ime, podjetje, vloga, telefon, potrebe)
• Pričakovana stopnja konverzije: 5-15 %

Napaka, ki jo dela veliko podjetij, je zahtevanje podatkov za izmenjavo z visoko vrednostjo ob ponudbi spodbud za izmenjavo z nizko vrednostjo.

Načelo 3: Oblikujte za primarno dejanje

Vsak obrazec bi moral imeti eno jasno primarno dejanje. Gumb za pošiljanje bi moral biti vizualno najbolj izstopajoč element. Sekundarna dejanja (kot so povezave „Izvedi več”) bi morala biti vizualno podrejena.

Uporabite vizualno hierarhijo za vodenje pogleda:

1. Naslov / vrednostna ponudba (največje besedilo)
2. Polja obrazca (jasna, ustrezno velika)
3. Gumb poziva k dejanju (visok kontrast, besedilo, usmerjeno v dejanje)
4. Podporno besedilo (socialni dokaz, opomba o zasebnosti - najmanjše)

Optimizacija polj obrazca

Vrste polj in načini vnosa

Uporaba pravilnih vrst vhodnih elementov HTML izboljša tako uporabnost kot kakovost podatkov:

Te majhne tehnične podrobnosti naredijo smiselno razliko na mobilnih napravah, kjer je tipkanje težje in je bolj verjetno, da bodo uporabniki zapustili obrazce.

Pametne privzete vrednosti in samodejno izpolnjevanje

Podprite samodejno izpolnjevanje brskalnika z uporabo standardnih imen polj (name, email, tel, organization). Samodejno izpolnjevanje zmanjša čas dokončanja obrazca za do 30 % in znatno zmanjša napake.

Dodajte ustrezne atribute autocomplete, da pomagate brskalniku izpolniti pravilne podatke:

• autocomplete="email" za polja e-pošte
• autocomplete="given-name" za ime
• autocomplete="family-name" za priimek
• autocomplete="organization" za ime podjetja

Validacija v vrstici

Preverjajte vnose obrazca, ko uporabnik tipka, namesto po oddaji. Validacija v vrstici zmanjša napake obrazca za 22 % in poveča stopnje dokončanja za 10-15 %.

Učinkovita validacija v vrstici:

• Prikazuje kazalnike uspeha za pravilno izpolnjena polja
• Prikazuje sporočila o napakah poleg ustreznega polja
• Uporablja jasna, koristna sporočila o napakah („Vnesite veljaven e-poštni naslov” namesto „Neveljaven vnos”)
• Preverja ob zamegljitvi (ko se uporabnik premakne na naslednje polje), ne ob vsakem pritisku tipke

Besedilo označbe mesta v primerjavi z oznakami

Besedila označbe mesta nikoli ne uporabljajte kot edine oznake za polje obrazca. Besedilo označbe mesta izgine, ko uporabnik začne tipkati, in ga pusti brez konteksta. Vedno uporabite vidne oznake nad ali poleg polj obrazca.

Besedilo označbe mesta lahko dopolni oznake z prikazom primera oblike vnosa (npr. „[email protected]”), a nikoli ne sme nadomestiti oznak.

Večstopenjski obrazci

Ko morate zbrati več kot dve ali tri podatkovne točke, večstopenjski obrazci dosledno presegajo enostopenjske. Razdelitev dolgega obrazca na korake zmanjša zaznano kompleksnost in izkorišča načelo zaveze: ko nekdo dokonča prvi korak, je bolj verjetno, da bo nadaljeval.

Najboljše prakse za večstopenjske obrazce

Pokažite napredek. Vrstica napredka ali kazalnik koraka („Korak 1 od 3”) postavi pričakovanja in motivira dokončanje.

Začnite z najlažjim vprašanjem. Začnite z nespremljajočimi polji (e-pošta, ime), preden zahtevate bolj občutljive ali kompleksne informacije.

Skupirajte sorodna polja. Vsak korak bi moral vsebovati logično sorodna vprašanja. Ne mešajte osebnih informacij s poslovnimi podrobnostmi v istem koraku.

Dovolite navigacijo nazaj. Uporabniki bi morali imeti možnost vrniti se in urediti prejšnje korake brez izgube podatkov.

Samodejno shranite napredek. Če uporabnik zapusti obrazec na sredini, ohranite vnos, da se lahko vrne in ga dokončata kasneje.

Kdaj uporabiti večstopenjske obrazce

Strategije postavitve obrazcev

Kraj, kamor postavite e-poštni obrazec, je enako pomemben kot to, kako ga oblikujete. Isti obrazec se lahko konvertira pri 1 % ali 8 % glede na postavitev.

Kontekstualna postavitev

Postavite obrazce tam, kjer se ujemajo s trenutnim namenom obiskovalca. Obrazec za prijavo na koncu vrednostnega prispevka na blogu se bolje konvertira kot isti obrazec v stranski vrstici, ker je bralec ravnokar prejel vrednost in je nagnjen k temu, da želi več.

Postavitev nad pregibi

Obrazci, ki so vidni brez drsenja, takoj zajamejo obiskovalce, a delujejo najbolje v kombinaciji z močno, takoj jasno vrednostno ponudbo. Če vaša vrednostna ponudba potrebuje razlago, postavitev pod pregibom s podporno vsebino nad obrazcem deluje bolje.

Vgrajeni in prekrivni obrazci

Vgrajeni obrazci (vrstično z vsebino strani) so manj vsiljivi in dobro delujejo za priložnosti prijave, ki so vedno prisotne. Prekrivni obrazci (pojavna okna, drsni elementi, modalna okna) zahtevajo pozornost in dobro delujejo za časovno omejene ponudbe ali namen izhoda.

Za poglobljeno analizo strategij pojavnih oken in prekrivnih oken glejte naš vodnik o optimizaciji prijave na glasilo.

Lepljivi obrazci

Lepljivi obrazec, ki sledi uporabniku med drsenjem, ohranja priložnost konverzije vedno vidno. Tega uporabljajte redko: majhna, trajna vrstica je učinkovita, a velik lepljivi obrazec se zdi agresiven in lahko sproži negativne reakcije uporabnikov.

Oblikovanje obrazcev za mobilne naprave

Ker mobilni promet presega 60 % za večino spletnih mest, oblikovanje obrazcev za mobilne naprave ni optimizacija, temveč zahteva.

Najboljše prakse za mobilne naprave

• Polja na polno širino: Vnosi obrazca bi morali zajemati polno širino mobilnega zaslona
• Velika območja za dotik: Gumbi bi morali biti vsaj 44x44 pikslov
• Ustrezni razmiki: Pustite dovolj prostora med polji, da preprečite napačne dotike
• Ustrezne tipkovnice: Uporabite type="email" in type="tel" za prikaz prave tipkovnice
• Minimizirajte tipkanje: Kadar je mogoče, uporabite spustne menije, preklopi in potrditvena polja
• Izogibajte se vodoravnim postavitvam: Polja razporedite navpično na mobilnih napravah
• Preskusite doseg palca: Kritični elementi bi morali biti v udobnem dosegu palca

Odzivno oblikovanje obrazcev

Oblikujte obrazce najprej za mobilne naprave, nato izboljšajte za večje zaslone. Obrazec, ki dobro deluje na 320 px-široki zaslon, bo deloval na vsaki napravi. Obratno ne velja.

Analitika in testiranje obrazcev

Ključne meritve za sledenje

Kaj A/B testirati

Prednostno preskusite te elemente po vrstnem redu tipičnega vpliva:

1. Število polj obrazca - Odstranitev enega polja lahko poveča konverzije za 10-25 %
2. Vrednostna ponudba / naslov - Razlog za naročnino je najpomembnejši
3. Besedilo gumba poziva k dejanju - Besedilo, usmerjeno v dejanje, preseže splošno besedilo
4. Postavitev obrazca - Lokacija dramatično vpliva na vidnost in namen
5. Oblikovanje in postavitev - Vizualna hierarhija in estetika vplivata na zaupanje

Preskuse izvajajte vsaj 1.000 ogledov obrazca na različico, da dosežete statistično pomembnost.

Integracija obrazcev z vaším trženjskim sklopom

E-poštni obrazec je le tako koristen kot sistemi, ki so z njim povezani. Vsaka oddaja bi morala sprožiti vrsto avtomatiziranih dejanj.

Bistvene integracije obrazcev

Sinhronizacija CRM. Novi stiki bi se morali samodejno pojaviti v vašem CRM-ju z ustreznim označevanjem in segmentacijo. Integracija platforme Tajo z Brevo zagotavlja, da se oddaje obrazcev iz vaše spletne trgovine neposredno sinhronizirajo z vašimi profili strank, vključno s zgodovino nakupov, interesi za izdelke in podatki o vključenosti.

Avtomatizacija dobrodošlice. Vsak novi naročnik bi moral takoj prejeti e-poštno sporočilo ali zaporedje dobrodošlice. Zamudo ali manjkajoča e-poštna sporočila dobrodošlice zapravljajo trenutek največje vključenosti. Za navdih glejte naše primere e-poštnih sporočil dobrodošlice.

Segmentacija. Že od začetka segmentirajte naročnike s podatki obrazca in vedenjem. Celo eno dodatno polje (kot „Kaj vas najbolj zanima?”) lahko omogoči relevantnejšo segmentacijo e-pošte.

Analitika. Sledite uspešnosti obrazca v svoji analitični platformi, da razumete, kateri viri prometa, strani in kampanje privabijo najdragocenejše prijave.

Pogoste napake pri e-poštnih obrazcih

Nepotrebna uporaba CAPTCHA. CAPTCHA zmanjša konverzije za 3-8 %. Kot manj vsiljivo metodo preprečevanja neželene pošte uporabite polja z loncem za med (nevidna polja, ki jih roboti izpolnijo, a ljudje ne).

Splošna sporočila o napakah. „Prišlo je do napake” ne pove uporabniku nič. Specifična, koristna sporočila o napakah zmanjšajo frustracijo in povečajo stopnje dokončanja.

Brez povratnih informacij o potrditvi. Po oddaji pokažite jasno potrditveno sporočilo ali preusmerite na zahvalno stran. Prepuščanje uporabnika v negotovosti glede tega, ali je oddaja delovala, ustvarja tesnobo in podvojene oddaje.

Ignoriranje dostopnosti. Obrazci morajo biti navigabilni s tipkovnico, združljivi z bralniki zaslona in imeti zadosten kontrast barv. Dostopno oblikovanje ni neobvezno, je tako zakonska zahteva kot dobra poslovna praksa.

Testiranje brez različnih brskalnikov. Obrazec, ki deluje v Chromu, se morda zlomi v Safariju ali Firefoxu. Preden zaženete, preskusite v vseh večjih brskalnikih in napravah.

Gradnja obrazcev z Brevo

Brevo zagotavlja vgrajenega graditelja obrazcev, ki v enem orodju obravnava oblikovanje, validacijo, dvojno potrditev in upravljanje seznamov. Obrazci, ustvarjeni v Brevo, se samodejno sinhronizirajo z vašimi seznami stikov in lahko takoj po oddaji sprožijo poteke dela avtomatizacije.

Ključne prednosti:

• Graditelj obrazcev z vleci in spusti z odzivnimi predlogami
• Vgrajena dvojna potrditev za skladnost z GDPR
• Samodejna sinhronizacija seznama stikov
• Integracija s poteki dela avtomatizacije za takojšnje nadaljnje ukrepanje
• Koda za vgraditev za enostavno postavitev na katero koli spletno mesto

V kombinaciji z Tajevo sinhronizacijo podatkov e-trgovine obrazci, oddani v vaši trgovini, samodejno obogatijo profile strank z zgodovino nakupov in vedenjem med brskanjem, kar omogoča bolj ciljano zaporedja nadaljnjega ukrepanja.

Naslednji koraki

Začnite z revizijo obstoječih e-poštnih obrazcev glede na načela v tem vodniku. Ugotovite elemente z največ trenja, naredite eno spremembo naenkrat in izmerite rezultate. Majhne izboljšave se hitro seštejejo: 20-odstotno povečanje konverzij obrazcev pomeni 20 % več naročnikov, potencialnih strank in na koncu strank, iz povsem istega prometa, ki ga že imate.