Een website die traag is, is killing. Eén van de grootste oorzaken van trage websites? Afbeeldingen die te groot zijn, verkeerd zijn opgeslagen, of die rechtsreeks uit je camera of uit Canva komen zonder enige bewerking.
Het goede nieuws: afbeeldingen optimaliseren is geen hogere wiskunde en ik ga je uitleggen hoe je dit zelf kunt doen! Als je een vaste volgorde aanhoudt, dan ben je per afbeelding in een paar minuten klaar. En je website wordt er sneller, prettiger en vaak ook beter vindbaar van.
Waarom dit belangrijk is
Afbeeldingen maken je website mooier, maar ze kunnen je site ook onnodig zwaar maken. Optimaliseren van de afbeeldingen zorgt vooral voor:
- Snellere laadtijd
- Beter gebruikservaring (mensen haken minder snel af)
- SEO-voordeel, omdat Google graag snelle websites ziet
De vaste volgorde die je aanhoudt
Zie dit als jouw mini-checklist, die je elke keer aanhoudt. Loop deze checklist door vóórdat je afbeeldingen uploadt naar je website.
Stap 1: Het juiste bestandformaat
Gebruik meestal:
- JPG/JPEG voor foto’s (kleinere bestanden, prima kwaliteit)
- PNG voor logo’s, iconen of afbeeldingen met transparantie (vaak wel zwaardere bestanden)
- WebP kan ook, omdat deze vaak nóg kleiner zijn.
Stap 2: Slimme benaming van je bestanden
Dus niet: IMG_4837.jpg
Maar wel: interieur-advies-woonkamer-asten.jpg
Gebruik koppelstreepjes tussen woorden. Zo snapt Google beter waar de afbeelding over gaat.
Stap 3: De juiste afmeting
Upload geen grotere bestanden dan nodig. Als je afbeelding op de website maar 500x550px wordt weergegeven, heeft het geen enkele zin om hem op 4000x4000px te uploaden.
Richtlijnen die vaak goed werken:
- Paginabrede afbeeldingen: rond de 2000px breed
- Kleinere afbeeldingen/blokken: vaak max. 800px breed
Bijknippen en het formaat van je afbeeldingen aanpassen kan prima in Canva, Paint of Voorvertoning.
Stap 4: Comprimeer vóórdat je upload
Comprimeren is het kleiner maken van je bestand, zonder dat je zichtbaar kwaliteit verliest.
Handige tool hiervoor zijn:
- TinyPNG (werkt ook voor JPG)
- JPEG-Optimizer
Je kunt het comprimeren ook via WordPress plugins op je website doen, maar vooraf comprimeren is vaak fijner. Dan houd je zelf de hele controle in handen en vergeet je het niet.
Vergeet de laatste stappen niet
Bij een WordPress website zijn de volgende zaken ook nog belangrijk:
1. Alt-tekst invullen (sla dit niet over)
Wanneer je je afbeelding uploadt naar de media van je website, zie je een veld verschijnen waar je Alt tekst in kunt vullen. Deze helpt bij:
- Toegankelijkheid (screenreaders lezen deze tekst voor)
- SEO (Google begrijpt wat er op de afbeelding staat)
Houd deze teksten kort en beschrijvend, bijvoorbeeld: “Webdesigner werkt aan laptop in WordPress dashboard”.
2. Lazy loading
Lazy loading zorgt ervoor dat afbeeldingen pas laden als ze in beeld komen. Dat scheelt laadtijd, vooral op pagina’s met veel beeld. WordPress heeft dit meestal als standaard ingebouwd (vanaf versie 5.5), maar er zijn ook plugins mogelijk wanneer je extra controle wilt.
Wil je checken of jouw afbeeldingen je website vertragen?
Dit hoeft niet op de gok. Check je website bijvoorbeeld via:
- Google PageSpeed Insights
- GTmetrix
- Pingdom
- Lighthouse in Chrome
Daar zie je vaak letterlijk welke afbeeldingen te groot zijn, wat je nog kunt besparen en waar dus winst te behalen valt.
Tot slot
Afbeeldingen is zo’n klusje dat je misschien uit wil stellen of waar je tegenop ziet wanneer je je website nieuw gaat vullen. Maar het loont echt. Je kunt dit beter doen voordat je website traag wordt, bezoekers afhaken, of je ineens merkt dat je opslag volloopt.
Als je deze volgorde aanhoudt: formaat kiezen, naam geven, afmeting goed zetten, comprimeren en dan pas uploaden. Dan zit je eigenlijk altijd goed.
Wil je dat ik even met je meekijk naar je huidige afbeeldingen of je mediabibliotheek? Neem gerust contact met me op. Dan halen we samen in één keer de grootste snelheidswinst uit je website.
