10 tips om de conversie op je formulieren te verhogen.

Artikel

10 tips om de conversie op je formulieren te verhogen.

door

Of je bezoeker zich nu aanmeldt voor een nieuwsbrief of een formulier gebruikt om een cursus aan te schaffen; een formulier is een belangrijk onderdeel van een website als het gaat om conversie optimalisatie. Bij Level Level ontwerpen we eigenlijk geen enkele website meer waarop geen formulier wordt gebruikt. We leggen daarom graag uit waar wij rekening mee houden bij het ontwerpen van een goed converterend formulier. Maar we geven vooral jou een aantal tips die je kunnen helpen bij het inrichten van jouw formulieren.

Tip 1: Bedenk waarom je een formulier nodig hebt

Een webformulier is een uitermate geschikt middel om bepaalde informatie van je bezoeker te verkrijgen. Dit kan bijvoorbeeld in de vorm van een contactformulier, een bestelformulier of door het mogelijk te maken een whitepaper of andere informatie aan te vragen. Wanneer je een duidelijk doel voor jezelf en je bezoeker hebt geformuleerd, kan je je formulier hierop afstemmen. Wanneer je dit niet doet, kun je eigenlijk ook niet verwachten dat je bezoeker het formulier gaat invullen. Het moet namelijk wel helder zijn wat hij in ruil voor het achterlaten van zijn gegevens kan verwachten. Om conversie te creëren met je formulieren is het dus belangrijk dat je concrete doelen stelt. Bepaal met welk doel je een webformulier wilt opzetten en ga na wat ervoor nodig is om dat doel te bereiken. En dit helpt je ook nog eens om je conversie te kunnen meten!

Tip 2: Realiseer je dat niet iedereen in de ideale situatie jouw website bezoekt

Om een goed formulier te ontwerpen is het belangrijk dat je rekening houdt met de staat waarin je bezoeker zich kan bevinden. Niet iedereen bezoekt rustig achter een bureau je website en bekijkt deze op een desktop scherm. Tegenwoordig zijn we vaak onderweg en bezoeken we bijvoorbeeld op een mobiele telefoon diverse websites. Dit heeft ook als gevolg dat we regelmatig in een afleidende en rumoerige omgeving zijn als we een website bezoeken, denk bijvoorbeeld aan een trein. Daarnaast zijn er ook mensen met fysieke of mentale beperkingen, die veel problemen kunnen hebben met het invullen van een formulier.

In onze trainingen van de Level Level Academy over toegankelijkheid, doen we regelmatig de ‘ballonnen opdracht’. Deze opdracht simuleert hoe het is als je een formulier probeert in te vullen met een beperking. Tijdens deze opdracht is het de bedoeling met één hand een actie uit te voeren op een website op je mobiele telefoon, terwijl je met de andere hand een ballon in de lucht probeert te houden. Ga dán maar eens na of je formulier inderdaad zo makkelijk in te vullen is 😉

Wist je dat 20% van alle mensen baat heeft bij een toegankelijke website en daarmee dus ook bij een toegankelijk formulier? Reken maar uit wat dit voor de conversie van jouw formulier betekent, wanneer je optimalisatie voor toegankelijkheid laat liggen…

Onze tip is dus: sta stil bij het feit dat niet iedereen zich in de ideale situatie bevindt als ze jouw formulier invullen. Je kunt hier rekening mee houden door de inhoud van je formulier concreet en duidelijk op te schrijven. Lange lappen tekst zijn dan bijvoorbeeld een echte no go. Wij houden hier zelf rekening mee door bijvoorbeeld te letten op de grootte van de tekst en door bepaalde velden wel of niet te groeperen. Hier vertel ik later in dit artikel nog meer over.


Tip 3: Vraag alleen naar essentiële informatie

Met de AVG-wetgeving in het achterhoofd is het goed om jezelf af te vragen welke gegevens je écht nodig hebt van je bezoeker. Dit komt neer op het volgende: dataminimalisatie. Dataminimalisatie houdt in dat je niet meer informatie vraagt van je bezoeker dan strikt noodzakelijk voor het beoogde doel. Zet dus geen veld neer waarbij je naar de geboortedatum van een bezoeker vraagt, wanneer het voor je product/dienst niet noodzakelijk is een geboortedatum uit te vragen.

Velden optioneel maken is in dit geval geen oplossing. Je verzamelt dan namelijk alsnog gegevens als je bezoeker deze velden invult en daarnaast kan het ervoor zorgen dat je formulier als overweldigend wordt ervaren. Het uitvragen van meer informatie dan nodig zal bij een bezoeker eerder een drempel opwerpen dan hem wegnemen. Dus onthoudt in dit geval: less is more.

Wij houden altijd rekening met het ontwerpen van formulieren door privacy by design als uitgangspunt te hebben. In dit artikel leggen we hier meer over uit.

Tip 4: Leg uit waarom je bepaalde informatie nodig hebt

