6 UX-tips voor een converterend websiteformulier

Resultaat behalen met je website? Dat vraagt om een goed formulier. Of het nu gaat om contact opnemen, een tafel reserveren of solliciteren via een formulier: mensen houden van gemak. Met een formulier kun je precies van je bezoeker vragen wat je nodig hebt. Gemakkelijk voor jou én je websitebezoeker.

Zo'n formulier 'flans' je wel even snel in elkaar. Je zet een aantal invoervelden onder elkaar en zorgt dat je een knop hebt om het formulier te verzenden. Easy peasy, lemon sque... Stop maar! Maar liefst 81% van de internetgebruikers zegt wel eens een formulier te verlaten - terwijl ze al velden hebben ingevuld!

Er komt dus veel meer bij kijken om een websitebezoeker een gebruiksvriendelijke ervaring te geven en een converterend websiteformulier te bouwen.

Wil jij resultaat boeken met jouw websiteformulier(en)?
In deze blog lees je 6 UX-tips om het beste uit jouw online formulieren te halen

6 UX-tips voor een converterend websiteformulier | Loyals

Share

Trucs voor een goede gebruikerservaring met je formulier

Een scorende website staat of valt met de gebruikerservaring (UX). Dit geldt voor je gehele website, maar zeker ook voor je formulieren. Je wilt voorkomen dat bezoekers vroegtijdig afhaken, omdat je formulier bijvoorbeeld te lang of te complex is. Elk formulier is anders en vraagt om zijn eigen specifieke verbeterpunten. Toch zijn er een aantal tips die eigenlijk voor alle formulieren gelden.

Lees ze hieronder!

UX-tip 1: Houd het simpel

Houd de vragen die je wilt stellen relevant. Wil je extra inschrijvingen voor een nieuwsbrief? Vraag dan alleen naar een naam en e-mailadres. Heb je een restaurant en gebruik je een formulier zodat bezoekers een tafel kunnen reserveren? Vraag dan niet naar adresgegevens. Het restaurant komt niet bij jou eten, toch? ;-).

Wist je dat je sommige vragen niet eens mág stellen? In een sollicitatieformulier is het volgens de Algemene wet gelijke behandeling alleen mogelijk om informatie te verkrijgen die relevant is voor de functie. Een werkgever mag geen onderscheid maken op gebied van geslacht, nationaliteit, ras, godsdienst, seksuele geaardheid, politieke voorkeur of levensovertuiging. Laat deze vragen dus ook weg uit het formulier. 

UX-tip 2: Kies de juiste invoervelden

Zorg ervoor dat je het juiste type veld en visuele weergave van je veld gebruikt. 

Typen velden

Er zijn verschillende typen velden waar je uit kunt kiezen. Wanneer je bijvoorbeeld je bezoekers maximaal één keuze wilt laten selecteren, gebruiken we een selectielijst (dropdown) of keuzerondjes. De keuze hiervoor is afhankelijk van de hoeveelheid opties. Is je vraag bijvoorbeeld om een land van herkomst te selecteren? Dan gebruiken we vaak de dropdown, zodat de honderden keuzes niet te veel ruimte innemen op je formulier. Wanneer je een ja/nee vraag stelt, kun je beter keuzerondjes gebruiken. De keuzemogelijkheden zijn meteen zichtbaar en het scheelt een extra klik voor je bezoekers.

Gebruik een keuzerondje of knoppen als je een keuze aanbiedt met weinig opties. Het 'verstoppen' van antwoorden in en dropdown heeft hierbij namelijk geen meerwaarde. Het zorgt voor een extra klik en geen duidelijk overzicht.

Correcte antwoordmogelijkheid weinig keuze formulier | Loyals

Maar wat voor soort velden zijn er eigenlijk allemaal en wanneer gebruik je welk veld?

  • Vrije tekstinvoer
    Een vrije tekstinvoer gebruik je voor de invoer van variabele waardes, zoals voornaam en woonplaats. Bij een vrije tekstinvoer kun je een controleslag instellen, zoals een telefoonnummer of e-mailadres. Hiermee voorkom je foute antwoorden.

    Voor een wachtwoord gebruiken we een veld met maskering, zodat het wachtwoord in eerste instantie in bolletjes getoond wordt. Velden kun je verduidelijken met een icoon.

Wachtwoord invullen websiteformulier | Loyals
  • Checkbox
    De checkbox gebruiken we voor vragen waar één of meerdere antwoorden mogelijk zijn. Denk hierbij aan interesses of het accepteren van verschillende actievoorwaarden. 

Checkbox websiteformulier | Loyals
  • Keuzerondjes
    Bij keuzerondjes is er slechts één antwoord mogelijk. Je gebruikt keuzerondjes voor onder andere ja/nee vragen, een kledingmaat of aanhef. Als er veel mogelijke antwoorden zijn, kun je ervoor kiezen om naast een paar opties [Anders] met een vrije invoer erachter toe te voegen.

