Tricorp – Mobiele optimalisatie
Stage opdracht – Tricorp mobiele website
Tijdens mijn stage bij Jelba heb ik voor Tricorp de homepagina van de mobiele website verbeterd. De homepagina voor mobiel was een exacte kopie van de desktopversie, hierdoor werd de pagina erg lang. Ik heb o.a. de data van de homepagina onderzocht in Google Analytics en Hotjar. Ook heb ik gekeken naar het verschil tussen desktop en mobiele gebruikers en de content geoptimaliseerd voor mobiel. Tot slot heb ik concurrentieonderzoek gedaan.
Project details
Klant Tricorp
Datum November 2017
Werkzaamheden Onderzoek & vormgeving
Data analyse – Google Analytics
Ik ben begonnen met het kijken naar de data van de homepagina. De mobiele website heeft een hoger bouncepercentage, op desktop is dit 14,36% en op mobiel 33,04%. Ook het uitstappercentage is een stuk hoger op mobiel, namelijk 26% meer. Een groot verschil tussen de desktop en mobiele website is de sessieduur. Op mobiel is dit gemiddeld maar 52 seconden, en bij desktop is dit 3 minuten en 28 seconden. Dit kan betekenen dat bezoekers snel de pagina verlaten, omdat er te veel informatie wordt weergegeven.
Data analyse – Hotjar
Met de tool Hotjar heb ik een aantal beeldschermopnames van gebruikers bekeken. Hieruit blijkt dat gebruikers voornamelijk opzoek zijn naar producten. Ze moeten lang scrollen voordat zij de call to action ‘naar alle producten’ vinden. Ook valt de button minder op, omdat deze zwart met wit is.
In de heatmaps van de homepagina is te zien dat er veel gebruik wordt gemaakt van het menu. Ook is er in Hotjar een heatmap te zien over hoe ver de gebruiker scrollen op de pagina. Zonder te scrollen is het percentage 100%, daarna wordt het percentage al gelijk lager. De helft van de bezoekers scrolt naar de populaire producten. De content over ‘Marktleider in moderne werkkleding’, ‘Verschillend hetzelfde’, ‘Trends & Innovaties’ en ‘Nieuws’ wordt door ongeveer 30% van de bezoekers bekeken.
Verschil tussen desktop en mobiele gebruikers
Gebruikers op de desktop gaan er vaak even rustig voor zitten als ze een website bekijken. Maar de mobiele bezoeker wil gelijk vinden waar hij naar op zoek is. De mobiele gebruiker is op zoek naar specifiekere informatie. Wanneer hij deze informatie niet vindt, zal hij snel vertrekken.
Content op mobiel
Mobiele gebruikers willen zo snel mogelijk de informatie krijgen die ze zoeken. Ik heb artikelen gelezen over het optimaliseren voor content op mobiel. Deze tips heb ik verwerkt in het herontwerp van de homepagina. Het belangrijkste is dat de tekst goed scanbaar is voor de gebruiker. Daarom heb ik gebruik gemaakt van korte krachtige koppen en alinea’s. Boven de vouw van de website (above the fold) moet je beginnen met een pakkende tekst, beeld of call to action. Afbeeldingen moeten alleen gebruikt worden als het de content versterkt. De gebruiker moet zelf kunnen kiezen hoeveel content hij/zij wil lezen. Dit kan door gebruik te maken van dropdowns of lees meer knoppen.
Concurrentie onderzoek
Om goede oplossingen te bedenken voor de gebruikersproblemen, heb ik gekeken naar concurrenten die ook werkkleding verkopen. Wat ik goed vind aan Dickies.com is dat je op de homepagina duidelijk ziet dat ze werkkleding verkopen door de sfeerbeelden. Op de homepagina kun je al gelijk doorklikken naar 4 categorieën. Zo komt de gebruiker sneller bij zijn doel, wat kan zorgen voor meer conversie. Op Wolverine.com is een opvallende button te zien die doorlinkt naar een nieuwe collectie. Ook kun je op de homepage al gelijk per categorie zoeken, in plaats van eerst naar het menu te hoeven te gaan. Bij Marks zie je dat de afbeeldingen de content versterken. Bijvoorbeeld bij de afbeelding van schoenen in de sneeuw, is het duidelijk dat die schoenen voor grip zorgen.
Herontwerp – homepagina
Bovenaan de pagina heb ik een sfeerbeeld met slogan/quote toegevoegd. Zo is het voor de bezoeker gelijk duidelijk dat Tricorp werkleding verkoopt. Bij het sfeerbeeld is er een call to action die naar alle producten gaat. Zo hoeft de bezoeker niet het menu te openen om producten te zoeken. Onder het sfeerbeeld zijn afbeeldingen van de Tricorp labels te zien. De beelden versterken waar het label voor staat en de gebruiker komt sneller tot zijn doel. De minder belangrijke content, zoals bijvoorbeeld nieuws is ingeklapt, zo kan de gebruiker zelf kiezen wat hij/zij wil lezen. Met het herontwerp krijgen bezoekers een duidelijker beeld van wat Tricorp verkoopt, dit kan zorgen voor een lager bouncepercentage.