Wanneer je inzichtelijk maakt waarom je bepaalde informatie nodig hebt van je bezoeker, kun je ervoor zorgen dat de ‘drempel’  tot het invullen van deze informatie wordt weggenomen. Het kan bijvoorbeeld handig zijn om een telefoonnummer uit te vragen bij je bezoeker. Als je helder kunt maken waarom je dit nodig hebt, bijvoorbeeld om contact op te kunnen nemen met betrekking tot een bestelling, zal je bezoeker eerder geneigd zijn om zijn telefoonnummer in te vullen. Dit kan bijvoorbeeld door een zogenaamde ‘tooltip’: een klein icoontje bij een veld die bij een mouse-over actie een uitleg over het desbetreffende invoerveld laat zien. Tijdens het design proces houden wij rekening met deze mogelijkheid door in het design zo’n tooltip of een ander handigheidje op te nemen, waardoor jij extra verklarende tekst kwijt kunt bij een invoerveld.

Geen tooltip gebruiken bij gevoelige informatie versus wel een tooltip gebruiken om uit te leggen waarom een telefoonnummer nodig is

Tip 5: Zorg voor een duidelijke flow

Een onderzoek uitgevoerd door UX researchers bij Google heeft uitgewezen dat het label van een invoerveld het beste linksboven het invoerveld gezet kan worden. Op deze manier leidt je je bezoekers namelijk visueel door een formulier heen. Een absolute dooddoener is om het label te verwijderen en de placeholder (het invoerveld zelf) te gebruiken als label.  Dit zorgt er namelijk voor dat zodra je bezoeker het formulier invult, het label verdwijnt en hij of zij misschien niet meer weet wat hij moest invullen. Best onhandig als je een lang formulier aan het invullen bent.

Daarnaast is het aan te raden het gebruik van meerdere kolommen in je formulier te vermijden. In ons design zorgen wij ervoor dat je velden in je formulier zoveel mogelijk in één kolom staan om je bezoeker zo door een ‘visuele trechter’ te leiden. Het plaatsen van twee invoervelden naast elkaar kan wel. Maar wij zorgen er altijd voor dat dit alleen gebeurt bij velden die een associatie met elkaar hebben, zoals voornaam en achternaam of straat en huisnummer. Als je zelf een formulier maakt, kan je hier natuurlijk ook rekening mee houden. Denk dan ook aan een logische volgorde van je invoervelden. Als je deze ‘flow’-tips opvolgt dan help je je bezoeker om je formulier sneller in te vullen en is de kans een stuk kleiner dat hij of zij afhaakt.


Velden in verkeerde volgorde en onlogische plaatsing versus velden in logische volgorde en correcte associatie
Creëer een logische volgorde van velden en plaats alleen velden naast elkaar met een logische associatie.

Tip 6: Groepeer of creëer stappen wanneer noodzakelijk

Een formulier met veel velden kan best overweldigend overkomen op je bezoeker. Wanneer je formulier veel velden bevat, is het daarom prettig als deze makkelijk scanbaar zijn. Dit kun je doen door velden met veel gemeenschappelijke factoren te groeperen onder één categorie. Zo zie je vaak de categorie ‘persoonlijke gegevens’ of ‘contact’ in een formulier voorbij komen.

Ook kan het waardevol zijn om je formulier op te breken in stappen. Dit is zeker geschikt voor de meer complexe formulieren. Denk bijvoorbeeld aan een bestelformulier. Door informatie op te breken in behapbare ‘chunks’ zorg je ervoor dat je bezoekers de gegeven informatie beter kunnen verwerken. Daarnaast creëer je een extra motivatie voor je bezoekers om het formulier af te ronden. Doordat zij telkens een stap invullen en verder gaan in het formulier, motiveer je hen om het formulier af te ronden. Dit heet het ‘endowed progress effect’ en houdt in dat wanneer je (kunstmatig of niet) voortgang creëert voor een bezoeker, hij of zij meer gemotiveerd is om de actie af te maken. Niemand wil namelijk zijn voortgang kwijtraken.

Velden in één lange lijst versus velden groeperen of opdelen in stappen
Groepeer velden of maak gebruik van stappen in je formulier

Tip 7: Toon optioneel bij een veld in plaats van verplicht

De meeste formulieren hebben meer verplichte velden dan optionele velden (zie ook tip 3). Het is daarom beter om de bezoeker te laten zien welke velden optioneel zijn dan welke er verplicht zijn. Het is een vriendelijkere boodschap voor je bezoeker als hij ziet welke velden er optioneel zijn, dan als hij gewezen wordt op alle verplichte velden door middel van een rode asterisk. Daarnaast is het voor ons als webspecialisten of contentmarketeers misschien duidelijk wat een asterisk betekent, maar niet iedereen is bekend met het feit dat een asterisk gelijk staat aan een verplichting. Dit kan dus alleen maar meer ruis en verwarring veroorzaken. En dit is dan weer schadelijk voor je conversie! We raden daarom aan om je optionele velden te ‘markeren’ met het woordje optioneel . Gevolg: je gebruikers begrijpen je formulier beter en zullen eerder geneigd zijn je formulier in te vullen.

