Mobiele webshop ontwikkelen? 5 tips voor een goede user experience!

28 augustus 2017

We zien in de online wereld al een tijd lang een verschuiving in het gebruik van apparaten, ook wel ‘devices’ genoemd. Zo neemt het gebruik van mobiele apparaten steeds meer toe. Wil je als bedrijf een website laten maken? Dan is het dus van belang dat je ‘mobile first’ als uitgangspunt neemt. Hoe kun je de user experience op de mobiele website verbeteren? In deze blogpost geef ik je vijf tips die je direct toe kan passen!

Hoe wordt een telefoon gebruikt?

Voor we overgaan tot de tips is het allereerst goed om te weten hoe de mobiele telefoon gebruikt wordt. Onderzoek toont namelijk aan dat een mobiele telefoon op verschillende manieren wordt vastgehouden. Het is belangrijk om hier rekening mee te houden wanneer de mobiele website of webshop door de designers wordt gemaakt.

gebruik telefoon

Hoe groter de telefoon, hoe moeilijker om met je duimen in het bovenste deel van de website te tappen. 75% van de interacties op mobiele apparaten wordt uitgevoerd met de duim. Ook is er verschil in het gebruik van de telefoon met de linkerhand of de rechterhand. Onderstaande afbeelding laat duidelijk zien wat de goed – en minder goed – bereikbare gebieden zijn op de smartphones van tegenwoordig.

telefoon bedienen

Tip 1: zorg voor een sticky menu

Bovenstaand onderzoek onderstreept het van belang van een sticky menu. Een sticky menu is een menu dat nooit uit het zicht van de gebruiker verdwijnt. Dit menu moet op een plek aanwezig zijn die makkelijk te bereiken is en waar men makkelijk met de duim kan tappen. Uit bovenstaande afbeelding blijkt dat een menu onderaan het scherm een slim idee is. Onderstaand een voorbeeld van Fatboy.com die hier in het mobiele design rekening heeft gehouden met dit gegeven:

voorbeeld fatboy

Tip 2: slim gebruik van mobile inputs

Maak gebruik van een dynamisch toetsenbord. Op deze manier voorkom je onnodige taps. Onderstaand een goed voorbeeld van wat wij bedoelen met slim gebruik van mobile inputs:

mobile inputs

Wanneer de bezoeker een veld met cijfers in moet vullen, maak het hem/haar dan zo gemakkelijk mogelijk en zorg dat het toetsenbord meteen cijfers toont. Zo voorkom je onnodige taps en irritatie bij bezoekers.

Tip 3: maak gebruik van floating labels

Door het gebruik van floating labels weet je precies wat je moet invullen in welk veld. Op deze manier voorkom je miscommunicatie: de bezoeker weet precies wat er van hem of haar gevraagd wordt. Bekijk onderstaande afbeelding voor een voorbeeld van floating labels bij onze klant VanBommelschoenmode.nl:

floating labels VanBommel

Tip 4: zorg voor de juiste posities van elementen

Het is belangrijk dat de call-to-action van je website/webshop ‘above the fold’ aanwezig is. Dit geldt voor desktop, tablet én mobiel. Vaak is het zo dat elementen die belangrijk zijn – zoals een bestelbutton – niet duidelijk zichtbaar zijn.

Onderstaand twee voorbeelden van Coolblue die hier slim mee om gaat. De bestelbutton in de eerste afbeelding is above the fold. Scroll je dieper naar beneden? Wanneer de bestelbutton uit beeld raakt, verschijnt het artikel met de winkelwagenbutton bovenin het scherm.

 

 

Voorbeeldmenu CoolBlue

Tip 5: optimaliseer de websitesnelheid

Eén van de grootste ergernissen onder mobiele gebruikers is de laadtijd van de website/pagina’s. Dit is dan ook een reden voor bezoekers om af te haken. Tegenwoordig willen mensen snel een antwoord of een oplossing. Zorg er daarom voor dat je website snel laadt. Mocht de snelheid van de website toch achterblijven, laat de bezoeker dan zien dat hij of zij nog even geduld moet hebben omdat de pagina aan het laden is. De bezoeker zal nu eerder geneigd zijn om nog even te wachten. Speel dus in op het gevoel van de bezoeker. Hoe je dit kan aanpakken? Een aantal suggesties:Voorbeelden ladenOnderstaand twee interessante voorbeelden die demonstreren hoe belangrijk snelheid is voor mobiele conversies:

  • “Amazon increased revenue by 1% for every 100ms of improvement (same as Walmart).”
  • “Shopzilla speeded up average page load time from 6 seconds to 1.2 seconds, and increased revenue by 12% and page views by 25%.”

Wij hopen dat je met deze vijf tips je mobiele website of webshop kan verbeteren. Wil je nog meer uit je website of webshop halen? Neem dan contact met ons op voor de mogelijkheden!

 

 

Plaats een Reactie

We are part of Happy Horizon