Mobielvriendelijke website: waarom het telt en hoe je het test

Pak je telefoon, open je eigen website en probeer binnen een halve minuut je telefoonnummer te vinden en je contactformulier in te vullen. Lukt dat soepel? Dan zit je goed. Moest je inzoomen, zat er een pop-up in de weg of raakte je steeds de verkeerde link? Dan laat je klanten liggen. In dit artikel lees je waar een goede mobiele website aan voldoet.

Waarom een mobielvriendelijke website zo belangrijk is

• Je bezoekers zitten op hun telefoon. Voor de meeste lokale bedrijven komt het grootste deel van het verkeer van mobiele apparaten. Vaak onderweg, met haast en een matige verbinding.
• Google kijkt naar je mobiele versie. Google gebruikt de mobiele weergave van je website om te bepalen waar je pagina's over gaan en hoe goed ze zijn. Ontbreekt er op mobiel inhoud, of werkt het daar slecht, dan merk je dat in je posities.
• Mobiele bezoekers haken sneller af. Een pagina die traag laadt of lastig te bedienen is, wordt binnen seconden weggeklikt, en de concurrent staat één tik verderop.

Wat is een mobielvriendelijke website?

Een mobielvriendelijke, of responsive, website is één website die zich automatisch aanpast aan het scherm: van een brede monitor tot een smalle telefoon. Kolommen schuiven onder elkaar, afbeeldingen schalen mee en het menu klapt in. Een aparte mobiele website (zoals vroeger m.jouwsite.nl) is niet meer nodig en wordt afgeraden.

7 kenmerken van een goede mobiele website

1. Leesbare tekst. Een lettergrootte van ongeveer 16 pixels voor gewone tekst, met genoeg contrast en regelafstand. Niemand zou hoeven inzoomen.
2. Knoppen die je raakt. Maak knoppen en links groot genoeg en zet ze niet te dicht op elkaar. Google adviseert ongeveer 48 bij 48 pixels voor tikdoelen.
3. Geen horizontaal scrollen. Alles past binnen de breedte van het scherm, ook tabellen en afbeeldingen.
4. Klikbare contactgegevens. Een telefoonnummer dat direct belt, een e-mailadres dat je mailapp opent en een adres dat in je kaartenapp opent.
5. Snel laden. Compacte afbeeldingen in moderne formaten, zo min mogelijk zware scripts en goede hosting. Lees meer in website sneller maken.
6. Formulieren die prettig invullen. Weinig velden, het juiste toetsenbord per veld (cijfers voor een telefoonnummer) en duidelijke foutmeldingen.
7. Geen opdringerige pop-ups. Een pop-up die bij binnenkomst het hele scherm bedekt, is op mobiel extra irritant. Google ziet zulke opdringerige pop-ups ook als slechte ervaring.

Veel van deze punten maken je site ook toegankelijker voor mensen met een beperking. Lees daarover meer in toegankelijke website en de European Accessibility Act.

Zo test je of je website mobielvriendelijk is

• Op je eigen telefoon. De belangrijkste test. Doorloop de belangrijkste route: homepage, dienst, contact. Doe het ook eens via 4G in plaats van wifi.
• Met PageSpeed Insights. Deze gratis tool van Google meet de snelheid en ervaring op mobiel, en laat zien wat er beter kan.
• In Google Search Console. Het rapport Core Web Vitals laat zien hoe je pagina's het doen bij echte mobiele bezoekers. Lees hoe je Search Console gebruikt.
• In je browser. In Chrome en andere browsers kun je via de ontwikkelaarstools de weergave van verschillende telefoons nabootsen.

Veelgemaakte fouten

• De website is op desktop ontworpen en op mobiel "even passend gemaakt".
• Belangrijke informatie, zoals prijzen of reviews, is op mobiel verborgen om ruimte te sparen.
• Een grote slider of video bovenaan die op mobiel traag laadt en weinig zegt.
• Een chatwidget, cookiebanner en nieuwsbriefpop-up die samen het halve scherm bedekken.
• Tekst in afbeeldingen, die op een klein scherm onleesbaar wordt en die Google slecht kan lezen.

Elke website die Websmaak bouwt, ontwerpen we vanuit de telefoon en testen we op echte apparaten. Benieuwd hoe jouw site het doet? Neem contact op, dan kijken we mee.