Je hebt een mooie website, de teksten kloppen, en toch duurt het een eeuwigheid voordat een pagina in beeld staat. In negen van de tien gevallen ligt dat aan je afbeeldingen. Ze zijn bijna altijd het zwaarste onderdeel van een pagina, en juist daar valt de meeste snelheid te winnen. Hieronder lees je waarom zware afbeeldingen je site vertragen en hoe je ze stap voor stap optimaliseert, zodat je website merkbaar sneller wordt.
Waarom je website sneller maken begint bij je afbeeldingen
Stel je een fietsenwinkel voor die de foto’s van zijn fietsen rechtstreeks van de camera op de website zet. Zo’n foto is zomaar 5 MB. Zet je er tien op een categoriepagina, dan moet de browser van je bezoeker 50 MB binnenhalen voordat alles staat. Op een snelle laptop met wifi valt dat nog mee, maar op een telefoon met een matige verbinding kijkt die bezoeker seconden naar een half geladen pagina. En seconden zijn lang: hoe langer het laden duurt, hoe groter de kans dat iemand wegklikt nog voordat hij je aanbod heeft gezien.
Snelheid raakt twee dingen tegelijk. Ten eerste je bezoekers: een trage pagina voelt onprofessioneel en kost je klanten die anders waren gebleven. Ten tweede je vindbaarheid, want Google weegt de laadsnelheid en de stabiliteit van je pagina mee in de zogeheten Core Web Vitals. Een langzame site zakt daardoor eerder weg in de resultaten. Goede afbeeldingen optimaliseren is dus geen technisch bijzaakje, het is een van de directste manieren om zowel je vindbaarheid in Google als je conversie te verbeteren.
De snelste winst op bijna elke website zit niet in ingewikkelde techniek, maar in de afbeeldingen die er al op staan.
Van zwaar naar licht: WebP en AVIF
De grootste sprong maak je door je afbeeldingen op te slaan in een modern formaat. JPEG en PNG zijn oud en relatief log. WebP en AVIF doen hetzelfde werk met veel minder bytes, zonder dat je het aan de kwaliteit ziet.
WebP bestaat al langer, wordt door elke moderne browser ondersteund en levert je al snel een kwart tot een derde minder gewicht op. AVIF is de nieuwere generatie en comprimeert nog scherper, vaak de helft kleiner dan een JPEG bij dezelfde kwaliteit. De ondersteuning is inmiddels breed, al net niet zo universeel als WebP. De praktische aanpak is daarom simpel: gebruik AVIF waar het kan en val terug op WebP waar dat nog niet lukt.
| JPEG / PNG | WebP | AVIF | |
|---|---|---|---|
| Bestandsgrootte | Groot (referentie) | ~25-35% kleiner | ~50% kleiner |
| Kwaliteit bij die grootte | Basis | Gelijk of beter | Beter |
| Browserondersteuning | Overal | Overal | Vrijwel overal |
| Wanneer gebruiken | Alleen als terugval | Veilige standaard | Voorkeur waar mogelijk |
Zo optimaliseer je je afbeeldingen
Optimaliseren klinkt technisch, maar het komt neer op een paar vaste stappen die je een keer goed instelt.
1. Upload nooit groter dan nodig. Toon je een afbeelding 800 pixels breed op je pagina, upload hem dan ook niet in 4000 pixels. Schaal hem eerst terug naar de afmeting waarin hij daadwerkelijk getoond wordt. Dit is de stap die het vaakst wordt overgeslagen en die het meeste scheelt.
2. Comprimeer voordat je uploadt. Ook na het terugschalen zit er nog lucht in een bestand. Een compressiestap haalt de overbodige bytes eruit terwijl het beeld er hetzelfde uitziet. Voor losse afbeeldingen kan dat met een gratis tool, in WordPress laat je het automatisch doen (zie stap 4).
3. Sla op in WebP of AVIF. Zet je JPEG’s en PNG’s om naar een modern formaat. Dit is waar de grootste winst zit, en het kost je verder niets aan kwaliteit.
4. Automatiseer het in WordPress met WebP Express. Werk je met WordPress, dan wil je dit niet per afbeelding handmatig doen. De gratis plugin WebP Express zet je bestaande afbeeldingen automatisch om en serveert aan elke bezoeker de lichtste versie die zijn browser aankan. Je stelt hem een keer in en daarna gaat het vanzelf, ook voor alles wat je later uploadt.
5. Laat afbeeldingen lazy laden. Met lazy loading haalt de browser een afbeelding pas op als de bezoeker er bijna is, in plaats van alles in een keer. Alle grote afbeeldingen onder de eerste schermvulling laden zo later, wat de eerste indruk van je pagina flink versnelt. In de meeste moderne thema’s en paginabouwers staat dit standaard aan.
De uitzondering is het grote beeld boven aan je pagina. Dat wil je juist als eerste tonen, niet uitstellen. Laat dat beeld met voorrang laden en je pagina staat merkbaar sneller in beeld. De tool die dit automatisch voor je regelt is SK Image Performance, een gratis plugin die je uitgelichte afbeelding met voorrang laat ophalen.
Doe je deze vijf dingen, dan haal je op de meeste sites het grootste deel van je snelheidswinst binnen zonder ook maar een regel code aan te raken.
Kortom
Zware afbeeldingen zijn de stille rem op de meeste websites. Schaal ze terug tot de afmeting die je echt toont, comprimeer ze, sla ze op in WebP of AVIF en laat een plugin als WebP Express het onderhoud overnemen. Je bezoekers krijgen een pagina die meteen staat, en Google ziet een snelle, stabiele site.
Wil je weten waar het bij jou precies misgaat, doe dan mijn website analyse, die kijkt naar snelheid, techniek en meer. Draait je site op trage hosting, dan helpt ook snelle WordPress webhosting mee. En wil je puur weten hoe je hoger in Google komt, begin dan bij de SEO check.
Veelgestelde vragen
Afbeeldingen zijn bijna altijd het zwaarste onderdeel van een pagina. Een enkele foto die rechtstreeks van de camera komt is zo 4 tot 8 MB, terwijl een goed geoptimaliseerde versie een fractie daarvan is. Hoe meer bytes de browser moet downloaden, hoe langer je bezoeker naar een lege pagina kijkt. Zware afbeeldingen zijn daarom meestal de eerste plek waar je snelheidswinst haalt.
Beide zijn moderne beeldformaten die kleiner zijn dan JPEG en PNG. WebP bestaat langer en wordt overal ondersteund; je bespaart er al snel 25 tot 35 procent mee. AVIF is nieuwer en comprimeert nog sterker, vaak 50 procent kleiner dan JPEG bij dezelfde kwaliteit, maar de ondersteuning is net iets minder breed. In de praktijk werk je het best met AVIF waar het kan en WebP als terugval.
Het makkelijkst is met een plugin die je bestaande afbeeldingen automatisch omzet naar WebP of AVIF en de juiste versie aan elke bezoeker serveert. WebP Express is daar een bekende, gratis optie voor. Je stelt hem een keer in en daarna hoef je er niet meer naar om te kijken; nieuwe uploads worden vanzelf meegenomen.
Er is geen vaste regel, maar een goede vuistregel is dat een grote afbeelding op je pagina ruim onder de 200 KB blijft en kleinere beelden onder de 100 KB. Belangrijker dan een exact getal is dat je de afbeelding niet groter uploadt dan hij getoond wordt, en dat je hem comprimeert en in een modern formaat opslaat.
Ja. Google gebruikt de laadsnelheid en de stabiliteit van je pagina (de Core Web Vitals) mee als signaal, en een trage site kost je bovendien bezoekers en klanten voordat Google er uberhaupt aan te pas komt. Snelheid werkt dus twee kanten op: het helpt je ranking en het houdt de bezoekers die je binnenhaalt vast.