Het tijdperk van websites die niet geoptimaliseerd zijn voor mobiel is voorbij. Als jij online succesvol wilt zijn met jouw bedrijf, is de mobiele versie van je website niet langer iets waar weinig tijd, aandacht en middelen aan besteed kan worden. Sinds 2011 is het gebruik van een mobiel apparaat voor zowel entertainment als informatie met 504% gegroeid. Wij komen vandaag de dag nog genoeg websites tegen die totaal niet bruikbaar zijn voor een mobiel apparaat. In deze blog lees je hoe jij een mobielvriendelijke website maakt.
Mobielvriendelijke responsive website
Voor een mobielvriendelijke website is het belangrijk dat deze op alle mobiele apparaten goed te gebruiken is. Om dit te realiseren kan je ervoor kiezen om jouw website volledig responsive te (laten) maken. Responsive wilt zeggen dat alle elementen op een website zich automatisch aanpassen naar het scherm van de gebruiker. Hiermee zorg je ervoor dat de bezoeker, ongeacht welk apparaat hij gebruikt, een goede ervaring heeft met jouw website. Dit is voor jou ook het minste werk, aangezien de content op de website hetzelfde blijft. Je hoeft er dan alleen voor te zorgen dat de content op mobiel de juiste grootte en plek krijgt.
Als je een website met WordPress hebt laten bouwen, kan je dit vaak makkelijk doen. Veel thema’s zorgen er automatisch voor dat jouw website goed bruikbaar is op mobiel. Dit verschilt overigens wel per thema, dus bekijk goed hoe jouw website er met het huidige thema uitziet op mobiel.
Is jouw website gebouwd met een pagebuilder zoals Elementor? Dan heb je iets meer controle over de mobiele ervaring van jouw bezoekers. Je kan bijvoorbeeld in de responsive modus gaan en hierin elementen aanpassen per apparaat-categorie. Zo kan je bijvoorbeeld een afstandhouder verschillende formaten geven op verschillende apparaten. Er komt hierdoor minder tussenruimte op bijvoorbeeld een telefoon dan op een tablet.
Heel vaak wordt dit over het hoofd gezien waardoor elementen soms op de verkeerde plek komen te staan. Zorg er dus voor dat je altijd kijkt naar hoe elementen zijn ingedeeld op de mobiele versie van jouw website. Voer, waar nodig is, wijzigingen door.
Mobielvriendelijke mobiele website
Als je geen responsive website wilt of kan maken, is er ook nog een andere optie. Zo kan je ervoor kiezen om een geheel mobiele versie van jouw website te (laten) maken. Bij het maken van een mobielvriendelijke mobiele website ga je anders te werk dan bij het maken van een responsive website. Bij een responsive website ga je vooral aan de slag met de elementen van een website op hetzelfde domein. Dit betekent dat alle bezoekers dezelfde content te zien krijgen, ongeacht apparaat. Deze past zich alleen aan zodat het zichtbaar is op alle apparaten.
Bij een volledig mobiele website ga je vooral aan de slag met structureren van de gebruikerservaring in een aparte omgeving. Je maakt hierbij een website die zich volledig richt op de mobiele gebruiker. Je hebt hier volledige regie over welke functonaliteiten, elementen en content de mobiele gebruiker te zien krijgt.
Heb je bijvoorbeeld een prijscalculator op de desktopversie van je website en is deze niet relevant voor mobiele bezoekers? Dan kan je er met een mobiele website voor kiezen om deze achterwege te laten. Heb je bijvoorbeeld teksten geschreven die alleen relevant zijn voor bezoekers op mobiel? Dan kan je ervoor kiezen om deze niet op de desktopversie te zetten en enkel op de mobiele versie.
Als je ervoor kiest om een aparte mobiele website te bouwen, zijn er wel een aantal dingen om rekening mee te houden. Ten eerste moet je de koppeling tussen de desktopversie en de mobiele versie goed inrichten. Dit doe je door redirects te plaatsen zodat de bezoeker altijd naar de goede versie wordt doorgestuurd. Heb tweede moet je ervoor zorgen dat de juiste content op de juiste versie van jouw website wordt geplaatst. Check onze blog over responsive vs mobiele websites als je wilt weten waar je nog meer rekening mee moet houden.
Lees ook: Responsive website of Mobiele website?
Laadtijd
Voor een mobielvriendelijke website is laadtijd een belangrijke factor. Google geeft aan dat gemiddeld 53% van mobiele bezoekers een website verlaat als deze langer dan 3 seconden nodig heeft om te laden. Daarom is het belangrijk dat de mobiele versie van jouw website zo snel mogelijk laadt.
Google geeft de volgende richtlijnen over de optimale mobiele websitesnelheid:
- Sneller dan 3 seconden: Hoe snel de pagina content toont aan de bezoeker
- Sneller dan 1.3 seconden: Hoe snel en responsive een mobile web server is (time to first byte).
- Minder dan 50: Het aantal individuele elementen die nodig zijn om de gehele webpagina te laden.
- Minder dan 500 KB: Het totale formaat van de gehele webpagina in bytes.
Als je deze criteria aanhoud bij het optimaliseren van jouw website voor mobiele gebruikers, zul je al snel zien dat hier verbetering in komt en dat je meer bezoekers weet vast te houden. Daarnaast hebben deze factoren invloed op de vindbaarheid van je website, iets dat ook meer bezoekers naar jouw website weet te krijgen.
Wil jij de mobiele laadsnelheid van jouw website testen? Check dan de Google Pagespeed Insights tool. Hiermee krijg je een volledig rapport van de laadtijd van jouw website voor zowel mobiel als dekstop.
Klikbare elementen
De klikbare elementen op een mobiele website hebben invloed op de gebruikerservaring. Als je een mobielvriendelijke website wilt maken zul je ervoor moeten zorgen dat er niet te veel klikbare elementen zijn en dat deze van het juiste formaat zijn.
Allereerst wil je ervoor zorgen dat de pagina’s niet vol zitten met onnodige knoppen en klikbare afbeeldingen. Dit maakt het voor gebruikers lastig om de pagina te bekijken zonder per ongeluk door te klikken naar een andere pagina. Hierdoor wordt de bezoeker vaak geërgerd en verlaat hij/zij de website. Kies er daarom voor om alleen elementen klikbaar te maken die relevant zijn voor de bezoeker. Zo hoeft bijvoorbeeld niet elke afbeelding een lightbox te openen.
Daarna wil je kijken naar de afmetingen van de klikbare elementen. Je wilt natuurlijk niet dat de bezoeker moeite heeft met het aanklikken van een knop omdat deze te klein is. Dit zorgt ook voor ergernis bij de bezoeker en heeft als gevolg dat de bezoeker de website verlaat. Zorg daarom altijd dat klikbare elementen groot genoeg zijn en dat deze niet te dicht op elkaar staan.
Met behulp van Google Search Console kan je instellen dat je een melding krijgt wanneer dit soort fouten worden opgespoord. Onder de tab ‘Mobiele bruikbaarheid’ zie je dan alle fouten die Google Search Console heeft opgespoord en op welke pagina deze van toepassing zijn. Hiermee kan je direct actie ondernemen om de fouten te verhelpen.
Navigatie
Ook op mobiel moet de bezoeker zich goed kunnen navigeren door de website. Zorg er daarom voor dat de navigatie op jouw mobiele website goed is geregeld. Wat wij vaak zien is dat de enige mogelijkheid tot navigatie in het headermenu wordt verwerkt. Vaak zie je dit als de bekende ‘hamburger’ die openvouwt als je deze aanklikt. Dit op zich is geen slechte manier om de navigatie te regelen, maar wat veel bedrijven vergeten is om dit menu ‘sticky’ te maken. Dit houdt in dat het menu mee scrolt met de bezoeker en als het ware blijft ‘plakken’ op dezelfde positie.
Als dit niet wordt gedaan krijg je bij pagina’s met veel content dat de bezoeker een heel eind terug moet scrollen om naar een andere pagina te gaan. Dit heeft vaak als gevolg dat de bezoeker de pagina verlaat zonder verder te kijken naar de andere pagina’s. Dit zorgt ervoor dat het uitstapppercentage op die pagina erg hoog wordt. Een andere oplossing hiervoor is om een back to top button in te stellen. Dit is een knop, vaak aan de onderkant van je scherm, die je direct naar de bovenkant van de website stuurt.
Conclusie
Het hebben maken een mobielvriendelijke website is erg belangrijk. Meer dan de helft van het totale verkeer wereldwijd is afkomstig van een mobiel apparaat. Je kan er daarom niet meer omheen dat jouw website aan de mobiele standaard moet voldoen. De tips die wij hebben in deze blog hebben gedeeld zullen je hierbij helpen.
Wil jij ook een website die volledig is geoptimaliseerd voor mobiele apparaten? Neem dan contact met ons op! Alle websites die wij bouwen zijn volledig responsive en geoptimaliseerd voor elk scherm.