Antwoordmogelijkheid keuzerondje | Loyals
  • Selectielijst (dropdown)
    Heeft je vraag veel antwoordmogelijkheden? Dan kiezen we voor een dropdown, omdat de lijst met antwoordmogelijkheden anders te lang wordt.

    Wanneer er maximaal één antwoord mogelijk is, heb je aan een simpele dropdown voldoende. Zijn er meerdere antwoorden mogelijk? Voeg dan labeltjes toe die je keuzes opsomt, zoals hieronder. De geselecteerde keuzes kun je wegklikken met een [x] of het prullenbak icoontje.

Dropdown met tags websiteformulier | Loyals

Niemand zit te wachten om door een ellenlange lijst te scrollen. Voeg aan jouw formulier bij een dropdown met veel antwoorden een zoekfunctie toe. Bekijk als voorbeeld onderstaande dropdown.  In eerste instantie zie je een alfabetische lijst met landen. Wanneer je de ‘N’ intypt krijg je alleen de landen die beginnen met een ‘N’ te zien, zodat je bijvoorbeeld ‘Nederland’ snel kunt vinden. Weer een stukje gebruiksgemak!

Antwoordmogelijkheid met zoekfunctie | Loyals

Visuele weergave van je velden

Om je formulier kracht bij te brengen, kun je bepaalde velden visueel ondersteunen. Denk bijvoorbeeld aan de kleuren van een kledingstuk in een webshop. We gebruiken een border om een cirkeltje met een kleur erin heen. Dit omdat je anders bij een witte variant de kleur niet ziet.

En nee, sorry... deze t-shirts zijn (nog) niet te koop! ;-)

Loyals branding shirt | Loyals

UX-tip 3: Gebruik labels en placeholders

Bij invoervelden gebruiken we labels en placeholders.
Een placeholder is de tekst in een invoerveld, welke komt te vervallen als je begint met typen. Gebruik dus nooit alleen een placeholder, maar voeg ook een vast label toe. Zo voorkom je onduidelijkheid over het invoerveld, op het moment dat de eerste letter is getypt. 

Correcte websiteformulier indeling | Loyals

Je kunt de placeholder het beste gebruiken voor een instructie of voorbeeld. De kans op foutieve antwoorden is hiermee kleiner. Dit is met name handig bij een vraag met een specifiek format, zoals een KvK-nummer, geboortedatum of e-mailadres.

UX-tip 4: Geef duidelijk aan wanneer er iets fout gaat

Zorg voor een duidelijke foutmelding, zodat duidelijk is welk van de velden fout is ingevuld. Klinkt logisch, toch?

Foutmelding antwoord niet ingevuld formulier | Loyals

UX-tip 5: Sluit af met een bedankpagina

Oké, dit is niet per se voor extra formulierinzendingen. Dit komt pas ná een ingezonden formulier. Maar wel zo netjes om even iemand te bedanken voor het invullen. Zorg hier ook direct dat de bezoeker weet wat de volgende stappen zijn! Laat weten wanneer je contact opneemt, of dat de persoon nog een extra bevestiging in de mailbox krijgt. Heeft de bezoeker een bestelling geplaatst? Dan stuur je diegene natuurlijk graag een e-mailbevestiging met het besteloverzicht, ordernummer en track & trace.

Ook dit is allemaal onderdeel van een goede gebruikerservaring en de totale klantreis.

Bericht is succesvol verzonden | Loyals

UX-tip 6: Houd dezelfde tone of voice aan

Tot slot: zorg ervoor dat je bij zowel de formuliervelden, foutmeldingen en bedankpagina dezelfde tone of voice (u of jij/je) aanhoudt als op de rest van je website. De tone of voice is een belangrijk onderdeel van jouw merk en (merk)positionering. Dus zéker wanneer iemand op het punt staat interactie aan te gaan met jouw merk, is het belangrijk om de bezoeker op de bijpassende manier aan te spreken.

Ga aan de slag met online formulieren

Bekijk jouw webformulieren nog eens goed, nu je hier meer over weet. Gebruik de tips om de gebruikerservaring van jouw online formulieren nóg beter te maken.

Benieuwd naar waar jouw webformulieren op kunnen verbeteren? Ik kijk graag met je mee!

Terug naar overzicht

Interesse gewekt of gewoon een vraag? Neem contact met ons op

Als je hieronder je gegevens achterlaat, komen we zo snel mogelijk bij je terug. Liever bellen of mailen? Dat kan ook! Je bereikt ons telefonisch op 0297 38 52 52 en via de mail op hallo@loyals.com.