Website conversie-optimalisatie - deel 2 - mobile first
Uw website is een verleidingsinstrument. Dat wil zeggen dat uw website zo aantrekkelijk mogelijk dient te zijn om bezoekers ervan te overtuigen uw product of dienst af te nemen. Vanaf dit moment noemen we de beslissing om na een bezoek de dienst of het product af te nemen "conversie". Er is met andere woorden een beslissing genomen om verleid te worden en tot aankoop over te gaan.
Om de website zo verleidelijk mogelijk te maken zijn er een aantal belangrijke elementen die belangrijk zijn om een hogere conversie voor elkaar te krijgen. De belangrijkste zijn: lettertype(n), afbeeldingen, pagina-indeling, formulieren, call-to-actions (de bezoeker verleiden om een volgende actie op de website te ondernemen, zoals verder lezen, contact opnemen, brochure downloaden). Als u de volgende tips ten aanzien van het ontwerp van uw website overneemt, kan het bijna niet anders dan dat de conversie op uw website zal verhogen.
In delen zal ik de komende periode tips en trucks geven om de conversie te verhogen. Vandaag deel 2; "mobile first design".
Mobile First Web Design
Steeds meer gebruikers bekijkt uw website met een mobiel apparaat (denk maar eens aan hoeveel mensen je om je heen de hele dag met de mobiele telefoon bezig ziet zijn op straat, in winkels, stations, treinen, werk). Door voorrang te geven aan het mobiele ontwerp van uw website, zal betrokkenheid van gebruikers van uw website verhogen en de conversie op de site verbeteren. Sites zoals Google en Facebook hebben het mobile-first principe maximaal geimplementeerd, omdat ze al vroeg beseften dat gebruikers de voorkeur gaven aan het mobiel gebruik van hun websites. Het gedrag van gebruikers op mobiele ontwerp is anders dan hoe mensen websites voor desktop schermen bezoeken. Op mobiele website wordt bijvoorbeeld genavigeerd door content via scrollen, vegen en touch. Als de inhoud van de website niet geoptimaliseerd is voor gebruiksgemak van de web gebruiker, zullen ze de website te verlaten zonder enige soort actie.
De gedachte achter mobile first is dat je gedwongen wordt scherpe keuzes te maken over de relevantie van de inhoud en vormgeving, doordat je rekening dient te houden met verschillende schermgroottes en rekenvermogen van smartphones. Voor overtollige informatieverstrekking is op het kleine scherm geen plaats: alleen de essentie van je product, informatie, dienst of boodschap blijft over. En omdat je bij responsive design (een ontwerp dat zicht aanpast aan de grootte van het scherm waarop het getoond wordt) op alle devices exact dezelfde informatie aanbiedt, krijg je ook op tablet en desktop een betere website. Duidelijker en gebruiksvriendelijker voor bezoekers, makkelijker voor sitebeheerders.
In het licht van het toenemende mobiel gebruik van websites, is Google websites die geschikt zijn voor mobiel gebruik gaan belonen met een verhoogde zichtbaarheid op de zoekmachine.
Tips en truks:
01 Denk bij het ontwerp en inrichting van de website welke inhoud relevant is voor mobiel en desktop gebruik.
02 Zorg dat in de mobiele weergave niet relevante opmaak en inhoud wordt weggelaten. Als je een website mobiel bekijkt, heb je bijvoorbeeld geen behoefte aan slideshows en beeldvullende foto's, maar wil je to-the-point informatie (niet elke klant heeft een eindeloze internetbundel voor onderweg). Ook heb je op een mobiele site geen afbeelding nodig van 1000 x 3000 pixels, maar een afbeelding die is geoptimaliseerd voor mobiele weergave.
03 Zorg ervoor dat relevante inhoud geschikt is om op een mobiel apparaat te bekijken. Adobe Flash wordt bijvoorbeeld niet ondersteunt op Apple apparaten, terwijl HTML video tegenwoordig op vrijwel elk apparaat wordt ondersteund.
04 Door gebruik te maken tijdens het ontwerp van een grid (een raster waarop inhoud gepositioneerd wordt in rijen en kolommen), kun je ervoor zorgen dat de inhoud logisch gerangschikt wordt. Met behulp van een grid kun je ervoor zorgen dat elementen gelijkmatig worden verdeeld en automatisch onder elkaar worden gerangschikt. Zo kan er gekozen worden om bepaalde onderdelen naast elkaar weer te geven op tablet, terwijl je ze op mobiel juist ónder elkaar wil tonen. Doordat dit systeem de standaard is bij gids, kunnen ontwikkelaars per element op je pagina gemakkelijk aangeven hoe ze in verschillende situaties moeten worden weergegeven. De software code van het grid doet de rest. Er zijn softwarematige frameworks beschikbaar (zoals bijvoorbeeld getskeleton.com, 960.gs en het meest gebruikte getbootstrap.com.
05 Het Google Developers-platform biedt een 'mobile-friendly test'. Bovendien kunnen mobiele apps en content ook worden geconfigureerd via Google Developers Console.