Conversie op mobieltjes: een usabilityprobleem

Aan de ene kant verschijnen er aan de lopende band jubelende onderzoeken die voorspellen dat over enkele weken 300% van de wereldbevolking alles via een mobiel doet, maar aan de andere kant verschijnen er ook weer rapporten waarin wordt gemeld dat mensen minder kopen via mobieltjes dan via de desktop. Ik benoem in dit artikel de oorzaken van deze tegenstrijdigheid en kom met oplossingen. Dit is een uitgeschreven, aangepaste versie van de presentatie die ik op het Emerce Eretail congres hield.

Desknots

Allereerst wil ik even het onderscheid uitleggen tussen 2 device-types: de desktop en de desknot. De desktop is wellicht wel duidelijk, dat is de klassieke computer die meestal via een muis en een toetsenbord wordt aangestuurd. De desktop is er in verschillende soorten en maten, van pieterpeuterig netbookje tot gigantische iMac. Naast deze desktops zijn de laatste jaren vooral de desknots in opkomst, een mooie verzamelnaam voor alles wat geen desktop is, bijvoorbeeld feature phones, smart phones, tablets, semi tablets, TV’s, playstations en e-readers. Deze desknots onderscheiden zich van de desktops doordat ze meestal niet door een klassiek toetsenbord en ouderwetse muis worden aangestuurd.

Device Love

Enorme hoeveelheden apparaten bestaan er om het web mee op te gaan en ze worden allemaal, liefdevol, gebruikt. Foto van Luke Wroblewski.

Cijfers

De statistieken voor de meeste websites vertonen een duidelijke stijging in het gebruik van desknots: het is niet ongebruikelijk dat 10% van je bezoekers een smartphone of een tablet gebruikt, bij sommige sites is het percentage desktops zelfs veel sneller aan het afnemen. Een interessant fenomeen bij deze cijfers is dat de conversie duidelijk achterblijft ten opzichte van de klassieke desktop. Op tablets koopt men nog wel eens iets in een online winkel (hoewel duidelijk minder dan op de desktop), op mobieltjes blijft de verkoop echt sterk achter. Een van de verklaringen die hiervoor gegeven wordt, is dat mensen nog moeten wennen aan het idee dat je via je mobiel kunt kopen. Ik geloof daar niet zo in. Laat ik het illustreren.

Foto’s

Nog altijd duikt de klassieke mythe op over de mobiele gebruiker die haast heeft en die tijdens het rennen van de bus naar de trein even snel checkt waar die trein ook al weer vertrekt. Met moeite heb ik één foto kunnen vinden die dit stereotype uitbeeldt, het enige moment waarop mensen hun mobiel namelijk niet gebruiken is als ze haast hebben. Tijdens het wachten, tijdens een romantisch diner, als je even de tijd hebt in het openbaar vervoer, tijdens het traplopen, tijdens routinematige handelingen, maar vooral ook thuis op de bank. Mensen moeten helemaal niet wennen aan die dingen, ze kennen ze beter dan wat dan ook, ze gebruiken ze de hele dag door! Maar als ze niet moeten wennen, waardoor blijven die verkopen dan toch achter?

Usability

Het antwoord is heel erg makkelijk. Het is een usability-probleem. De dingen die we gemaakt hebben voor het desktop-web zijn niet altijd even prettig te gebruiken op een desknot: kleine linkjes, lange formulieren, uitgezoomde layouts, onhandige toetsenbordjes, het zijn de kleine dingetjes die er voor zorgen dat mensen maar op zoek gaan naar een concurrent die het web wél snapt.

Onderstaande screenshots heb ik gemaakt van een formulier dat ik in moet vullen als ik een bepaald stuk software wil kopen. Zodra ik de verkoop heb afgerond, krijg ik een e-mailtje met een licentiecode.

Heel veel formuliervelden die niet echt ingevuld hoeven te worden

Alle velden van dit formulier moet ik invullen! Waarom moet ik mijn adres invullen? Sterker nog: waarom willen ze mijn naam weten? Dat is toch nergens voor nodig? De eerste eenvoudige usability-winst is te behalen door alle cruft, clutter en bloat weg te halen. Wat er dan overblijft, is een simpel formuliertje waarin je slechts het strikt noodzakelijke hoeft in te vullen.

Voorbeelden

Het versimpelde formuliertje heb ik nagemaakt. Hier kun je het bekijken en proberen in te vullen. Op een desktop zal dat geen enkel probleem zijn. Ook op een tablet is het redelijk eenvoudig te doen, maar op een klein scherm is het een beproeving. Hieronder een filmpje waarin ik laat zien hoe ditzelfde formulier er uitziet als ik het op mijn iPhone probeer in te vullen.

