• Home
  • Nieuws
  • Lazy Loading aanvullen met beeldcompressie

Lazy Loading aanvullen met beeldcompressie

De afgelopen maanden hebben we het belang van beeldcompressie benadrukt. Of het nu in Joomla, WordPress, Drupal of een ander CMS is, beeldcompressie verbetert de paginagrootte en daarmee de laadtijd. lazy loading van afbeeldingen vergemakkelijkt het browsen op uw website door het laden van afbeeldingen uit te stellen tot het moment dat uw bezoekers de afbeeldingen zien.

Door het laden van afbeeldingen uit te stellen, besparen mobiele gebruikers op hun dataverbruik. Iedereen profiteert van snellere laadtijden, wat op zijn beurt je SEO-score verbetert. De positieve impact van lazy loading is zo groot dat Google Chrome van plan is de techniek in toekomstige updates standaard te implementeren.

lazy loading van afbeeldingen is niet de ultieme oplossing voor alle laadproblemen van blogs. In sommige gevallen is het nodig om afbeeldingen vooraf te laden. In andere gevallen gaat het om grote afbeeldingen die te langzaam laden. Wat in deze scenario's gemeen is, is dat afbeeldingen de laadtijd sterk beïnvloeden. Dit is waar beeldcompressie van pas komt.

lazy-loading-and-image-compression

 

Zorgvuldige beeldcompressie

Bij lazy loading van afbeeldingen wordt het downloaden uitgesteld tot het moment dat ze nodig zijn. De tijd die het kost om afbeeldingen te downloaden, hangt af van de grootte van de afbeelding – of het nu een paar kilobytes of megabytes betreft. Beeldcompressie versnelt het downloadproces door de bestandsgrootte te verkleinen. Waarom zou je afbeeldingen van volledige grootte lazy loaden als je ook gecomprimeerde afbeeldingen kunt lazy loaden?

ImageRecycle vervult de rol van beeldoptimalisator. ImageRecycle is ontworpen om de bestandsgrootte van afbeeldingen te verkleinen zonder kwaliteitsverlies. Afbeeldingen vormen een van de meest voorkomende en grootste elementen op moderne webpagina's. Het verkleinen ervan betekent minder opslagruimte en een snellere browse-ervaring. De effecten zijn verbluffend. Ik zou eraan willen toevoegen dat de effecten nog indrukwekkender zijn wanneer lazy loading gebruikmaakt van geavanceerde technieken zoals het vooraf laden van de viewport, wat betekent dat de afbeeldingen ter hoogte van één of twee schermhoogtes al zijn voorgeladen.

pre-load-image-viewport

 

 

ImageRecycle kan dankzij een handige API in elk project worden gebruikt, maar je hoeft geen technische kennis te hebben om ImageRecyclete gebruiken. De beeldoptimalisatietool maakt deel uit van twee plugins die je helpen je WordPress- en Joomla-blogs te optimaliseren: WP Speed of Light en Speed Cache Het kan op vrijwel elk platform worden gebruikt met het PHP-script voor beeldcompressie.

ImageRecycle- Instellen


 

Het proces om ImageRecycle te gebruiken in een van deze twee plugins of in het script is relatief eenvoudig. Eerst moet je een gratis proefversie van ImageRecycle activeren of een abonnement kopen. Installeer en activeer vervolgens de WordPress- of Joomla-extensies en de ImageRecycle plugin, en voeg je ImageRecycle API-sleutel en -geheim toe op de instellingenpagina. Zodra je ImageRecycle -account succesvol is geactiveerd, kun je de voordelen ervan benutten zonder WordPress, Joomla, OpenCart of een ander CMS te hoeven verlaten.

Als u ImageRecycle voor het eerst op uw website gebruikt, kunt u al uw mediabestanden direct optimaliseren. Met de plugin geactiveerd kunt u alle afbeeldingen en zelfs PDF-bestanden in één keer comprimeren. Later kunt u bestanden afzonderlijk optimaliseren of media in bulk comprimeren. Het beste van alles is dat dit proces op de achtergrond plaatsvindt.

 

Fijn afstellen van beeldcompressie

De mogelijkheid om alle afbeeldingen te optimaliseren is een zegen, maar de grootste kracht van ImageRecycleligt in de controle die het biedt. Met ImageRecyclekrijgt beeldoptimalisatie een geheel nieuwe dimensie van controle. Je kunt specifieke mediabestanden selecteren voor compressie, terwijl andere afbeeldingen in hun oorspronkelijke staat blijven.

Je kunt zelfs het compressieniveau onafhankelijk instellen voor verschillende bestandstypen: PDF, PNG, JPG en GIF. De compressieniveaus variëren van de beste besparing, waarbij de bestandsgrootte tot wel 80% wordt verkleind, tot het minder permanente niveau met behoud van de originele kwaliteit, of helemaal geen compressie.

beeldcompressiekwaliteit

 

In sommige gevallen is het handig om vóór het comprimeren van een afbeelding eerst de afmetingen aan te passen. Denk bijvoorbeeld aan het uploaden van zeer grote afbeeldingen naar een blog dat niet uitgebreid op media is gericht. Deze afbeeldingen worden waarschijnlijk toch al verkleind wanneer ze in de frontend worden weergegeven.

Het meest zorgwekkende is dat deze grote afbeeldingen te veel ruimte innemen en volledig gedownload moeten worden om weergegeven te kunnen worden. ImageRecycle laat je afbeeldingen automatisch verkleinen tot een maximale breedte of hoogte, zodat je geen grote afbeeldingen hoeft op te slaan die een negatief effect hebben op je blog.

Lazy loading is een goede oplossing om de laadtijden van je blog te verkorten, maar soms is het effect slechts oppervlakkig – een tijdelijke versnelling van webpagina's. Beeldcompressie vult lazy loading perfect aan door middel van beeldoptimalisatie. Nog niet overtuigd, of juist enthousiast om beeldcompressie uit te proberen? Probeer ImageRecycle zelf met een gratis proefversie!

    • Geen reacties gevonden