Website snelheid testen met PageSpeed Insights: zo lees je het rapport

Wil je weten waarom je website traag aanvoelt? Test dan een concrete pagina, lees welke meting een probleem laat zien en onderzoek daarna de oorzaak. PageSpeed Insights kan daarbij helpen, maar het grote cijfer boven een rapport vertelt niet het volledige verhaal.

Deze gids geeft je een werkwijze om je websitesnelheid te beoordelen en een gerichte opdracht voor Claude Code te formuleren. Je hoeft niet ieder technisch detail te begrijpen voordat je begint. Wel is het belangrijk dat je weet welke pagina, versie en soort meting je bekijkt.

1. Kies een echte pagina en leg de beginsituatie vast

Begin met een publieke URL die belangrijk is voor je bezoekers. Dat kan de homepage zijn, maar ook een dienstenpagina, artikel of productpagina. Pagina’s met verschillende soorten inhoud kunnen andere problemen hebben; één homepagecontrole vertegenwoordigt dus niet automatisch de hele website.

Open de pagina eerst zelf. Noteer wat je waarneemt: verschijnt de hoofdinhoud laat, schuift de tekst tijdens het laden of reageert een menu traag? Een concrete waarneming helpt om het rapport later te koppelen aan de ervaring van een bezoeker.

Leg bij je eerste meting vast:

• de volledige URL en datum;
• de versie van de website die je onderzoekt;
• de gekozen mobiele of desktopweergave in het rapport;
• het probleem dat je zelf ervaart;
• het rapport of een bewaarde kopie van de relevante bevindingen.

Gebruik bij een publieke meetdienst alleen een URL die daarvoor geschikt is. Voor een lokale of afgeschermde werkversie heb je een andere manier van meten nodig. Onze gids over lokaal, staging en productie helpt je bepalen welke versie je bekijkt.

2. Start PageSpeed Insights en bekijk mobiel en desktop apart

Open PageSpeed Insights, vul de publieke URL in en laat de analyse uitvoeren. Bekijk vervolgens welke resultaten bij mobiel horen en welke bij desktop. Noteer beide wanneer beide voor je bezoekers relevant zijn.

PageSpeed Insights combineert een gesimuleerde Lighthouse-meting met gegevens over echte gebruikers wanneer die beschikbaar zijn. Die twee soorten informatie hebben een ander doel en kunnen verschillende resultaten tonen. (Google: over PageSpeed Insights)

Gebruik de eerste analyse om te bepalen waar je verder moet kijken. Klik niet meteen alle aanbevelingen door met de opdracht “los alles op”. Kies een bevinding die je begrijpt, lees welk onderdeel van de pagina erbij hoort en bepaal welke vraag je daarmee wilt onderzoeken.

Een lage mobiele score betekent bijvoorbeeld niet vanzelf dat je alle afbeeldingen moet verwijderen. Je wilt eerst weten welk bestand, script of laadgedrag de vertraging veroorzaakt. Het rapport geeft aanknopingspunten voor onderzoek; het vervangt die diagnose niet.

3. Houd labdata en echte gebruikersdata uit elkaar

Labdata komt uit een test onder bepaalde gesimuleerde omstandigheden. Dat helpt om problemen te onderzoeken en wijzigingen met een vergelijkbare meting te beoordelen. De test is geen weergave van alle mogelijke apparaten, verbindingen en bezoekershandelingen.

Echte gebruikersdata laat zien hoe de pagina of site bij echte gebruikers presteerde. In PageSpeed Insights is die afkomstig uit het Chrome User Experience Report, met een terugkijkperiode van 28 dagen. Bij onvoldoende gegevens kan het rapport informatie voor de hele origin tonen of helemaal geen gebruikersdata weergeven. Lees daarom of je naar de specifieke pagina of een ruimer niveau kijkt. (Google: gebruikersdata in PageSpeed Insights)

Ontbrekende gebruikersdata is geen bewijs dat je pagina snel of traag is. Gebruik de beschikbare labdiagnose en je eigen controles om verbeteringen te onderzoeken. Verwacht ook niet dat historische gebruikersdata direct volledig verandert na een nieuwe publicatie.

Sla in je notities beide resultaten apart op. Zo voorkom je dat je een labscore van vandaag vergelijkt met een beoordeling die over een eerdere gebruikersperiode gaat.

4. Begrijp welke ervaring LCP, INP en CLS beschrijven

Core Web Vitals omvatten drie verschillende aspecten van de gebruikerservaring:

• LCP, Largest Contentful Paint: een maat voor het laden van de grootste zichtbare afbeelding of het grootste tekstblok binnen het scherm.
• INP, Interaction to Next Paint: een maat voor hoe snel de pagina visueel reageert op gebruikersinteracties.
• CLS, Cumulative Layout Shift: een maat voor onverwachte verschuivingen van de layout.

Deze metingen beschrijven laden, reageren en visuele stabiliteit. Ze zijn geen drie namen voor dezelfde laadtijd. (web.dev: Web Vitals)

Gebruik ze om gerichter naar de pagina te kijken. Bij een probleem met zichtbare verschuivingen onderzoek je bijvoorbeeld welke inhoud achteraf ruimte inneemt. Bij een trage reactie kijk je naar wat er gebeurt wanneer iemand een bediening gebruikt. Een vertraagd groot beeld bovenaan de pagina vraagt weer een ander onderzoek.

Een labtest die vooral het laden onderzoekt, vertelt niet automatisch hoe iedere interactie tijdens een volledig bezoek verloopt. Controleer daarom ook de belangrijke handelingen op de website. Voor mobiele weergave en bediening kun je de mobiele websitechecklist gebruiken.

5. Kies één onderbouwde verbetering

Maak van een rapportbevinding eerst een onderzoeksvraag. Bijvoorbeeld: “Het rapport wijst op de hoofdafbeelding. Welk bestand wordt geladen, hoe groot is de weergegeven afbeelding en wanneer wordt die opgevraagd?” Dat is concreter dan “maak de hele site sneller”.

Dit zijn mogelijke onderzoekslijnen, geen vastgestelde oorzaken voor jouw site:

• een groot beeld dat niet past bij de benodigde weergavegrootte;
• een ingesloten externe dienst die veel werk toevoegt;
• inhoud die pas laat wordt geladen of zichtbaar gemaakt;
• een afbeelding of ander onderdeel waarvoor vooraf geen ruimte beschikbaar is;
• veel werk in de browser tijdens een belangrijke interactie.

Laat de relevante code en het netwerkgedrag onderzoeken voordat je functies laat verwijderen. Behoud wat nodig is voor de bezoekersroute en beoordeel de gevolgen van een wijziging. Voor beeldbestanden helpt de gids over afbeeldingen voorbereiden voor je website.

Onderstaande eigen briefing kun je aanpassen voor Claude Code:

Onderzoek het snelheidsprobleem op [URL of route].
Lees eerst de projectafspraken.

Mijn waarneming:
[wat de bezoeker ziet of ervaart]

Meting:
[datum, mobiele of desktopmeting, rapport en relevante bevinding]
Soort gegevens:
[labdata of gebruikersdata; pagina of origin]

Onderzoek eerst de oorzaak en de betrokken bestanden.
Stel een gerichte verbetering voor met een controleerbare uitkomst.
Behoud de bestaande inhoud en noodzakelijke functies.

Voer na de afgesproken aanpassing een vergelijkbare meting uit.
Controleer ook de betrokken bezoekersroute in de browser.
Rapporteer het meetresultaat en de grenzen van de controle.
Verzin geen prestatieverbetering of garanties.

6. Meet opnieuw en controleer de werking

Gebruik na een aanpassing dezelfde pagina en hetzelfde type test. Bewaar de beginsituatie en de nieuwe uitkomst naast elkaar. Een Lighthouse-score kan tussen runs variëren, ook zonder een codewijziging. Trek daarom geen grote conclusie uit één klein verschil. (Google over variatie in PageSpeed-resultaten)

Herhaal een meting wanneer een opvallende uitslag of onvergelijkbare omstandigheden daar reden toe geven. Noteer ook als de oorzaak nog niet duidelijk is. Een rapport met onzekerheid is bruikbaarder dan een precieze verbetering die je niet kunt onderbouwen.

Controleer tot slot de echte pagina:

• ☐ De gemeten versie bevat daadwerkelijk de bedoelde wijziging.
• ☐ Ik vergelijk dezelfde URL en hetzelfde type meting.
• ☐ De bevinding die ik onderzocht is opnieuw beoordeeld.
• ☐ Tekst en afbeeldingen blijven bruikbaar.
• ☐ Menu’s, links en relevante bedieningen werken nog.
• ☐ De controle is ook op een smal scherm uitgevoerd.
• ☐ Labresultaten en historische gebruikersdata staan apart in mijn notities.

Een snelheidsonderzoek is afgerond wanneer je weet wat je hebt aangepast, wat je hebt gemeten en welke vragen nog openstaan. Combineer dat met de SEO-basiscontrole voor de bredere kwaliteit van je pagina. Wil je de verbetering onderdeel maken van een duidelijke bouwopdracht, gebruik dan de gratis briefing voor Claude Code.