E-commerce checkout stap 4: Navigatie

Written by Guido Jansen in
February 2012

Hier vind je richtlijnen met betrekking tot het weergeven van de navigatie en de acties die er in de navigatie uitgevoerd kunnen worden. Laat klanten het proces afronden, ondanks validatie errors. Het is natuurlijk handig als je bepaalde velden zoals postcode, e-mailadres en telefoonnummer automatisch laat valideren zodat hierin geen fouten voorkomen.

Maar wat als er een fout in de validator zit? Misschien woont de persoon wel echt op een postcode die de validator niet herkent of is de postcode nieuw. De persoon kan dan het checkout proces niet voltooien en de bestelling niet afronden.

Gebruik validators dan ook altijd als check en vraag de consument het veld te controleren op juistheid. Maak het echter niet onmogelijk het formulier in te sturen met een invalide veld, dit kan je zomaar weer enkele klanten kosten. Voor meer informatie vindt u hier ook een interessant artikel.

Zorg voor tekstuele fallback voor afbeeldingen 

Zorg dat voor alle afbeeldingen een “alt=tekst” is ingevuld. Als de afbeelding dan om wat voor reden dan ook niet geladen kan worden dan geeft een alt tekst met “Groen T-shirt zonder bedrukking” de consument veel meer vertrouwen het juiste product in de winkelmand te hebben dan “2011876782.PNG”.

Zorg voor een altijd zichtbare winkelmand met inhoud

Zorg ervoor dat de winkelmand altijd zichtbaar is in het kwadrant rechtsboven op de website. Probeer altijd zo veel mogelijk informatie te tonen zoals aantal producten, totaalprijs en bij voorkeur ook de afbeeldingen van de producten. Doe dit ook tijdens het gehele checkout proces zodat de consument altijd zicht heeft op de producten die hij gaat aanschaffen.

Toon alle processtappen.

Consumenten raken snel de weg kwijt als zij niet weten wat zij kunnen verwachten. De consument wil weten hoe het checkout proces eruit ziet. Zorg ervoor dat het voor de consument duidelijk is in welke stap hij nu zit, welke stappen afgerond zijn en welke stappen hij nog moet doorlopen.

Processtappen moeten klikbaar zijn

De processtappen moeten klikbaar zijn zodat de consument altijd terug kan naar een vorige stap om daar informatie aan te passen. Enkel een ‘back‘ knop is niet voldoende, je wil niet 3 keer op een back knop drukken om naar de eerste stap terug te gaan.

Optimalisatie Bestelproces 1
‍ Alle stappen zijn zichtbaar en aanklikbaar.

Zet primaire actieknop boven de fold.

Wanneer de primaire actieknop (‘Plaats bestelling’) onder de fold zit raken gebruikers snel in de war over het doel van de pagina. Alhoewel steeds meer internetgebruikers gewend raken aan scrollen, gaan de meeste gebruikers niet rustig rondkijken op de hele pagina om te kijken wat zij allemaal kunnen doen. Het moet in één keer duidelijk zijn. Verder kan men door afwezigheid van de primaire actieknop voorkomen dan men dan klikt op een secundaire knop die wél boven de fold zichtbaar is waardoor de site iets doet wat de gebruiker helemaal niet wil.

Afbeeldingen moeten klikbaar zijn.

Zorg ervoor dat de afbeeldingen tijdens de checkout klikbaar zijn, maar zorg ervoor dat gebruikers wel in het afrekenproces blijven. Na een klik op een productafbeelding kun je een pop-up laten verschijnen met productinformatie. Vaak worden logo’s van betaalmethoden weergegeven naast de selectie van betaalopties. Zorg er voor dat deze logo’s ook klikbaar zijn zodat men de betreffende optie kan selecteren. Of als je iDeal aanbiedt en alle banklogo’s toont, zorg er dan voor dan een klik op het banklogo direct linkt naar de iDeal betaling van de betreffende bank.

Optimalisatie Bestelproces 2
‍ Een klik op de afbeelding moet de optie direct selecteren.
Recent posts
Announcing a new Magento community project
Announcing a new Magento community project

I would like to share a new project with you. I’ve had this idea for over 5 years now and I’ve finally been able to make it a reality in the last couple of weeks.

Can you afford not to know? Can you afford to be wrong?
Can you afford not to know? Can you afford to be wrong?

In rapid changing online environments, continues business experimentation is a great way of constantly learning what works and what doesn’t. But then the question might arise: how far do you go? What do you test? And is it sometimes ok NOT to test something?