3 tips til konverteringsstærke formularer

En standardformular er en hurtig løsning, og er god til det helt basale. Men for at formularen opleves brugervenlig og at den er resultatskabende, så kræver det flere overvejelser til designet end blot standardløsningen. I det følgende vil jeg fremhæve de overvejelser, som du bør have i baghovedet når du designer din formular.

Overordnet set så er der egentlig tre trin, som du skal have integreret. De tre trin er i hvert fald det smarteste sted at starte for at danne dig et overblik over din formular – og hvor godt integreret de måske allerede er i din løsning. Det første du skal for at skabe overblik er følgende spørgsmål til formularen: Er der en klar og tydelig struktur, som vider tydeligt dine ønsker til brugeren og hvad der hører til hvor? Efterfølgende skal du sikre brugervenligheden gennem vejledning. Vær klar i din feedback til brugeren, når der er mangler og korrekte oplysninger (også kendetegnet som hjælpetekster). Slutteligt er det muligvis en no-brainer og alligevel er det uhyre vigtigt: enkelthed. Keep it simple er kodeordet, når det kommer til brugervenlighed. Enkelthed, fokus og lad brugeren fritekste så lidt, som muligt.

Så – det var dét. Sådan laver du en kick-ass formular, som virkelig skaber resultater for din virksomhed på den ene eller anden måde. Easy peasy? Ja! Men for nørderiets skyld, så lad os gå lidt mere i detaljer. Der er nemlig yderligere overvejelser at gøre sig i forbindelse med brugervenligheden i forbindelse med din formular – og dem skal du da ikke snydes for!

Din formulars opbygning handler først og fremmest om, hvilket formål den har: tilmeldelse af nyhedsbrev, indmeldelse, køb af produkt, database osv. Hvert formål kræver naturligvis hver sin tilpassede formular. Brugervenligheden har du nok regnet ud er et kæmpe buzzword i denne henseende, og det kan ikke gentages nok. Er formularen for uoverskuelig, ustruktureret, for fri eller for uklar – så står brugeren af, og så mister du altså én kunde i butikken. Dét er vi ikke interesserede i!

1. Struktur

Hvis vi starter med strukturen, som er med til at skabe overskuelighed og tydeliggøre budskabet. Dette kan hjælpes ved, at kigge på input-felterne. Det handler om at holde dem simple. Er det nødvendigt at dele for- og efternavne op i to felter, eller kan det samles? Desto færre felter brugeren skal udfylde, desto mere overskuelig virker opgaven. Ønsket er at formularen udfyldes, og dermed skal vi altså skære ind til benet, så brugeren føler den bruger mindst mulig tid på at udfylde. Når jeg nævner tid, så er det fordi tid er en meget vægtende faktor, når det kommer til formularudfyldelse. Derfor er en anden essentiel overvejelse ’scanbarheden’. Er indholdet hurtigt at komme igennem og let for øjet at konsumere? Hold dig til én kolonne, da dette medvirker et overblik (og dermed optimeret scanbarhed) og lad ikke felterne bliver længere end der er brug for tegn til. Der argumenteres for, at dette kan genere det æstetiske øje en smule som designer. Men min egen personlige mening er egentlig, at æstetikken er bevaret på grund af strukturen og scanbarheden – men dette vil jo altid være en smagssag. Læg din store æstetiker på hylden, og ha’ scanbarhed for øje.

En anden måde at skabe god struktur i din formular er, at gøre den step-baseret og gøre indholdet grupperelateret. Det grupperelaterede kommer til udtryk i blandt andet at holde kundeinformation på step 1, leveringsoplysninger step 2, osv. Step-baserede formularer giver brugeren en oplevelse af flow, og det skaber et hurtigere overblik, da indholdet er gjort mere spiseligt.

2. Indholdsmæssige hjælpemidler

Brugervenligheden er i top, når brugeren formår at udfylde formularen rigtigt første gang. Brugeren kan nemt blive irriteret, hvis formularen melder fejl flere gange på grund af manglende svar osv. Ret beset så er det vores fejl, fordi vi ikke har forklaret og tydeliggjort vores ønske klart nok (sådan anbefaler jeg i hvert fald, at vi tænker det!). Så vær et skridt foran i dine overvejelser, og tænk brugervenlighed og hjælp ind så vidt muligt uden at regne dine brugere som mindre begavede 😉

Dette kan blandt andet gøres under overskrifter, hjælpetekster og labels. Overskrifterne er selvklart med til at give brugeren en information om, hvilken genre de skal til at besvare. Hjælpeteksten er medvirkende til at skabe mening for brugeren. Hvorfor skal de vide det? Hvorfor skal jeg svare på det? Hvis du allerede på forhånd forklarer, hvorfor disse informationer er nødvendige, så er brugeren allerede mere samarbejdsvillig til at hurtig fyre dem afsted, idet de har tryghed, forventningsafstemt og motivationen til det. Labels bør være beskrivende, og derfor er det ikke altid en fordel at gøre brug af placeholders, idet brugerens hukommelse hurtig kan svækkes – og så har de altså glemt hvad de er i gang med at svare på. Slutteligt er selection også en overvejelse, som bør inkorporeres i dit design. Mange er tilhængere af dropdowns, men disse kan virke uoverskuelige for brugeren, hvis der er mange valgmuligheder. Det er igen blandt andet hukommelsen, som kan svækkes – hvis brugeren skal træffe et valg mens den scroller i dropdown-menuen. I stedet kan det anbefales at skrotte dropdowns ved eksempelvis antal, og erstatte den med en plus- og minus-funktion.

Slutteligt er der feedback til brugeren. Der KAN jo smutte et felt, og det er ikke altid vores skyld, som designere. Derfor er feedback til brugeren vigtig at have med. Tag brugeren i hånden og hjælp den til at forstå, hvad der gik galt og hvordan den hurtigt løser problemet og genfinder flow. Som sagt kan det ligeså vel være din skyld som designer, og tænk ikke din bruger som dum. Tonen i feedback – særligt ved fejl – er vigtig. Positiv tone – så irritereres brugeren ikke. Yderligere er det ret motiverende for brugeren, at få en løbende feedback. F.eks. en grøn markør i siden, når oplysningen er korrekt. Dette er medvirkende til færre fejlmeldinger, og ødelæggelse af flowfølelsen hos brugeren – og dét gør dem mere positive for formularen.

3. Call to action (CTA)

Slutteligt er et god fif, at skrive Call to Action ud. Når formularen er afsluttet, så i stedet for ”Køb”, så kan det være ”Til kassen”. Dette er medvirkende til at brugeren får en oplevelse af konsekvenser og hvor i forløbet den befinder sig. Det er alt i alt også overbliksskabende. Og det er vist efterhånden tydeligt at vores brugere godt kan lide den slags. Som mit evigt tilbagevendende mantra, så er det din brugergruppe og dit site. Så det er dig, der bør vide hvad der fungerer bedst. Kundekendskab og segmentering er alfa-omega, og derfor er det ligeledes også et essentielt redskab til dit formulardesign. Der er ikke nogen endegyldig vej – og dette er blot en række inspirationer, som jeg selv synes er et ret godt fingerpeg mod en bedre formular!

Rigtig god fornøjelse 🙂