Webformularer er sjældent ret sjove at udfylde og vi gider ikke bruge energi på dem. Du er til gengæld meget afhængig af dem, som webshopejer, da de er en del af fundamentet i din webshop. Har du gode og overskuelige formularer, kan du øge din konverteringsrate. Så find dine kritiske briller frem og se dine formularer grundigt igennem.– Af Sidsel Birkholm.
Hvilken rolle spiller dine formularer?
Du har måske en formular til dit nyhedsbrev, en kontaktformular og en formular i checkout-processen. Det er via disse formularer, at din besøgende giver dig sine personlige oplysninger for at købe et produkt eller få vejledning i produktsortimentet.
For at en formular virker, skal den være brugervenlig og skabe så lidt friktion som mulig for brugeren. Folk hader generelt at bruge tid på formularer. Er den besværlig at udfylde eller virker den uoverskuelig, er der stor risiko for at dine besøgende vælger at hoppe fra. Hvilket betyder, at din konverteringsrate falder.
Design af formularer er et stort emne, men her kommer nogle generelle regler, som du skal være opmærksom på.
Fjern så mange felter i formularen som muligt
Se på din formular og spørg dig selv hvilke felter du egentlig godt kan undvære. Spørg kun om den information, der er absolut nødvendig for, at transaktionen kan fuldføres.
F.eks. har du brug for at kende navnet ved tilmelding til nyhedsbrev? Prøv at nøjes med kun at have feltet med email-adresse. Husk, jo mere information du beder om, desto større risiko er der for fejl eller irritation, som i værste fald kan betyde, at kunden dropper at fortsætte.
I ovenstående eksempel kan det for eksempel diskuteres, om det er nødvendigt at bede kunden om fødselsdato og faxnummer for at købe en æske chokolade.
Forklar hvorfor du beder om informationen
Er det et felt med mere personlig information, så forklar kunden, hvorfor du beder om den information, og hvad den vil blive brugt til.
Eksempelvis er det en god idé, at skrive hvorfor du beder om telefonnummer eller en email. Forstår kunden, at det udelukkende er for at få information ved levering eller for at modtage en ordrebekræftelse giver det pludselig god mening for kunden.
Er din kunde bange for at blive spammet med en masse reklame, vil de være mindre velvillige til at udfylde feltet. Tænk hele tiden kunden først.
I dette eksempel har webshoppen skrevet en lille forklaring ved feltet for mobilnummer. Læg til gengæld mærke til placeringen af selve beskrivelsen. Den er svær at se og burde stå tættere på selve feltet eller lige nedenunder.
Brug tydelige titler og placer dem ved feltet
Skriv præcise titler til hvert felt. Det skal være helt klart for kunde, hvad det er for et felt hun er i gang med at udfylde.
Placér titlen på feltet tæt på selve indtastningsfeltet, så at brugeren ikke er i tvivl om hvilken tekst og indtastningsfelt, der hører sammen.
Her er mærkaterne tydelige, men bemærk igen, hvordan selve teksten står for langt placeret fra selve indtastningsfeltet. Det er ikke intuitivt, hvilken titel der hører til hvilket felt.
Feltet skal passe til teksten
Størrelsen af tekstfeltet skal passe til den tekst, din kunde skriver i den. Din bruger skal kunne se, den tekst hun skriver i feltet. Kan hun ikke se hele sit gadenavn eller sin kommentar, vil der være større risiko for fejl.
I ovenstående eksempel er der givet plads til at skrive 500 tegn, hvorimod selve feltet slet ikke er dimensioneret til den længde tekst.
Fleksible felter
Gør felterne så fleksible som mulig, så de er nemme for din kunde at udfylde. Lad være med at kræve f.eks. specielle datoformater.
Bevar de udfyldte felter
Du har sikkert oplevet, at dine kunder forlader checkout-processen for at læse handelsbetingelser, opdatere kurven med varer eller finde en rabatkode.
Vær her opmærksom på, at du bevarer den data, din kunde allerede har indtastet i formularen, så hun ikke er tvunget til at indtaste den igen.
Gode fejlbeskeder
Kommer din kunde til at udfylde et felt forkert eller har overset et felt, så skriv en tydelig besked i nærheden af feltet. Også gerne i toppen af siden, hvilket gør det lettere for brugeren at få øje på, at der er opstået en fejl og hvor den skal rettes.
I eksemplet her, er det tydeligt, hvilke felter, der mangler at blive udfyldt. Til gengæld er fejlbeskederne hverken særlig varme eller præcise. Skriv i stedet noget i retning af: ”Du mangler at udfylde dit navn”, så forstår brugeren med det samme, hvad det drejer sig om.
Formularen skal visuelt være lækker og nem at overskue
Giv din kunde lyst til at udfylde formularen. Brug noget plads mellem felterne, så brugerens øjne kan hvile. I nedenstående eksempel er felter og tekst presset alt for meget sammen, og formularen ser sjusket og forvirrende ud.
Formularen skal fungere på mobil
Dine kunder forventer, at de kan handle hos dig via mobil og tablet. Så sørg for at dine formularer (og din webshop) fungerer på mobile enheder. Nedenstående formular ville jeg ikke have den store lyst til at udfylde på mobilen.
Konklusion
Ovenstående er retningslinjer inden for klassisk brugergrænsefladedesign af formularer. Det vigtigste er, at huske på, at så længe din kunde oplever ro og mening med formularen, vil hun have færre problemer med at udfylde den.
Det bedste du kan gøre, er at brugerteste dine formularer for at forstå, hvilke problemer der opstår og dermed finde den version af din webformular, der konverterer bedst.
