Checkout en formulieren: best practices
Deze blog ondersteunt de volgende checks:
Vaak worden websites gebruikt voor commerciële doeleinden. Dit kan een verkoop zijn, maar ook een offerte aanvraag of een contactformulier. Dit worden conversies genoemd. Formulieren en de checkout zijn de laatste stap van een conversie. Een gestroomlijnd checkout-proces en logisch gestructureerde formulieren zijn cruciaal voor een betere gebruikerservaring en hogere conversiepercentages. Ze verminderen frictie, verhogen de klanttevredenheid en maken de gebruikersreis eenvoudiger en aangenamer.
Take aways:
- Een gestroomlijnd afrekenproces vermindert winkelwagenverlating.
- Een eenvoudig afrekenproces verhoogt de klanttevredenheid en terugkerende gebruikers.
- Beperk het aantal stappen in het afrekenproces voor een kortere klantreis.
- Bied een gastafrekenoptie aan om nieuwe klanten aan te trekken.
- Gebruik automatisch invullen en opslaan van gegevens voor herhaalaankopen.
- Plaats duidelijke call-to-action knoppen in het afrekenproces.
- Groepeer gerelateerde velden in formulieren om fouten te verminderen.
- Gebruik duidelijke labels en placeholder teksten in formulieren.
- Verzamel eerst minimale informatie en vraag later om extra details.
- Implementeer realtime validatie en duidelijke foutmeldingen in formulieren.
- Optimaliseer zowel desktop- als mobiele interfaces voor een betere gebruiksvriendelijkheid.
Een UX vriendelijke checkout
Met de checkout wordt het afrekenproces bedoelt. Dit proces komt voornamelijk voor op webshops in de e-commerce. Gebruikers ervaren de checkout vaak als de grootste drempel. Je moet immers betalen en dat doet consumenten doorgaans pijn. Daarom is het belangrijk dat een checkout zo snel en eenvoudig mogelijk doorlopen kan worden. In feite is de checkout ook een formulier. De best practices over formulieren zijn voor de checkout hiervoor dus ook van toepassing.
Belang van een gestroomlijnd checkout-proces
Vermindering van winkelwagen verlating: Een eenvoudig en efficiënt checkout-proces vermindert het aantal verlaten winkelwagens. Klanten willen geen tijd verspillen aan ingewikkelde en lange checkout-stappen. Doorgaans is een niet-gebruiksvriendelijke checkout de grootste conversiekiller.
Verhoogde klanttevredenheid: Een soepel checkout-proces verhoogt de klanttevredenheid en loyaliteit. Wanneer klanten zonder problemen kunnen afrekenen, komen ze vaker terug. Ze ervaren bij jou immers minder pijn in de checkout.
De categorieën kan je horizontaal in het menu plaatsen, maar ook als blokken in de hero sectie. Indien je van beide gebruik wil maken, overweeg dan om voor de blokken ander soort categorieën te bieden. Bijvoorbeeld categorieën die inspelen op de actualiteit: Black Friday deals, zomerdeals etc. Of bied de best bezochte categorieën van je website aan.
Minimaliseer het aantal stappen
Beperk het aantal stappen in het checkout-proces. Dit verkort de klantreis en vermindert de kans dat klanten afhaken. Succesvolle e-commerce websites zoals Amazon en Bol.com tonen hoe effectief dit kan zijn.
Gebruik van gast checkout
Bied een gastcheckout-optie aan voor klanten die zich niet willen registreren. Dit verlaagt de drempel voor nieuwe klanten.
Automatisch invullen en opslaan van gegevens
Implementeer functies zoals automatisch invullen en het opslaan van klantgegevens voor toekomstige aankopen. Dit bespaart tijd en moeite voor terugkerende klanten. Grote webshops bieden vaak de mogelijkheid om verschillende adresgegevens op te slaan. Gebruikers hoeven in dat geval enkel maar een opgeslagen adres aan te klikken.
Duidelijke en zichtbare call-to-actions
Plaats goed zichtbare en duidelijke call-to-action knoppen in het checkout-proces. Dit helpt klanten om snel en zonder verwarring door te gaan naar de volgende stap.
Bied verschillende betaal- en verzendopties
Iedere gebruiker heeft zijn eigen voorkeuren in betaal- en verzendopties. Consumenten die in steden wonen zullen bijvoorbeeld sneller gebruik maken van pick-up points en personen die veel pijn ervaren bij betalen zullen sneller kiezen voor Paypal of creditcard.
Zorg voor gebruiksvriendelijke cross- en upsell mogelijkheden
vóór de checkout begint maken veel webshops gebruik van de mogelijkheid om verwante producten aan te bieden. Bijvoorbeeld een hoesje voor je telefoon of schroeven bij een boormachine. Dit is een goede mogelijkheid om extra omzet te realiseren. Echter kunnen gebruikers het ook ervaren als opdringerig en kan het de checkout belemmeren. Zorg daarom dat verwante producten niet te prominent aangeprezen worden. Gebruik bijvoorbeeld geen pop-ups, maar plaats de producten op het winkelwagen scherm, vlak voordat de checkout begint.
Desktop
Op desktops kun je gebruik maken van de extra ruimte om het checkout-proces overzichtelijk te houden. Plaats stappen duidelijk in een rij of kolom en zorg voor grote, goed leesbare call-to-action knoppen.
Mobiel
Op mobiele apparaten zijn de uitdagingen anders. Zorg voor een eenvoudig en overzichtelijk proces dat past op kleinere schermen. Gebruik grote knoppen en zorg dat belangrijke informatie direct zichtbaar is.
Een gestroomlijnd afrekenproces vermindert de winkelwagenverlating en verhoogt de klanttevredenheid, wat leidt tot meer voltooide aankopen en herhaalaankopen.
Een ingewikkeld afrekenproces kan leiden tot frustratie bij gebruikers en een hogere kans op winkelwagenverlating, wat resulteert in gemiste verkopen.
Logisch Gestructureerde Formulieren voor een optimale gebruikerservaring
Websites die ingezet worden voor leadgeneratie of informatieve websites maken vaker gebruik van formulieren zonder betaling. Bij deze formulieren geldt eigenlijk hetzelfde als voor de checkout: zorg dat gebruikers het proces zo snel mogelijk kunnen doorlopen. Echter is de drempel bij formulieren vaak lager, afhankelijk van het doel van de inschrijving.
Verschillende doelen bij formulieren kunnen zijn:
- Inschrijven voor een nieuwsbrief
- Contactgegevens achterlaten voor een offerte
- Formulier om contact op te nemen met het bedrijf
In het geval van een offerteformulier zal de drempel hoger zijn dan andere formulieren. Zorg dan dat de formulieren extra toegankelijk zijn.
Het Belang van Logische Structurering van Formulieren
Vermindering van Fouten en Frustraties: Een logische structuur en groepering van gerelateerde velden verminderen fouten en verhogen de gebruiksvriendelijkheid. Gebruikers begrijpen beter wat van hen wordt gevraagd.
Verbeterde Conversie: Goed gestructureerde formulieren dragen bij aan hogere conversiepercentages doordat gebruikers het formulier sneller en correct invullen.
Introduceer het formulier
zorg dat je het formulier duidelijk en transparant introduceert. Leg bijvoorbeeld uit wat je met de contactgegevens gaat doen en verwijs naar het privacybeleid. In het geval van leadgeneratie: geef duidelijk aan wat de consument kan verwachten. Gaan jullie hem/haar binnenkort bellen? Of krijgt de gebruiker een mail waarin een afspraak ingepland kan worden?
Groepeer gerelateerde velden
Groepeer gerelateerde informatie om het formulier eenvoudiger en overzichtelijker te maken. Dit helpt gebruikers om snel de juiste informatie in te vullen.
Gebruik duidelijke labels en placeholder Teksten
Duidelijke labels en placeholder teksten begeleiden de gebruiker en maken het invullen van het formulier eenvoudiger. Geef duidelijk aan welke velden verplicht zijn en welke niet. Zo kunnen gebruikers gemakkelijk velden overslaan, wat het proces versnelt. Indien je vooral verplichte velden vraagt, kan je er ook voor kiezen om alleen de optionele velden te labelen. Dit kan minder verplicht overkomen.
Maak gebruik van "progressieve profilering"
Verzamel in eerste instantie minimale informatie en vraag later om extra details. Dit vermindert de aanvankelijke weerstand bij gebruikers. Dit is echter wel lastig. Als je achteraf te veel informatie vraagt, kunnen gebruikers alsnog uitstappen. Overweeg om extra vragen bijvoorbeeld in een mailing te stellen.
Validatie en Foutmeldingen
Implementeer realtime validatie en duidelijke foutmeldingen om gebruikers te helpen bij het invullen van formulieren. Dit voorkomt frustratie en zorgt voor een betere gebruikerservaring.
Voorkom wisselen tussen muis en toetsenbord
zorg dat de gebruiker eenvoudig naar het volgende invoerveld kan navigeren zonder hoeven te wisselen tussen muis en toetsenbord. Bijvoorbeeld door Tab navigatie. Indien dit mogelijk is, geef dit dan ook duidelijk aan in de instructies. Op mobiel kan dit met de Enter knop in op het mobiele toetsenbord. Voor de algemene toegankelijkheid op je website is toestenbordnavigatie ook belangrijk. Lees hier meer over de website toegankelijkheid voor UX.
Desktop
Op desktops kun je formulieren breder opzetten en meer informatie op één scherm tonen. Zorg voor een logische volgorde en duidelijke groepering van velden.
Mobiel
Op mobiele apparaten is het belangrijk om formulieren kort en bondig te houden. Gebruik grote invoervelden en zorg dat de formulieren gemakkelijk in te vullen zijn met touch door de invoervelden niet te klein te maken. Indien er op de mobiele viewport te weinig ruimte beschikbaar is voor alle invoervelden, bijvoorbeeld in een checkout, zorg dan dat het proces opgedeeld wordt in meerdere schermen. De gebruiker moet dan horizontaal kunnen navigeren tussen deze schermen.
Logisch gestructureerde formulieren verminderen fouten en frustraties bij gebruikers, wat leidt tot hogere conversiepercentages en een verbeterde gebruiksvriendelijkheid.
Slecht gestructureerde formulieren kunnen gebruikers verwarren en frustreren, wat leidt tot een hogere kans op fouten en een lagere conversie.
