Het is een gesprek dat wij vaak voeren. Een ondernemer opent zijn site op de laptop, die staat er binnen een seconde. Vervolgens laat hij een snelheidstest zien met een score van 34 voor mobiel en vraagt of dat wel klopt. Het klopt bijna altijd. En het is geen detail, want voor de meeste Nederlandse bedrijfssites komt inmiddels meer dan de helft van het verkeer van een telefoon.

Als uw website traag op mobiel is terwijl hij op desktop prima aanvoelt, dan is dat geen toeval en geen fout in de meting. Een telefoon werkt op vier manieren anders dan uw laptop. In dit artikel leest u welke dat zijn, wat u eraan kunt doen en welke adviezen u gerust mag negeren.

Oorzaak 1: de processor is trager

Dit is de grootste en de minst bekende. Uw laptop heeft een processor die ontworpen is voor prestaties en gekoeld wordt. Een telefoon moet zuinig zijn en mag niet warm worden. Een middenklassetoestel van drie jaar oud, waar veel Nederlanders nog prima mee uit de voeten kunnen, verwerkt JavaScript makkelijk vier tot zes keer langzamer dan een moderne laptop.

JavaScript is niet alleen downloaden. De browser moet het uitpakken, vertalen en uitvoeren, en dat gebeurt op één rekenkern. Zolang dat bezig is, reageert de pagina nergens op. Tikt de bezoeker op een knop, dan gebeurt er niets, en dat voelt als een kapotte site.

Dit verklaart waarom de snelste maatregel bijna altijd is: minder JavaScript. Niet kleiner, minder. Een chatvenster, een cookiebanner met beoordelingsmodule, drie trackingscripts en een animatiebibliotheek zijn samen zomaar zeshonderd kilobyte code die uitgevoerd moet worden voordat er iets bruikbaars op het scherm staat.

Oorzaak 2: het netwerk is onvoorspelbaar

Uw kantoor heeft glasvezel. Uw klant staat op een perron, zit in een auto of loopt door een winkelstraat met een overbelaste mast. Zelfs met 4G of 5G op de balk is de reactietijd op mobiel hoger: elk verzoek doet er langer over voordat het antwoord begint te komen.

Dat betekent dat het aantal losse verzoeken zwaarder telt dan op desktop. Een pagina met honderdveertig bestanden verspreid over acht verschillende domeinen, elk met een eigen naamopzoeking en beveiligingsonderhandeling, is op wifi nauwelijks merkbaar en op mobiel pijnlijk.

Wat helpt: externe bronnen terugbrengen. Haal lettertypen van uw eigen server, laad geen twee verschillende pictogramverzamelingen en vraag u bij elk trackingscript af of het nog gebruikt wordt. Bij veel sites staan er nog scripts van campagnes uit 2022 in.

Oorzaak 3: het scherm is smal en hoog

Op desktop past uw hele bovenste sectie in beeld. Op een telefoon staan diezelfde elementen onder elkaar en beslaat het eerste beeld het volledige scherm. Dat betekent dat de grote sfeerfoto op mobiel juist zwaarder weegt voor het moment waarop de pagina zichtbaar klaar is.

Tegelijk is die foto vaak veel te groot. Veel sites serveren dezelfde afbeelding van 1920 pixels breed aan een telefoon met een schermbreedte van 390 pixels. WordPress kan dat oplossen met responsieve afbeeldingen, waarbij de browser zelf het passende formaat kiest, maar dat werkt alleen als de afbeelding via de mediabibliotheek is ingevoegd. Achtergrondafbeeldingen die via CSS of een paginabouwer geladen worden, vallen buiten dat mechanisme en worden op mobiel vaak onnodig zwaar geladen.

Een tweede punt dat op mobiel harder aankomt: verspringende elementen. Op een smal scherm duwt een banner of een laat ingeladen afbeelding de hele pagina naar beneden. De bezoeker tikt op de verkeerde plek. Wij schreven daar apart over in ons artikel over verspringende elementen op uw pagina.

