Hoe we onze SEO-pagina naar een PageSpeed-score van 98/99 kregen

Een tijdje geleden bekeken we de prestaties van onze SEO-pagina. Mooie content? Check. Duidelijke structuur? Check. Maar de laadsnelheid? Die was… pijnlijk. PageSpeed gaf ons op mobiel een score van 30. De boosdoener was de LCP van maar liefst 30 seconden. 😬 Een artikel over SEO met zulke laadtijd? Kan niet. Tijd om onszelf eens een stevige SEO-behandeling te geven.

We gingen op onderzoek. Al snel bleek dat de grootste boosdoeners enkele zware GIF-bestanden bovenaan de pagina waren. Ze zagen er leuk uit, en maakten de pagina dynamisch, maar wogen samen meer dan 5 MB. En omdat ze direct geladen werden (zonder lazy loading), vertraagden ze de hele pagina.

Daarnaast merkten we dat onze kolomstructuur in de Kadence Builder best zwaar was. We gebruikten complexe structuren met kolommen in sections, in kolommen… Veel geneste elementen = veel werk voor de browser.

We wilden de look & feel behouden, maar de technische fundering verstevigen. Geen radicale heropbouw, wel slimme aanpassingen. Dit deden we stap voor stap:

  • GIFs → WebP: We vervingen 4 zware GIF-animaties bovenaan de pagina door geanimeerde WebP-bestanden. Zelfde effect, 90% minder gewicht.
  • Lazy loading toegevoegd: Voor afbeeldingen onder de fold die de pagina vertraagden, zetten we loading=”lazy” aan. Dit zorgt ervoor dat deze niet geladen worden wanneer de pagina geopend wordt, maar pas wanneer de bezoeker er naartoe scrollt. Sneller en slimmer!
  • Hero-sectie vereenvoudigd: De bovenste Kadence-structuur hadden we opgebouwd met verschillende geneste kolommen en visuele effecten. We vervingen die door een lichtere lay-out met minder DOM-nesting.
PageSpeed Insights resultaat na optimalisaties.

Na optimalisatie ging onze mobiele score van 30 → 98. Desktop: 99. En intussen pasten we dezelfde principes toe op de rest van onze website.

  • De LCP daalde van 30.000ms naar onder de 2.000ms
  • Geen layout shift meer
  • De pagina voelt direct responsief aan

En dat zonder stijl of merkgevoel op te offeren. Alles ziet er nog steeds fris en vertrouwd uit — alleen veel sneller.

Pagespeed Insights resultaten voor en na optimalisaties

De SEO-pagina was het startpunt, maar we hielden het daar niet bij. We hebben dezelfde aanpak toegepast op alle belangrijke pagina’s van onze site: van de homepage tot elke dienst. Resultaat? Elke pagina haalt nu een PageSpeed-score van 90+ op mobiel.

De grootste technische winsten kwamen door:

  • Fonts lokaal te hosten in plaats van via externe services
  • De Complianz-cookiebanner te verkleinen én pas te tonen bij interactie (scroll of klik)
  • Boven de vouw alles lichter te maken: minder scripts, minder opmaak, en Kadence-headerblokken vervangen door Classic Title Blocks

Zo zie je, performantie is geen toeval, maar het resultaat van bewuste keuzes in UX en techniek.

Of je nu zelf je site beheert, of samenwerkt met een bureau: deze inzichten helpen je om je laadtijd en Google-score naar een hoger niveau te tillen.

  1. Gebruik geen zware .gif’s in je hero (of ergens anders in je website). WebP ondersteunt ook animatie en is veel lichter.
  2. Activeer lazy loading — dat kan handmatig via loading=”lazy”, via een functie in functions.php (geavanceerd) of met een degelijke plugin (zoals FlyingPress, Perfmatters of Smush).
  3. Check je PageSpeed regelmatig. Niet om jezelf gek te maken, maar als handige check op performance. Onze SEO-pagina scoorde initieel goed, maar door kleine wijzigingen daalde de score gestaag. Regelmatig checken is de boodschap!
  4. Vertrouw niet blind op je pagebuilder. Wat er mooi uitziet, kan technisch log zijn. Hou de structuur licht en logisch.
  5. Durf je pagina opnieuw bekijken. Kijk naar ons: zelfs onze eigen pagina over zoekmachineoptimalisatie had werk nodig.

Wil je ook zo’n score halen met je eigen website? Of wil je gewoon weten waar bij jou de traagheid vandaan komt?

📬 Vraag gerust een gratis SEO-check aan. Dan kijken we met je mee.

  1. Wat is PageSpeed en waarom is het belangrijk voor SEO?

    PageSpeed is een score die aangeeft hoe snel je website laadt. Google gebruikt die snelheid als rankingfactor. Sneller = beter vindbaar.

  2. Hoe verbeter je de PageSpeed-score van een WordPress-pagina?

    Optimaliseer afbeeldingen (bijv. via WebP), activeer lazy loading, minimaliseer scripts en hou de structuur licht boven de vouw.

  3. Wat is lazy loading en hoe pas je het toe?

    Lazy loading zorgt ervoor dat afbeeldingen pas geladen worden als ze in beeld komen. Voeg loading=”lazy” toe per afbeelding, via je functions.php (geavanceerd) of gebruik een plugin zoals Smush.

  4. Helpt het gebruik van WebP-bestanden bij SEO?

    Ja. WebP-afbeeldingen zijn veel lichter dan JPG of GIF, wat je laadtijd verbetert — en dat helpt je SEO-prestaties vooruit.

  5. Is Kadence goed voor een snelle WordPress-site?

    Kadence is het wordpress-thema dat we het liefst gebruiken. Het is overzichtelijkn, snel en performant, maar probeer te complexe blokstructuren te vermijden. Minimaliseer elementen boven de vouw voor de beste resultaten.