Je website bovenaan in Google?

Dit is de eerste stap...



 Ja, ik wil hoger scoren
in de zoekresultaten!
Check

webimpuls.be logo

Via het javascript 'Lazy load' wordt een afbeeldingen pas gedownload wanneer ze zichtbaar wordt. Dit laat toe de webpagina sneller te tonen, er moet immers niet gewacht worden tot alle afbeeldingen ingeladen zijn.

Lazy load is dus zowat de tegenhanger van preloading: de afbeeldingen worden pas geladen op het moment dat ze nodig zijn.

Hoe werkt dit? Vertraagt dit dan de pagina net niet? Neen, omdat je kan instellen welke afbeeldingen door die lazy load moet worden beheerd. Hier ga je natuurlijk geen afbeeldingen uit de layout of navigatie in plaatsen, maar bijvoorbeeld wel grote foto's (of veel foto's) in een lang blogbericht, die pas na veel scrollen zichtbaar worden. Naast de vrij eenvoudige implementatie en gebruik van dit script, biedt het ook de mogelijkheid van een 'placeholder', een voorlopige afbeelding, zodat de opmaak van de pagina niet verspringt. Niet alleen de gebruiker heeft hier baat bij, ook de server zal ook minder requests krijgen en dus sneller zijn.

Deze techniek toepassen op de juiste plaatsen en eventueel aangevuld met 'preloading' kan een groot verschil betekenen voor de laadtijd van webpagina's met veel of grote grafische inhoud. Preloading gebruik je bijvoorbeeld bij 'thumbnails', kleine voorbeeldafbeeldingen, zodat de volleige afbeeldingen al inladen tijdens het weergeven van de thumbnail-pagina o.a. bij foto galerijen. Een bezoeker die niet moet wachten is vaak een tevreden bezoeker. En wie keert er weer terug...?

Tags: javascript, webdesign

Reactie(s) (0)