Gratis tool: Snelheid

Website snelheidstest

We laden je pagina als een middenklasse telefoon op een trage 4G-verbinding, meten hoe snel de hoofdinhoud verschijnt en hoeveel de pagina verspringt, en laten zien waardoor ze zwaar is. Als Google echte gebruikersdata voor je site heeft, zie je die ook.

Gratis. Meestal klaar in minder dan een minuut.

Wat deze tool controleert

  • Een telefoon op traag 4G

    De pagina laadt in Chromium als een telefoon in de klasse van de Moto G Power (412 × 823) met 150 ms latentie, ongeveer 1,6 Mbps download en 750 Kbps upload, en een 4× tragere CPU. Dit is het profiel dat Lighthouse voor mobiele tests gebruikt.

  • Largest Contentful Paint

    Wanneer de grootste afbeelding of het grootste tekstblok in het eerste scherm klaar was met renderen, en welk element dat was.

  • Cumulative Layout Shift

    Hoeveel zichtbare content onverwacht verschoof terwijl de pagina laadde.

  • Total Blocking Time

    Hoe lang scripts de browser te druk hielden om op een tik te reageren: het deel van elke lange taak boven 50 ms, bij elkaar opgeteld. Het is de labvervanger voor Interaction to Next Paint.

  • Wat de pagina downloadt

    Totaal aantal bytes en verzoeken, verdeeld over afbeeldingen, scripts, CSS en lettertypen, en het aandeel dat van derden komt.

  • Zware afbeeldingen en renderblokkerende bestanden

    Afbeeldingen van meer dan 150 KB of veel breder dan de ruimte waarin ze worden getoond, en de CSS- en scriptbestanden die de eerste weergave ophouden.

  • Echte gebruikersdata uit Chrome

    Het Chrome UX Report van Google voor je origin op telefoons, op het 75e percentiel: LCP, INP en CLS, als Google genoeg verkeer voor de site heeft.

Wat de tool niet kan controleren

  • Bij elke test dezelfde cijfers geven. Labresultaten variëren met het netwerk, de serverbelasting en scripts van derden, dus vergelijk trends in plaats van losse metingen.
  • Precies overeenkomen met PageSpeed Insights. Beide gebruiken een vergelijkbaar telefoonprofiel, maar draaien op andere machines en netwerken.
  • INP in het lab meten. INP vraagt om echte interacties, dus de labtest toont TBT en de echte gebruikersdata tonen INP als die er zijn.
  • Echte gebruikersdata tonen voor elke site. Het Chrome UX Report beslaat de afgelopen 28 dagen en alleen origins met genoeg Chrome-verkeer.
  • Meer testen dan de ene pagina die je invoert. Het betaalde Snelheidsrapport test 3 belangrijke pagina’s en rangschikt de oorzaken, met oplossingen.

Waarom het belangrijk is

Een pagina die op kantoorwifi en een snelle laptop direct aanvoelt, kan op een middenklasse telefoon met een zwak signaal enkele seconden duren. Dat is de situatie die deze test nabootst, omdat zware afbeeldingen en scripts daar de meeste schade doen.

Core Web Vitals zijn de maatstaven van Google voor die ervaring: laden (LCP), reactievermogen (INP) en visuele stabiliteit (CLS). Google gebruikt ze bij de ranking, maar zegt dat een goede pagina-ervaring niet zwaarder weegt dan relevante content. Het grootste effect hebben ze op mensen: een trage of verspringende pagina verliest bezoekers voordat die iets hebben gelezen.

De oorzaken zijn meestal concreet: een ongecomprimeerde hero-afbeelding van enkele megabytes, een chatwidget die vóór de content laadt, een webfont dat tekst verbergt, of een banner die boven de pagina wordt ingevoegd nadat die is verschenen. De test noemt het LCP-element en de zwaarste bestanden, zodat je ziet welke hiervan van toepassing is.

Zo lees je de resultaten

