Lazy Load snel laden afbeeldingen snelheid WordPress plugin

Lazy loading verhoogt de snelheid van je webpagina. Afbeeldingen worden sneller ingeladen.

Wat is lazy loading en hoe werkt het?

Een van die methoden is lazy loading, de techniek waarbij het laden van inhoud onder de vouw wordt uitgesteld totdat de gebruiker naar beneden scrollt om de inhoud te zien. Met lazy loading wordt alleen de essentiële inhoud bij de eerste keer laden geladen, waardoor de indruk wordt gewekt dat de webpagina sneller is.

Lazy loading wordt het vaakst gebruikt voor “zware” pagina-elementen zoals afbeeldingen, iframes en scripts. Te veel van deze elementen op een pagina zal de zaken aanzienlijk vertragen, en je zou het gebruik ervan moeten beperken tot alleen het noodzakelijke. Maar lazy loading is een andere betrouwbare manier om ze op te nemen met minimale impact op de paginasnelheid.

WordPress en lazy loading

WordPress ondersteunt van nature lazy loading voor afbeeldingen en iframes, zolang je maar een upgrade naar versie 5.7 of hoger hebt uitgevoerd. Ten tweede zijn er gratis WordPress plugins die je meer controle geven over je lazy-loaded elementen.

In dit artikel bespreken we de zeven beste plugins om je afbeeldingen, iframes en meer lazy-loaded te maken. Maar eerst, waarom zou je überhaupt een plugin willen gebruiken?

Waarom zou je een lazy loading plugin gebruiken?

Of u nu een WordPress blog, een zakelijke site, een online winkel, of een ander type WordPress website runt, trage paginasnelheid is de grootste vijand van gebruikerservaring. Het duurt slechts enkele seconden laadtijd voor zowel mobiele als desktop gebruikers om niet betrokken te raken met uw inhoud, dus alle kleine stappen die u kunt nemen om de pagina prestaties te verbeteren zijn meestal een goede investering.

Meer handleidingen over snel laden van WordPress

Vanaf versie 5.7, laadt WordPress standaard afbeeldingen en iframes lazy. Om precies te zijn, WordPress wijst het lazy load HTML attribuut toe aan alle <-img /-> en <-iframe-> tags die een breedte en een hoogte specificeren (om te voorkomen dat de lay-out verschuift bij het laden). Waarom zou je dan een plugin nodig hebben als WordPress deze functionaliteit al bevat? De belangrijkste reden is als je je lazy loading instellingen verder wilt aanpassen dan wat WordPress standaard doet. Hoewel u de onderliggende WordPress code kunt aanpassen om andere elementen dan afbeeldingen en iframes lazy te laden, willen gebruikers die niet zo handig zijn met programmeren misschien een alternatief. Plugins kunnen deze lazy-loading veranderingen voor u doorvoeren, zonder enige codering van uw kant.

Een andere reden waarom u een plugin zou willen is cross-browser compatibiliteit: Terwijl de meeste webbrowsers lazy loading ondersteunen, doet Apple’s Safari dat niet. Dit betekent dat native WordPress lazy loading momenteel niet werkt in die browser. Tot Apple het loading attribuut ondersteunt, kunnen sommige lazy loading plugins helpen om lazy loading te activeren in deze browser en andere populaire browsers.

Nu we de voordelen van een WordPress plugin voor lazy loading hebben gezien, laten we eens kijken naar je beste opties.


Beste Lazy Load WordPress plugins

De beste Lazy Load WordPress plugins op een rij:

a3 Lazy Load

a3 Lazy Load is de populairste WordPress-plugin die uitsluitend gericht is op lazy loading, waardoor het een uitstekende keuze is voor websites waarop veel media worden weergegeven. Met deze gratis tool kunt u niet alleen uw afbeeldingen sneller laten laden, maar kunt u ook iframes en video’s laten laden dankzij de aanpassingsopties. U kunt zelfs animatie-effecten toevoegen voor wanneer de beelden wel laden (zoals fade-ins).

Deze plugin werkt uitstekend samen met andere geavanceerde plugins, en is een geweldige optie voor beheerders die lazy loading op hun e-commerce websites willen – de WooCommerce plugin is volledig compatibel met deze plugin. a3 Lazy Load werkt ook goed op mobiele sites.

Als u zich zorgen maakt over de gebruiksvriendelijkheid, hoeft u dat niet te doen. a3 Lazy Load is eenvoudig in te stellen en aan te passen voor gebruikers van alle ervaringsniveaus.

Smush

Smush is de toonaangevende plugin voor het optimaliseren van afbeeldingen voor WordPress, en dat is niet voor niets – de plugin bevat alles wat u nodig hebt om te voorkomen dat afbeeldingen de prestaties van uw pagina’s belasten, waaronder compressie, ontvangst en, natuurlijk, lazy loading.

Het activeren van lazy loading in Smush is zo eenvoudig als het klikken op een knop – dit stelt direct het laden van alle afbeeldingen onder de vouw uit. Vanaf daar kun je met Smush ook het lazy loading beperken tot bepaalde mediatypen en uitvoerlocaties (bijv. miniaturen, widgets en inhoudsgebieden).