Een formulier met asterisk bij verplichte velden versus een formulier waarin alleen optioneel is gemarkeerd
Toon optioneel in plaats van verplichte velden

Tip 8: Breng context in foutmeldingen

Niets is zo vervelend als erachter komen dat je een aantal velden niet of onjuist hebt ingevuld, nadat je dacht dat enorm lange formulier dan toch eindelijk afgerond te hebben. Dit kan je vermijden door een validatie van de velden plaats te laten vinden terwijl je bezoeker een formulier invult. Zorg er dan wel voor dat dit niet gebeurt tijdens het typen, maar wanneer de bezoeker een veld verlaat. Voor lange formulieren kan het fijn zijn om voor deze methode te kiezen.

Ook is het wenselijk je gebruiker te laten weten wat er misgaat bij het invullen van het formulier. Wij zorgen er altijd voor dat een foutmelding op de juiste plek tevoorschijn komt, bijvoorbeeld onder het invoerveld of ernaast. Het groeperen van foutmeldingen en deze boven of onder je formulier zetten, vermijden wij het liefst; de gebruiker is hierdoor namelijk totaal de context van een foutmelding kwijt. Je kunt ook zelf aan de slag met het geven van meer context door de tekst van je foutmeldingen helder te verwoorden. Maak duidelijk wát er fout gaat bij het invullen van het formulier en probeer waar mogelijk je bezoeker een hint te geven, zodat hij het formulier wel succesvol kan afronden.

Tip 9: Reken je bezoeker niet te hard af

Voor foutmeldingen lijkt rood in eerste instantie een goede keuze. Maar wanneer je bezoeker alleen maar opvallende rode error messages ziet, kan dit erg intimiderend overkomen. Dit zorgt er misschien zelfs voor dat je bezoeker het formulier niet afmaakt. Zorg er daarom voor dat je foutmeldingen wel opvallen en de juiste context geven, maar maak ze niet té intimiderend.

Jij kunt dit zelf doen door een vriendelijke tone-of-voice in de copy van een foutmelding. Hiermee voorkom je dat deze tekst intimiderend overkomt. Wij zullen hier altijd rekening mee houden door een passende kleur te kiezen voor een foutmelding. En aangezien wij toegankelijk ontwerpen, zorgen we er niet alleen voor dat foutmeldingen met een kleur worden aangeduid, maar ook altijd met een vorm. Dit doen we bijvoorbeeld door een icoontje toe te voegen aan de foutmelding. Op deze manier zorgen we ervoor dat bezoekers van je website met een visuele handicap, zoals kleurenblindheid, de foutmeldingen óók kunnen zien.

Standaard foutmelding versus vriendelijkere foutmelding
Probeer foutmeldingen niet te intimiderend te laten overkomen.

Tip 10: Maak een concrete call-to-action

En dan is daar het moment; je bezoeker heeft je formulier volledig en correct ingevuld en wilt zijn formulier inzenden… Zorg voor extra overtuiging door een goede call-to-action toe te voegen aan je verzendknop. Slechts ‘verzend’ als tekst is dan niet altijd genoeg. Relateer de tekst in de knop aan de actie van de gebruiker , zoals; ‘Download de whitepaper’. Bij het plaatsen van een bestelling fungeert ‘Betalen’ als een goede call-to-action wanneer je bezoeker naar een betaalomgeving wordt gestuurd en ‘Bestelling plaatsen’ als de betaling via een factuur plaatsvindt.

Nietszeggende call-to-action versus een call-to-action met meer context
Probeer altijd een call-to-action tekst concreet te maken voor de actie.


Kortom…

Als jij een helder doel voor je formulieren voor ogen hebt en je formulier hierop afstemt, als je alleen essentiële informatie uit vraagt, uitlegt waarom je die informatie nodig hebt, een vriendelijke tone of voice aanhoudt in jouw formulieren, een concrete call-to-action en een toegankelijke en logische opbouw van je formulier waarborgt (groepering, context), dan moet het met die conversie helemaal goed komen!

Help jij hulp nodig en zijn jouw webformulieren wel aan een opfrisbeurt toe?

En ben je benieuwd hoe deze meer conversie kunnen opleveren dan ze nu doen? Laten we dan samen in gesprek gaan om te kijken hoe we samen de conversie van de formulieren op jouw website kunnen verbeteren!

Over de auteur

  • Andrée Lange

    Andrée Lange

    Digital Designer

    Als Digital Designer bij Level Level werk ik samen met het team aan mooie WordPress websites. Ik vertaal de vraag van de klant naar een mooi, gebruiksvriendelijk product die goed aansluit op de eindgebruiker.

    Ga naar de team pagina van Andrée Lange

Vertel ons over je plannen en ambities!

Wij vinden elke uitdaging tof.