Let vooral ook op het continu switchen tussen de verschillende toetsenborden. Erg irritant.

Hieronder staat een filmpje van hetzelfde formulier maar met een paar kleine aanpassingen: de lay-out verandert zodra het scherm kleiner wordt (probeer maar) en de formuliervelden maken gebruik van HTML5 formulier-attributen, waardoor ze veel prettiger in het gebruik worden.

Kijk vooral ook eens naar het invullen van de datum! Mensen gaan naar casino’s en laten daar fortuinen achter om zoiets tofs te kunnen zien, en dat kun je gewoon op jouw site zetten, gratis!

Navigatie

Een ander veelvoorkomend en iets complexer usabilityprobleem is de navigatie van de site. Een patroon dat je regelmatig ziet, is de zogenaamde mega dropdown waarbij er een soort sitemap over de hele pagina heen wordt gelegd. Dit werkt prima op een groot scherm, je kunt je voorstellen dat het op een klein scherm wat lastiger is om zo iets groots met zo veel informatie op een overzichtelijke wijze weer te geven. En toch kan het, zoals je kunt zien op dit voorbeeldje dat ik heb gemaakt. Voor mensen met een klein scherm; hieronder staat een screencast van hoe het werkt.

Dit zijn maar een paar voorbeelden. Er zijn meer kleine en grote usability-issues die staan te springen om met een goede combinatie van technisch vernuft en kennis van apparaten opgelost kunnen worden. U weet ons te vinden.

Nog even wat wat termen

De manier van werken die ik hierboven heb beschreven, waarbij een website zich aanpast aan de grootte van het scherm en de mogelijkheden van het apparaat wordt met twee termen aangeduid: Progressive Enhancement en, een term die de laatste tijd veel wordt gebruikt maar die in wezen op hetzelfde neerkomt, Responsive Design. Progressive Enhancement zorgt er voor dat alle functionaliteit op een zo prettig mogelijke manier wordt geleverd. Is het een touch-screen? Dan maken we alle knoppen geschikt voor dikke vingers. Begrijpt een browser de nieuwe formulier-attributen? Mooi zo! Is een scherm breed? Dan krijg je lekker grote plaatjes te zien. Het idee dat elke site er hetzelfde uit moet zien in elke browser op elk apparaat is echt niet meer te verdedigen, de verschillen tussen al die desktops en desknots zijn gewoon te groot. Door slim gebruik te maken van hedendaagse webtechnieken en door de mogelijkheden van de verschillende apparaten zo veel mogelijk te gebruiken, kan een website er juist overal fantastisch uitzien én vooral ook overal plezierig in het gebruik worden.

Conclusie

Kennis van de technische mogelijkheden én een grondig begrip van de verschillende apparaten is een must om een hedendaagse site aangenaam in het gebruik te maken. Oude conventies (zoals 1024, The Fold, klassieke layouts) gaan niet meer altijd zomaar op en de oude technische baseline die we jarenlang hanteerden (simpel gezegd: Internet Explorer) is inmiddels flink achterhaald. En dat is maar goed ook, want met de hedendaagse technieken en die prachtige gadgets die we allemaal hebben, kunnen we nu eindelijk eens de meest geweldige en prettige dingen maken.

Interessant?

Lees dan ook onze andere artikelen over , , , , , , , , .

