Izdelava spletnih obrazcev za konverzije se začne z enim vprašanjem: kje obiskovalec obupa? V okviru, ki ga pokriva izdelava spletnih strani, so obrazci mesto, kjer se interes spremeni v denar ali pa izgine. Tam se najpogosteje skrivajo drobne tehnične napake, ki jih nihče ne opazi, dokler ne pogleda številk.
Zakaj obrazec odloči o prodaji?
Obiskovalec je do obrazca že opravil večino poti. Izdelek je izbral, ceno sprejel, dostavo preveril. Obrazec je zadnja ovira in vsaka ovira tu stane več kot kjerkoli drugje na strani.
Raziskovalni inštitut Baymard, ki že več let zbira podatke o spletnih nakupih, navaja povprečno stopnjo opustitve košarice okoli 70 odstotkov. Približno vsak peti kupec po njihovih anketah odneha zaradi predolgega ali preveč zapletenega postopka blagajne. Isti inštitut ocenjuje, da bi lahko večja spletna trgovina s boljšo zasnovo blagajne dvignila konverzijo za okoli 35 odstotkov.
Težava ni v dizajnu v ožjem pomenu, temveč v ravnanju polj, sporočil in tipkovnice. Sivo polje s svetlosivim besedilom je lahko lepo, a če kupec ne ve, kaj je v njem narobe, ne kupi.
Kako nejasna sporočila o napakah ubijajo nakupe
Najpogostejši greh je validacija, ki se sproži šele po kliku na gumb. Kupec izpolni štirinajst polj, pritisne »Naroči« in stran se vrne na vrh z rdečim napisom »Neveljaven vnos«. Katero polje? Zakaj? Tega ne pove nihče.
Včasih je še huje. Obrazec ob napaki izbriše vnesena gesla ali številko kartice, kar nakup običajno konča.
Kaj dela dobro sporočilo?
Dobro sporočilo je ob polju, ne na vrhu strani. Pove, kaj popraviti, ne le, da je nekaj narobe. Primerjava:
- Slabo: »Napaka v polju.«
- Bolje: »Vnesite poštno številko s štirimi števkami, na primer 1000.«
- Slabo: »Neveljaven e-naslov.«
- Bolje: »V naslovu manjka znak @. Ste mislili ime@gmail.com?«
Pomembna je tudi časovnica. Validacija sproti, ko kupec zapusti polje, je običajno boljša od validacije po vsaki črki, ker ta kupca graja, še preden je končal tipkati. Napaka mora imeti poleg barve tudi besedilo ali ikono, sicer jo barvno slepi obiskovalci ne opazijo.
Napačni tipi polj na mobilcih
Več kot polovica obiskov spletnih trgovin v Sloveniji in drugod prihaja z mobilnikov, blagajne pa so pogosto zasnovane za namizni računalnik. Tipkovnica je tu pogosto največja ovira.
Če je polje za telefonsko številko navadno besedilno polje, se odpre črkovna tipkovnica. Kupec mora preklopiti na številke, kar je dovolj, da kdo odneha. Popravek je nekaj vrstic kode.
- type=”email” odpre tipkovnico z znakom @ in pikami.
- type=”tel” ali inputmode=”numeric” prikaže številčnico, uporabno za telefon, poštno številko in številko kartice.
- autocomplete (na primer given-name, postal-code, cc-number) omogoči brskalniku, da izpolni podatke z enim dotikom.
- Velikost polj naj bo vsaj 44 slikovnih pik v višino, da kupec ne zadeva sosednjega polja.
Pozorni bodite tudi na velikost pisave. Če je pisava v polju manjša od 16 slikovnih pik, iOS ob fokusu samodejno približa stran, kupec pa mora nato iskati pot nazaj.
Primer pred in po poenostavitvi blagajne
Naslednji primer je ponazoritven. Zasnovan je na tipičnih vrednostih, ki jih po takih posegih poročajo spletne trgovine, ne na posamezni stranki. Predstavlja trgovino s športno opremo in okoli 6.200 obiski blagajne na mesec.
Izhodišče
- 19 polj, obvezna registracija pred nakupom.
- Napake se pokažejo po oddaji, z generičnim sporočilom.
- Telefon, poštna številka in kartica so navadna besedilna polja.
- Zapuščanje blagajne: 74 odstotkov, na mobilnikih 82 odstotkov.
Poseg
Polja so skrčili na 9, saj kraj samodejno sledi iz poštne številke, ime in priimek pa sta združena v eno polje, kjer to ne ovira dostave. Registracijo je zamenjal nakup brez računa, ponudba računa pa je prišla šele po potrditvi. Validacija je tekla sproti, s sporočili ob polju. Dodani so bili ustrezni tipi polj in atributi autocomplete.
Rezultat po osmih tednih
- Zapuščanje blagajne: 74 → 51 odstotkov.
- Zapuščanje na mobilnikih: 82 → 58 odstotkov.
- Konverzija blagajne: 26 → 49 odstotkov.
- Naročila na mesec: približno 1.610 → 3.040, pri enakem prometu in enakem oglaševalskem proračunu.
Cena, izdelek in oglas so ostali isti. Spremenilo se je le to, kako lahko je bilo plačati. Pri tem velja opozorilo: dobiček ni vedno tako velik, saj je izhodišče tu zelo slabo. Trgovina, ki ima že dobro blagajno, bo videla manjši skok.
Ali obrazci vplivajo na uvrstitev v Googlu?
Neposredno ne. Google obrazca ne ocenjuje kot samostojnega dejavnika, blagajne pa so pogosto tako ali tako izključene iz indeksa. Posredno se vplivi vendarle seštevajo.
Prvič, strani z obrazci, kot so povpraševanje, prijava na novice ali rezervacija, so pogosto pristajalne strani. Če se jim ob nalaganju premakne postavitev ali se polje na dotik odzove z zamudo, trpita kazalnika CLS in INP, ki sta del nabora Core Web Vitals. Ta nabor Google upošteva pri ocenjevanju izkušnje na strani.
Drugič, obiskovalec, ki obupa in se vrne na rezultate iskanja, pošilja signal, da stran ni rešila njegove težave. Google ne razkriva, kako točno to uporablja. A za denar ni treba čakati na uvrstitve: konverzija se izboljša že pri obstoječem prometu.
Kaj preveriti najprej
Večina popravkov ne zahteva prenove. Zadostuje en popoldan z mobilnikom v roki in odprtim obrazcem.
- Katera polja so res obvezna? Vsako odvečno polje je razlog več za odhod.
- Kaj se zgodi ob napaki? Če se podatki izbrišejo, je to prva stvar za popravilo.
- Ali se na telefonu odpre prava tipkovnica pri e-naslovu, telefonu in poštni številki?
- Ali brskalnik ponudi samodejno izpolnitev naslova?
- Ali je gumb za oddajo viden brez pomikanja, ko je tipkovnica odprta?
Šele ko so te osnove urejene, ima smisel testirati barve gumba ali besedilo na njem. Pri izdelavi spletnih obrazcev je smiselno začeti z merjenjem, na katerem polju obiskovalci odstopijo, in šele nato spreminjati videz.
Meritev je preprosta. Analitika, na primer Google Analytics 4 s sledenjem dogodkov na posameznih poljih, pokaže, kje se izgubi največ obiskovalcev. Če polovica odstopi pri polju za telefonsko številko, razlog verjetno ni v ceni izdelka.