Deze plugin is op grote schaal compatibel met andere populaire plugins en WordPress thema’s om uw site geoptimaliseerd te houden en bezoekers vast te houden. Het beste van alles is dat je niet de premium versie van Smush hoeft aan te schaffen om lazy loading te activeren, aangezien de gratis versie deze functie bevat.

Afbeelding optimaliseren & Lazy Load door Optimole

Image optimization & Lazy Load is een andere populaire plugin die gericht is op het verbeteren van de prestaties door je afbeeldingen te optimaliseren. Aangezien Optimole een full service is, kun je de gratis versie van de plugin gebruiken om lazy loading mogelijk te maken, of upgraden naar een van de betaalde abonnementen voor meer functies.

Net als Smush wil Optimole een alles-in-een tool zijn voor beeldoptimalisatie, inclusief het aanpassen van het afbeeldingsformaat en compressie, een geïntegreerde CDN om afbeeldingen sneller te serveren, en een optie voor lazy loading. Merk op dat de lazy load functie is geconfigureerd om layout verschuivingen te voorkomen, zodat de gebruikerservaring niet zal worden verstoord.

Lazy Load door WP Rocket

Deze volgende plugin komt van de ontwikkelaars achter de populaire WP Rocket caching plugin – Lazy Load is nog zo’n fantastische tool die je afbeeldingen alleen zichtbaar maakt voor gebruikers als ze net boven de vouw staan. Echter, in tegenstelling tot de betaalde caching plugin, Lazy Load is gratis te gebruiken.

Deze plugin werkt op je afbeeldingen om je site te versnellen, en het zorgt ook voor je thumbnails, avatars, achtergrondafbeeldingen, tekst, iframes (die je kunt vervangen door een image thumbnail), en al het andere dat de laadsnelheid zou kunnen verminderen.

Lazy Load van WP Rocket wordt regelmatig bijgewerkt om de functies up-to-date te houden en aan te passen aan andere geavanceerde plugins in zijn soort. Bovendien kun je het gebruiken op de nieuwste versie van je WordPress site en er andere moderne plugins naast installeren.

Lazy Loader

Laat je niet in verwarring brengen door de vergelijkbare plugin-namen – als je op zoek bent naar een eenvoudige plugin zonder toeters en bellen, overweeg dan Lazy Loader. Deze lazy loading plugin stelt het laden van below-the-fold afbeeldingen, iframes, video’s en audio-inhoud uit. Het zorgt ook voor het laden van achtergrondafbeeldingen, scripts, en pagina styling.

Voor meer geavanceerde gebruikers, Lazy Loader kunt u ook inschakelen / uitschakelen op bepaalde pagina-elementen en een spinner animatie toe te voegen aan het laden van inhoud.

Speed Up – Lazy Load

Zoals de naam al doet vermoeden, verhoogt deze plugin de snelheid van je site door afbeeldingen en iframes langzaam te laden. De installatie van Speed Up is zo eenvoudig als het maar kan – er is geen configuratie vereist en de plugin doet zijn werk zodra deze wordt geactiveerd.

Speed Up is een gratis en solide keuze voor gebruikers die lazy loading willen toepassen op alle afbeeldingen en iframes. Echter, degenen die behoefte hebben aan meer granulaire controle zullen waarschijnlijk een betere ervaring hebben met een andere plugin.

Lazy Load voor video’s

Websites met veel video’s kunnen kiezen voor de gratis Lazy Load for Videos-plugin, die speciaal is ontworpen voor het lazy loading van video’s. Deze plugin vervangt elke YouTube of Vimeo embed door een klikbare afbeeldingsvoorvertoning, waardoor uw gebruikers bovenaan kritische wachttijd besparen.

Naast het normale lazy loaden, Lazy Load voor Video’s wordt geleverd met een aantal extra’s die u zou kunnen waarderen. Om er een paar te noemen: je kunt je embeds zo instellen dat er automatisch een promotievideo voor je website wordt afgespeeld nadat de eerste video is afgelopen, annotaties en YouTube-besturingselementen verbergen voor een schoner uiterlijk, de stijl van de afspeelknop wijzigen en suggesties voor gerelateerde video’s verbergen nadat je video’s zijn afgelopen.

Laat lui laden het werk doen.

Uw WordPress website kan afhankelijk zijn van afbeeldingen en video’s, maar dat betekent niet dat uw snelheid een grote klap moet krijgen als gevolg daarvan. Door middel van de eigen WordPress lazy loading functie of met een gespecialiseerde plugin, kun je het laden van deze elementen uitstellen totdat de gebruiker ze nodig heeft. Ze worden dan wel “lazy” loading plugins genoemd, maar in feite werken ze achter de schermen hard om uw bezoekers de best mogelijke ervaring te bieden.

Opmerking van Arthur:
Dit bericht is oorspronkelijk gepubliceerd in december 2020 en is in 2021 bijgewerkt voor de volledigheid.


Meer info over snelheid WordPress webpagina’s

Meer info laadtijd WordPress webpagina’s: