8 april 2026
Lazy loading
door Mike
Brand, UI/UX & Webdesigner
Kort uitgelegd
Lazy loading is een techniek waarbij onderdelen van een website, zoals afbeeldingen of video’s, pas worden geladen wanneer ze in beeld komen.
Inhoudsopgave
door Mike
Brand, UI/UX & Webdesigner
In dit artikel leer je
Wat is lazy loading precies?
Lazy loading zorgt ervoor dat je website niet alles in één keer laadt, maar alleen wat op dat moment nodig is.
Normaal gesproken worden alle afbeeldingen en elementen direct geladen zodra iemand je pagina opent. Dit kan je website onnodig zwaar maken, vooral bij lange pagina’s met veel content.
Met lazy loading gebeurt dit anders: elementen onder de “vouw” (dus buiten beeld) worden pas geladen wanneer de gebruiker naar beneden scrollt.
Wist je dat websites met lazy loading vaak tot wel 30–50% minder data laden bij de eerste paginaweergave?
Waarom is lazy loading belangrijk?
Een snelle website is tegenwoordig geen luxe meer, maar een must. Bezoekers verwachten dat een pagina direct zichtbaar is.
Lazy loading helpt daarbij doordat:
Je pagina sneller zichtbaar is bij binnenkomst
Vul in…
Minder data wordt geladen (handig voor mobiel)
Vul in…
Je performance scores verbeteren (zoals Core Web Vitals)
Vul in…
Dit heeft niet alleen invloed op gebruiksvriendelijkheid, maar ook op je vindbaarheid in Google.
Hoe werkt lazy loading?
Wanneer je lazy loading gebruikt, krijgt een afbeelding of element pas een “echte” laadactie op het moment dat deze bijna in beeld komt.
Vaak gebeurt dit met:
loading="lazy" in HTML
Vul in…
JavaScript die scrollgedrag detecteert
Vul in…
Via tools/plugins (zoals in WordPress)
Vul in…
Wanneer gebruik je lazy loading?
Lazy loading is vooral handig bij:
Pagina’s met veel afbeeldingen
Vul in…
Landingspagina’s met lange content
Vul in…
Webshops met productoverzichten
Vul in…
Blogs en kennisbank artikelen
Vul in…
⚠️ Let op: Gebruik het niet voor content bovenaan je pagina (zoals je hero afbeelding), want dat kan juist je laadtijd verslechteren.
Lazy loading vs eager loading
Bij eager loading wordt alles direct geladen, ongeacht of het zichtbaar is.
Bij lazy loading alleen wat nodig is.
Het verschil zit dus in wanneer content geladen wordt.
Voorbeeld van lazy loading
Stel: je hebt een pagina met 20 afbeeldingen.
Zonder lazy loading:
→ alle 20 worden direct geladen
Met lazy loading:
→ alleen de eerste paar die in beeld zijn, de rest pas bij scrollen
Resultaat: een veel snellere start van je pagina.