Oorzaak 4: de meting is streng

Dit is geen echte oorzaak, maar wel goed om te weten. De mobiele test van PageSpeed Insights simuleert een middenklassetoestel op een matige 4G-verbinding. Dat is bewust gekozen: het benadert wat een groot deel van de bezoekers werkelijk ervaart, niet wat u op uw eigen nieuwe toestel ziet.

Uw eigen telefoon geeft dus een te rooskleurig beeld, zeker als u de site al eerder hebt bezocht en alles nog in de browsercache staat. Test in een privévenster, op een toestel dat niet nieuw is, en kijk vooral naar de velddata: dat zijn de cijfers van echte bezoekers over de afgelopen 28 dagen. Het verschil tussen een gesimuleerde meting en werkelijke bezoekersgegevens leggen wij uit in ons stuk over labdata en velddata.

Wat u concreet aanpakt, op volgorde

  1. Tel uw scripts. Open de ontwikkelaarstools, tabblad Netwerk, filter op JS. Alles wat u niet kunt uitleggen, kan waarschijnlijk weg.
  2. Pak de bovenste afbeelding aan. Zorg dat hij niet lui laadt, dat hij in WebP wordt aangeboden en dat er een mobiele variant is die niet breder is dan nodig.
  3. Geef alle afbeeldingen vaste afmetingen. Dat voorkomt het verschuiven van de pagina tijdens het laden.
  4. Stel niet-noodzakelijke scripts uit. Chatvensters, beoordelingsmodules en trackingcode hoeven niet klaar te staan voordat de bezoeker iets ziet.
  5. Kijk naar uw cookiebanner. Sommige oplossingen blokkeren de hele pagina tot ze geladen zijn. Dat is op mobiel goed voor een halve seconde verlies.
  6. Verwijder wat mobiel toch verborgen is. Veel thema’s verbergen elementen op mobiel met CSS, maar laden ze wel. Verbergen is geen besparen.

Een praktijkvoorbeeld

Een fysiotherapiepraktijk uit Alkmaar kreeg naar eigen zeggen weinig afspraken via de site, terwijl er wel bezoek was. In de statistieken viel op dat mobiele bezoekers gemiddeld veertien seconden bleven en desktopbezoekers ruim twee minuten.

De site laadde op mobiel in ruim acht seconden. De boosdoeners: een sfeervideo van elf megabyte die op mobiel verborgen werd maar wel geladen, een chatvenster dat direct startte, en een sfeerfoto van 2400 pixels breed. De video is op mobiel echt uitgezet in plaats van verborgen, het chatvenster start pas na drie seconden of bij een tik op de knop, en de foto krijgt een mobiele variant. De laadtijd ging naar ongeveer 2,9 seconden en de gemiddelde bezoekduur op mobiel meer dan verdubbelde.

Wanneer u hulp inschakelt

Afbeeldingen, verborgen video’s en overbodige scripts kunt u met een beetje doorzettingsvermogen zelf aanpakken. Het wordt technischer zodra u scripts gaat uitstellen: dan raakt u aan de volgorde waarin dingen laden, en kan een formulier of menu stilvallen zonder dat u het meteen ziet.

Blijft uw score op mobiel steken terwijl u alles hebt geprobeerd, dan zit het probleem vaak dieper: in het thema, in de paginabouwer of in de server. Dat is het moment om een snelheidsonderzoek te laten doen waarbij op een oefenomgeving wordt gemeten wat er per element gebeurt.

Tot slot

Het verschil tussen desktop en mobiel is geen meetfout, maar een weerspiegeling van hoe uw bezoekers uw site werkelijk beleven. Begin met de eenvoudigste controle die er is: pak uw telefoon, zet wifi uit en open uw eigen site in een privévenster. Wat u daar ziet, is wat uw klant ziet.