Een site die snel aanvoelt op de laptop op kantoor, kan op een telefoon met mobiele data kruipen. Meestal komt het neer op drie dingen.

De snelheid van je website op mobiel is belangrijker dan de meeste teams denken: in Indonesië komen de meeste bezoekers binnen via een telefoon, vaak via mobiel internet, en velen haken af als een pagina te lang niets nuttigs laat zien. Het goede nieuws: de oorzaken zijn meestal dezelfde, en de oplossingen ook.

Te grote afbeeldingen

Een foto rechtstreeks uit een camera kan meerdere megabytes zijn. Verkleind tot de breedte waarop hij getoond wordt en opgeslagen als WebP is hij vaak een fractie daarvan, zonder zichtbaar verschil.

Twee andere gewoontes helpen ook. Laad afbeeldingen onder de vouw pas als de bezoeker in de buurt scrolt (lazy loading), en geef elke afbeelding in de code een breedte en hoogte, zodat de pagina niet verspringt als de beelden binnenkomen.

Te veel lettertypen

Elk gewicht en elke stijl is een aparte download. Twee families met elk een paar gewichten is meestal genoeg voor een heel merk.

Laad lettertypes zo dat tekst meteen verschijnt in een reservelettertype en wisselt zodra het merklettertype binnen is, in plaats van onzichtbaar te blijven. De gids van web.dev over best practices voor lettertypes gaat in op de details, en onze notitie over lettertypes kiezen voor twee talen over hoe je er minder en betere kiest.

Scripts van andere diensten

Chatwidgets, trackers en embeds laden elk hun eigen code. Houd de tools die je echt gebruikt, laad ze na de pagina en verwijder de rest.

Een typische boosdoener is een site die in de loop der jaren trackingcodes, een chatwidget, een pop-uptool en een social feed heeft verzameld. Elk leek klein toen het werd toegevoegd. Samen kunnen ze langer laden dan de pagina zelf.

Test op een echte telefoon, met mobiele data, niet alleen op de kantoorwifi.

Zo meet je de snelheid van je website op mobiel

Begin met Googles gratis PageSpeed Insights. Vul een adres in en kijk naar het tabblad voor mobiel. Heeft je site genoeg bezoekers, dan toont het bovenste deel echte gegevens van Chrome-gebruikers; daaronder staat een labtest met een lijst van wat je kunt verbeteren.

De cijfers uit de praktijk zijn Googles Core Web Vitals:

Largest Contentful Paint: hoe lang het duurt tot de hoofdinhoud verschijnt. Mik op 2,5 seconden of minder.
Interaction to Next Paint: hoe snel de pagina op een tik reageert. Mik op 200 milliseconden of minder.
Cumulative Layout Shift: hoeveel de pagina verspringt tijdens het laden. Mik op 0,1 of minder.

Jaag niet op een perfecte labscore. Een pagina die voor echte bezoekers snel aanvoelt en voor deze drie slaagt, doet wat hij moet doen.

Hosting en caching

Zelfs een lichte pagina is traag op een trage server. Goede hosting dicht bij je bezoekers, met paginacaching en een contentdeliverynetwerk voor afbeeldingen en bestanden, verkort het wachten voordat er iets gebeurt. Voor een WordPress-site is een goed ingestelde caching-plug-in vaak de grootste verbetering.

Een snel plan voor een trage site

Haal de homepage en je meest bezochte pagina’s door PageSpeed Insights, op mobiel.
Verklein en converteer de grootste afbeeldingen. Dat alleen lost vaak de slechtste pagina’s al op.
Zet alle scripts van derden op een rij, en verwijder de scripts die niemand gebruikt.
Beperk de lettertypes tot de diktes die je echt nodig hebt.
Controleer hosting en caching, en test daarna opnieuw op een echte telefoon.

Vragen die mensen stellen

Beïnvloedt de snelheid van je website op mobiel je positie in Google?

Ja, als onderdeel van de pagina-ervaring, al telt nuttige content zwaarder. Snelheid telt vooral voor bezoekers: een trage pagina verliest mensen voordat ze één woord lezen. Onze notitie over SEO-fundamenten voor een nieuwe site plaatst het in context.

Waarom is mijn site snel op desktop maar traag op een telefoon?

Telefoons hebben langzamere processors en vaak langzamere verbindingen. Een pagina die veel code of grote afbeeldingen laadt, voelt prima op een laptop op kantoorwifi, en traag op een middenklassetelefoon met mobiele data.

Lost een nieuw thema het op?

Soms, maar niet als het nieuwe thema net zo zwaar is. Een slank, op maat gemaakt thema met alleen de functies die de site gebruikt, is meestal sneller dan een multifunctioneel thema met alles aan.

Een site snel houden hoort bij doorlopend onderhoud, via updates, controles van afbeeldingen en het opruimen van oude scripts. Dat valt onder ons website-onderhoud, en onze dienst voor webontwikkeling bouwt sites vanaf het begin met snelheid op mobiel in gedachten.