Reacties

  1. @Vasilis dank voor je stuk, leuk om te zien dat je dit ook elders presenteert. Aandachtspuntje: die 300% van de wereldbevolking die alles binnenkort via z’n mobiel doet moet vast 30% zijn ;-)

  2. @Dyske Beelen: Die 300% is een bewuste overdrijving (-:

  3. Wat een goed stuk, Vasilis! Ik hoop dat de lezers om te beginnen je oproep ter harte nemen om cruft, clutter, bloat en nuttleloze formuliervelden te verwijderen. Heel gemakkelijk te doen en levert veel gebruiksgemak op.
    Je moet alleen wel je marketing-afdeling er van weten te overtuigen dat het beter is om de klant goed van dienst zijn dan de klanten*database* te vullen met allerlei gegevens…

  4. @Marrije Schaake Klopt, er lopen nogal wat rare marketeers rond die het liefst alles van je willen weten. Wellicht kan een usability-test of een AB-test uitkomst bieden in dit soort gevallen.

  5. Inderdaad een leuk stuk. Ook wij worstelen soms met de lange formulieren in mobiele pagina’s. Een optie die deze problemen deels oplost is de mogelijkheid om te prefillen (ter info: we ontwikkelen landingspagina’s voor leadcampagnes, daarin wordt doorgaans meer informatie gevraagd dan de mobiele bezoeker wil invullen).
    Prefillen wordt door veel e-mailpartners gebruikt, en houdt in dat het formulier al voor de bezoeker is ingevuld (de persoonsgegevens zijn bij de mailpartner tenslotte al bekend).
    De bezoeker hoeft alleen de aanvraag nog te bevestigen (en bij nieuwsbriefinschrijvingen een extra checkbox aan te vinken).
    Hierdoor is de conversie op de specifieke mobiele pagina’s juist hoger dan op de gewone landingspagina’s (die ook prefilled zijn).

  6. Hoi Vasilis,

    leuk stuk!

    Als usalibility (invoervelden, menuopties en navigatie) zorgt voor een lagere conversie, heb je ook voorbeelden van usability voorbeelden op mobiel die wel voor een hogere conversie hebben gezorgd?

    Oftewel, zie jij usability als een algemeen probleem bij mobiel of zijn er juist veel mobiele toepassingen (sites/apps) met een slechte usability voor mobiel?

    Juist het enorme gebruik van mobiel internet, door onder andere de komst van de iPhone, doet mij denken dat juist de usability van de iPhone het verschil heeft gemaakt.

  7. Rebekka Kuijten |

    Heel herkenbaar verhaal, ik ben het helemaal met je eens. Heel irritant dat je onderweg niet even snel wat kunt regelen, juist als je even niets te doen hebt. Zelf ben ik heel enthousiast over de UPC app, als ik iets wil opnemen doe ik dat met mijn telefoon, zelfs als ik al thuis op de bank voor de TV zit. Dus er ligt een leuke uitdaging voor bedrijven!

  8. Hi Vasilis,

    Goed stuk. En herkenbaar.
    Ik gebruik zelf MacBook, iPad en iPhone. En vaak gaat het goed maar soms is het een regelrechte ramp om op je mobiel online iets te doen. En, net zoals Rebekka, is het in mijn optiek soms handig om even tussendoor – tijdens het wachten – wat te regelen of op te zoeken op je iPhone.

    Er zijn een aantal goede voorbeelden te vinden, maar helaas tevens een aantal slechte. Ik ben van mening dat bedrijven kansen, klanten en dus omzet mislopen als ze onvoldoende inspelen op de huidige trends.
    Cross platform usability is tegenwoordig een must.

  9. @Humphrey Ik weet niet zeker of ik helemaal begrijp wat je bedoelt. Ik geef enkele voorbeelden van veelvoorkomende usability-issues en geef ook tips voor verbeteringen waarmee je die issues oplost. Ik zie usability dus zeker niet als een algemeen probleem bij mobiel, sites zijn erg prettig te maken voor kleine schermen. Dit gebeurt alleen nog veel te weinig.

  10. interessante info! De stelling/kop van dit artikel is dat de conversie op mobieltjes een usibility probleem is. Maar is dat zo? Meten is weten, waar haakt de bezoeker af in het checkout proces? Drempels zoals onhandige formulieren,(te) veel verplichte velden en layout problemen verlagen de conversie – lijkt me logisch.

    Persoonlijk verwacht ik dat men met name bij het betaalproces afhaakt. Vooruitbetaal opties (via iDeal / creditcard / machtiging) zijn vaak gratis maar via mobiel onhandig (veel banken/klanten werken nog met een cardreader tbv autorisatie). Achteraf betaal opties zoals acceptgiro kosten meestal geld maar bieden wel een makkelijkere checkout.

    Zodra het via je mobiel eenvoudiger wordt om een iDeal betaling te doen zal de conversie omhoog schieten.

    Daarnaast is het soort product natuurlijk ook van belang. Ik koop geen auto, wasmachine etc met mijn mobiel. Ik verwacht ook niet dat de fashion shoppers via een hun mobieltjes gaan shoppen.

  11. @Yoyce Oude Elferink Zeker op het gebied van betalen is er heel veel winst te behalen, de problemen daar zijn helaas niet altijd zelf op te lossen en ik ben het helemaal met je eens dat als de payment providers eindelijk eens een simpele manier van betalen aanbieden dat de conversie van iedereen omhoog zal schieten, niet alleen bij mobiel overigens.

    Als je kijkt naar mijn presentatie en naar mijn voorbeeldsite en op de prijs klikt dan zie je dat ik ook wel wat heb nagedacht over het makkelijker maken van het betaalproces. Ik heb het bewust uit dit artikel gelaten, daar is nog wel een apart artikel over te schrijven, ik wilde me hier vooral concentreren op dingen die je wel zelf kunt oplossen.

    Je zal versteld staan van wat er allemaal gekocht wordt met mobieltjes. Op Craigslist is er bijvoorbeeld ooit een vliegtuig gekocht en ik kan me absoluut situaties voorstellen dat ik kleding of een wasmachine op mijn mobiel zou kopen, waarom niet? Als de usability maar prettig is.

  12. @Vasilis de koper van een vliegtuig via Craigslist zal zeker hebben bedingt dat de transactie pas definitief is als hij het vliegtuig heeft gezien/gekeurd. Kleding shoppen is een “belevenis” die je volgens mij niet via een mobieltje kunt nabootsen vanwege het kleine scherm. En waarom een wasmachine via je mobiel kopen als je thuis de beschikking hebt over een pc/notebook/ipad etc waarmee het oriënteer en bestelproces toch prettiger (sneller en goedkoper) is?

  13. @Joyce ik heb thuis misschien wel een laptop maar ik ben toch echt te lui om op te staan en er heen te lopen. Als de site prettig werkt koop ik alles vanaf mijn mobiel (dat is ook echt zo overigens). De wasmachine kan natuurlijk ook waterschade hebben veroorzaakt waardoor de laptop kapot is…

    Ik bedoel eigenlijk te zeggen dat we altijd maar aannemen dat mensen bepaalde dingen niet doen op een mobiel maar dat de praktijk uitwijst dat dat niet zo is: ze doen bepaalde dingen alleen niet als ze niet mogelijk zijn. Aannames over mobiel gebruik kloppen niet: er zijn te veel verschillende gebruikers en te veel mogelijkeheden.

    (En kleding shoppen heeft voor veel mensen, waaronder ikzelf, overigens helemaal niks met belevenis te maken, het is een noodzakelijk kwaad. Een hele praktische winkel is prima te realiseren op een klein (en groot) scherm.)

  14. Ik koop enorm veel online, maar weinig mobiel. Ik zal wel vaak mobiel zaken ontdekken die ik “voor later” opsla om dan uiteindelijk op een desktop machine de aankoop te doen. De usabilityproblemen die in het artikel vermeld worden zijn de grootste oorzaak: ondertussen heb ik geleerd dat het niet gaat werken, dus doe ik de moeite niet.

    Verder is mijn PayPal wachtwoord heel heel lang, niet echt iets wat ik op een iPhone wil typen.

    Ik zal ook vaak een vergelijkende prijsstudie willen doen en dat betekent meerdere websites bezoeken, meerdere tabs openhebben. Niet zo eenvoudig op mobile.

  15. @Wolf zo zie je maar weer dat je niet te veel aannames moet doen over wat mensen online doen. Ik ben een echte impulskoper, ik koop bijvoorbeeld veel via twitter, als iemand iets aanbeveelt, ik doe zelf bijna nooit onderzoek (en mijn paypal-wachtwoord is ook lang maar wel eenvoudig in te typen op mijn iPhone). Als een website niet te gebruiken is op mijn telefoon dan loop ik overigens niet naar mijn computer, in dat geval koop ik het gewoon niet. Dus het verhaal dat mensen dingen liever op hun computer kopen klopt ook niet altijd.

    Wel interessant om dit soort discussies te houden, de verschillen in koopgedrag worden zo duidelijk.

  16. Hoi Vasilis, wederom een fijn artikel, zelf denk ik dat de mobiele provider een belangrijke rol kan spelen op het gebied van payments, aangezien men “weet” wie de verbinding maakt, kan men op relatief makkelijke en veilige manier de gebruiker authenticeren. Daarnaast kan het bedrag gewoon met de rekening gefactureerd worden. Een andere optie die dit bied is dat men op die manier de kosten uit dataverkeer kan terugverdienen, kortom zowel de consument als de provider heeft hier baat bij. Misschien een soort van “airmiles” achtig systeem waarbij men gratis dataverkeer krijgt aan de hand van transacties.

    In een ver verleden heeft KPN hiermee geexperimenteert mbt vast internet, maar heeft men het fout aangepakt met een opt-out strategie.

    Uiteraard is security wel een issue, maar als men 100% verzekering voor eventuele fraude dekt, dan zou het geen probleem moeten zijn, een mooi systeem zou kunnen zijn wanneer een gebruiker een maximum bedrag kan opgeven, of dat grotere transacties per SMS gemeld worden, en dat men eenvoudig een transactie kan blokkeren.

Plaats een reactie

Je e-mailadres wordt niet gepubliceerd. Verplichte velden zijn met een * aangegeven.

Verschijnt je reactie niet, dan is deze mogelijk in de spam terechtgekomen. Mail ons dan even!