Largest Contentful Paint (LCP)
Goed onder 2,5 s, slecht boven 4 s. Als het LCP-element een afbeelding is, tellen vooral de grootte en de laadprioriteit; is het tekst, kijk dan naar webfonts en renderblokkerende CSS.
Cumulative Layout Shift (CLS)
Goed onder 0,1, slecht boven 0,25. Een score zonder eenheid die combineert hoeveel van het scherm verschoof en hoe ver.
Total Blocking Time (TBT)
Goed onder 200 ms, slecht boven 600 ms. Een hoge TBT voorspelt dat echte gebruikers trage reacties op hun tikken krijgen.
Bytes en verzoeken
Er is geen officiële limiet; kijk welk type de overhand heeft. Afbeeldingen vormen meestal het grootste deel, en een hoog aandeel van derden wijst op apps, tags en widgets.
Zware afbeeldingen
Elke afbeelding van meer dan 150 KB, of die veel breder wordt gedownload dan ze wordt getoond, met bestandsgrootte en afmetingen.
Renderblokkerende bestanden
CSS en synchrone scripts die de browser moet downloaden voordat hij iets kan tonen.
Echte gebruikersdata (75e percentiel)
Echte Chrome-gebruikers op telefoons in de afgelopen 28 dagen. Het 75e percentiel betekent dat drie op de vier paginaweergaven minstens zo snel waren. INP is goed onder 200 ms en slecht boven 500 ms.
Geen echte gebruikersdata
Google heeft niet genoeg Chrome-verkeer voor je origin. Dat zegt niets over je snelheid; vertrouw op de labresultaten.

Zo los je de meest voorkomende problemen op

  • Een trage LCP-afbeelding

    Lever de hero-afbeelding op het formaat waarop ze wordt getoond, met srcset, in WebP of AVIF. Gebruik geen lazy loading voor deze afbeelding, voeg fetchpriority="high" toe en zet haar als img-element in de HTML in plaats van haar via een script of een CSS-achtergrond te laden.

  • Content die verspringt tijdens het laden

    Geef afbeeldingen, video’s en embeds width- en height-attributen of een CSS aspect-ratio. Reserveer ruimte voor banners, cookiemeldingen en advertenties, of toon ze als overlay die de content niet omlaag duwt. Gebruik voor webfonts font-display: optional of een fallbacklettertype met passende afmetingen.

  • Hoge Total Blocking Time

    Verwijder eerst apps, tags en plug-ins die je niet meer gebruikt; hun scripts blijven vaak staan nadat je ermee bent gestopt. Laad chat, reviews en analytics met defer of nadat de pagina interactief is. Controleer in Shopify Webwinkel › Thema’s › Aanpassen › App-embeds.

  • Renderblokkerende CSS en scripts

    Voeg defer toe aan scripts die niet vóór de eerste weergave hoeven te draaien, zet de kleine hoeveelheid CSS die het eerste scherm nodig heeft inline, en schrap stylesheets voor functies die de pagina niet gebruikt.

  • Afbeeldingen die te zwaar zijn

    Verklein afbeeldingen voordat je ze uploadt (ongeveer 2000 px breed is ruim voldoende voor een banner over de volle breedte) en comprimeer ze. Shopify en WordPress kunnen automatisch kleinere versies leveren als het thema daarom vraagt, dus controleer of je thema responsieve afbeeldingsformaten gebruikt.

Vragen over deze tool

Waarom wijken mijn resultaten af van PageSpeed Insights?

Labtests hangen af van de machine, het netwerk en het moment. PageSpeed Insights draait Lighthouse op de servers van Google en simuleert de trage verbinding, terwijl wij de vertraging in een echte browser toepassen. Verwacht cijfers in dezelfde orde van grootte, geen identieke cijfers.

Wat is een goede LCP?

2,5 seconden of minder voor minstens 75% van de paginaweergaven, volgens web.dev. Meer dan 4 seconden is slecht.

Waarom zijn er geen echte gebruikersdata voor mijn site?

Het Chrome UX Report bevat alleen origins die openbaar vindbaar zijn en genoeg bezoeken krijgen van Chrome-gebruikers die gebruiksstatistieken delen. Veel kleine sites halen dat niveau niet; de labtest laat nog steeds zien wat je moet oplossen.

Waarom testen op een trage telefoon in plaats van op een desktop?

Omdat problemen daar het eerst zichtbaar worden. Een snelle laptop verbergt zware afbeeldingen en scripts die op een middenklasse telefoon seconden kosten, en Lighthouse gebruikt hetzelfde telefoonprofiel voor zijn mobiele tests.

Wat is er met First Input Delay gebeurd?

Interaction to Next Paint (INP) heeft in maart 2024 First Input Delay vervangen als Core Web Vital. INP kijkt naar de vertraging van interacties tijdens het hele bezoek, niet alleen naar de eerste.

Bronnen

Gerelateerde tools

Het Snelheidsrapport ($55, eenmalig) begint bij de volledige gratis scan en voegt meer pagina’s toe, de aanpassing voor elke bevinding, een pdf en hertests om je oplossingen te controleren.

Over het Snelheidsrapport