Home › Kennisbank › SEO
Hoe controleer ik of mijn website mobielvriendelijk is?
Direct antwoord
Open je website op je telefoon en controleer of de tekst leesbaar is zonder in te zoomen, of knoppen goed aan te tikken zijn en of niets buiten het scherm valt. Test daarna met Google PageSpeed Insights op het tabblad Mobiel en bekijk verschillende schermformaten in Chrome op je computer. De Mobile-Friendly Test van Google bestaat niet meer.
Wat heb je nodig?
- Het adres van je website
- Een telefoon, en liefst ook een tablet
- Een computer met de browser Google Chrome
- Toegang tot Google Search Console van je website (niet verplicht, wel handig)
Stappenplan10 stappen
- 1Open je website op je telefoon
- 2Controleer of de tekst leesbaar is
- 3Controleer knoppen en links
- 4Controleer of niets buiten het scherm valt
- 5Controleer menu, formulieren en pop-ups
- 6Bekijk je website in Chrome op verschillende schermformaten
- 7Test met PageSpeed Insights
- 8Bekijk de Core Web Vitals in Google Search Console
- 9Controleer of je thema responsive is
- 10Los de gevonden problemen op
Wat betekent mobielvriendelijk?
Een mobielvriendelijke website past zich aan het scherm aan waarop hij wordt bekeken. Dat heet responsive design. Tekst is leesbaar zonder inzoomen, knoppen en links zijn groot genoeg om met een duim aan te tikken, en je hoeft niet zijwaarts te scrollen.
Bijna alle moderne WordPress-thema’s zijn responsive. Toch gaat het vaak mis bij losse onderdelen: een te brede tabel, een afbeelding met een vaste breedte, een pop-up die het hele scherm bedekt of tekst die op een telefoon te klein wordt.
Stappenplan 10 stappen
Stap 1: Open je website op je telefoon
Typ het adres van je website in de browser van je telefoon en loop de belangrijkste pagina’s door: de homepage, een dienst- of productpagina, een blogbericht en de contactpagina. Bekijk ze zoals een bezoeker dat doet, met één hand en zonder in te zoomen.
Stap 2: Controleer of de tekst leesbaar is
Lees een alinea zonder in te zoomen. Tekst hoort minimaal ongeveer 16 pixels groot te zijn en voldoende contrast met de achtergrond te hebben. Moet je knijpen om te lezen, dan is het lettertype te klein of de regel te lang.
Stap 3: Controleer knoppen en links
Tik met je duim op knoppen, menu-items en links in de tekst. Elke knop hoort in één keer raak te zijn, zonder dat je per ongeluk de knop ernaast raakt. Google adviseert aantikbare elementen van minimaal 48 bij 48 pixels met ruimte ertussen.
Stap 4: Controleer of niets buiten het scherm valt
Veeg op elke pagina van links naar rechts. Kun je zijwaarts scrollen, dan is een onderdeel breder dan het scherm: meestal een tabel, een afbeelding met een vaste breedte, een video of een formulier. Noteer op welke pagina en bij welk onderdeel dat gebeurt.
Stap 5: Controleer menu, formulieren en pop-ups
Open het menu (meestal drie streepjes rechtsboven) en kijk of alle onderdelen bereikbaar zijn. Vul een formulier in en controleer of de velden en de verzendknop goed werken. Verschijnt er een pop-up, dan hoort die klein te zijn en een duidelijke sluitknop te hebben. Een pop-up die op mobiel het hele scherm bedekt, kan Google lager plaatsen.
Stap 6: Bekijk je website in Chrome op verschillende schermformaten
Open je website in Google Chrome op je computer. Klik met de rechtermuisknop op de pagina en kies Inspecteren. Klik in het paneel dat opent op het pictogram van een telefoon en tablet, of druk op Ctrl+Shift+M (op een Mac Cmd+Shift+M). Kies bovenaan een toestel uit de lijst, bijvoorbeeld een iPhone of een Samsung, en bekijk de pagina. Wissel van toestel om verschillende schermbreedtes te testen.
Stap 7: Test met PageSpeed Insights
Ga naar pagespeed.web.dev, vul het adres van een pagina in en klik op Analyseren. Het rapport opent op het tabblad Mobiel. Bekijk de scores en de Core Web Vitals: LCP (laden, goed tot 2,5 seconde), INP (reactie op tikken, goed tot 200 milliseconde) en CLS (verspringen van de pagina, goed tot 0,1).
Scrol naar de lijst met verbeterpunten. Daar staan ook meldingen over toegankelijkheid en over de weergave op mobiel, zoals te kleine aantikbare elementen. Lees hoe je Google PageSpeed Insights gebruikt.
Stap 8: Bekijk de Core Web Vitals in Google Search Console
Heb je je website gekoppeld aan Google Search Console, open dan het rapport Core Web Vitals en klik bij Mobiel op Rapport openen. Je ziet welke pagina’s op echte telefoons van bezoekers slecht, matig of goed presteren.
Stap 9: Controleer of je thema responsive is
Ga in het WordPress-dashboard naar Weergave > Thema’s en kijk welk thema actief is. Zoek de naam op bij de maker van het thema of op wordpress.org en controleer of het thema als responsive wordt omschreven. Maak je browservenster op je computer smaller: bij een responsive thema schuift de inhoud mee in plaats van dat er een zijwaartse scrolbalk verschijnt.
Stap 10: Los de gevonden problemen op
Werk je lijst af: vergroot te kleine lettertypen, maak knoppen groter, laat brede tabellen en afbeeldingen meeschalen en beperk pop-ups. Lees hoe je je WordPress-website geschikt maakt voor mobiel voor de stappen in WordPress. Test daarna opnieuw op je telefoon.
Controleer of het gelukt is
Je website is mobielvriendelijk als je op je telefoon elke pagina kunt lezen zonder in te zoomen, elke knop in één keer raak tikt en nergens zijwaarts hoeft te scrollen. In PageSpeed Insights staan de Core Web Vitals op het tabblad Mobiel op groen en zijn er geen meldingen over de weergave op mobiel.
In Google Search Console staan je pagina’s in het rapport Core Web Vitals bij Mobiel als goed.
Waarom geeft Google voorrang aan mobielvriendelijke websites?
Google bekijkt en beoordeelt websites met de mobiele versie van zijn zoekrobot. Dat heet mobile-first indexing. Wat op je telefoon niet werkt of ontbreekt, telt voor Google niet mee. Een website die op mobiel slecht werkt, komt daardoor lager in de zoekresultaten.
Daar komt bij dat het grootste deel van de bezoekers een telefoon gebruikt. Bezoekers die moeten inzoomen of misklikken, vertrekken snel.
Bestaat de Mobile-Friendly Test van Google nog?
Nee. Google heeft de losse Mobile-Friendly Test en het rapport Mobiele bruikbaarheid in Google Search Console eind 2023 stopgezet. Extensies in de Chrome Web Store met dezelfde naam zijn niet van Google.
Gebruik in plaats daarvan PageSpeed Insights of Lighthouse in Chrome voor de techniek, en je eigen telefoon voor de ervaring.
Werkt het niet?
De pagina is op mobiel breder dan het scherm
Zoek het onderdeel dat de breedte veroorzaakt: vaak een tabel, een ingesloten video, een afbeelding met een vaste breedte in pixels of een kolom met een vaste breedte in een paginabouwer. Geef het een breedte in procenten of van maximaal 100 procent, of zet een tabel in een vak dat zelf kan scrollen.
De tekst is op mobiel te klein
Vergroot de basislettergrootte van je thema tot minimaal 16 pixels. Bij een klassiek thema doe je dat onder Weergave > Customizer, bij een blokthema onder Weergave > Editor bij Stijlen en Typografie, en bij Elementor in de site-instellingen of in het tekstelement bij de instellingen voor mobiel.
Het menu werkt niet op mobiel
Controleer of het menu een mobiele variant heeft (het pictogram met drie streepjes). Bij een klassiek thema stel je dat in via Weergave > Menu’s en Locaties beheren, bij een paginabouwer in de instellingen van de header. Werkt het menu wel op de computer en niet op de telefoon, dan blokkeert vaak een plugin of de cache het script. Leeg de cache en test opnieuw.
PageSpeed Insights geeft op mobiel een veel lagere score dan op desktop
Dat is normaal, omdat de test een langzamere telefoon en een tragere verbinding nabootst. Verklein je afbeeldingen, gebruik caching en beperk het aantal plugins. Lees hoe je je WordPress-website sneller maakt.
Je vindt de Mobile-Friendly Test van Google niet meer
Die tool bestaat niet meer. Gebruik PageSpeed Insights of Lighthouse in Chrome (in het paneel Inspecteren onder het tabblad Lighthouse), en test op je eigen telefoon.
Veelgestelde vragen
Hoe test ik zonder eigen iPhone of Android-toestel?
Gebruik de toestellijst in Chrome via Inspecteren. Die bootst de schermformaten van veel toestellen na. Voor de echte ervaring blijft een echte telefoon beter; vraag een collega of klant om mee te kijken.
Heb ik een aparte mobiele website nodig?
Nee. Een responsive website die zich aanpast aan elk scherm is de standaard en heeft de voorkeur van Google. Een aparte mobiele versie betekent dubbel onderhoud.
Hoe vaak moet ik dit controleren?
Na elke grotere wijziging aan je website, zoals een nieuw thema, een nieuwe pagina met tabellen of formulieren, of een update van je paginabouwer. Loop daarnaast ongeveer elk kwartaal je belangrijkste pagina’s op je telefoon door.
Telt de desktopversie dan niet meer mee voor Google?
Google gebruikt vooral de mobiele versie om je pagina’s te beoordelen. Zorg dat alle inhoud en links die op de computer te zien zijn, ook op mobiel beschikbaar zijn. Verberg op mobiel geen tekst die je wel in Google wilt laten meetellen.
Wat is het verschil tussen mobielvriendelijk en snel?
Mobielvriendelijk gaat over de weergave en bediening op een klein scherm. Snelheid gaat over de laadtijd. Google kijkt naar beide, en in PageSpeed Insights zie je ze allebei terug op het tabblad Mobiel.
Hulp nodig?
Schakel de helpdesk van ViVortis in als:
- je website op mobiel breder is dan het scherm en je het onderdeel niet kunt vinden
- het menu of een formulier op je telefoon niet werkt
- je thema niet responsive is en je het wilt laten vervangen
- de Core Web Vitals in Google Search Console op mobiel slecht blijven
Dien een ticket in via de helpdesk van ViVortis en voeg waar mogelijk een screenshot toe.
Lukt het niet?
Dien een ticket in met een screenshot van wat je ziet. De helpdesk reageert meestal binnen één werkdag.
Verder lezen
- Hoe zorg ik ervoor dat mijn WordPress-website goed werkt op mobiele apparaten?
- Wat is Google PageSpeed Insights en hoe gebruik ik het?
- Hoe maak ik mijn WordPress-website sneller?
- Wat is technische SEO en waarom is het belangrijk?
Meer van ViVortis