In deze post wordt uitgelegd hoe voor WordPress websites in bulk afbeeldingen en foto’s kunnen worden verkleind (gecomprimeerd) wat erg belangrijk is voor een mobielvriendelijke website. In de praktijk wordt er veel focus gelegd op het responsive maken van websites en wordt het comprimeren van afbeeldingen vaak niet benoemd of uitgelegd. Dit is onterecht omdat de grootte van een afbeeldingsbestand bepalend is voor hoe snel die laadt en omdat gecomprimeerde afbeeldingen tot wel 500% kleiner kunnen zijn dan niet gecomprimeerde afbeeldingen. We hoeven dan ook geen wiskundige te zijn om te snappen dat een gecomprimeerde afbeelding veel sneller laadt dan een afbeelding die niet gecomprimeerd is. Gelukkig is het comprimeren van afbeeldingen en foto’s met WordPress eenvoudig en zijn hiervoor goede gratis plugins beschikbaar.
Om het effect van de compressie te meten gebruiken we PageSpeed Insights. Dit is een tool van Google zelf voor ontwikkelaars. De uitslag hiervan is relevant voor hoe een website zal scoren in Google. PageSpeed Insights geeft meer gedetailleerde informatie dan de mobielvriendelijk test van Google. |
Afbeelding compressie met de plugin ‘JPEG & PNG images’
Voor het comprimeren van bestaande en nieuwe afbeeldingen wordt de plugin ‘Compress JPEG & PNG images’ gebruikt. Deze plugin comprimeert alle nieuwe media uploads zonder tussenkomst van de gebruiker en daarnaast is het mogelijk om bestaande afbeeldingen in bulk te comprimeren. De plugin is gratis en biedt de mogelijkheid om 500 compressies per maand uit te voeren. Dit is niet hetzelfde als het comprimeren van 500 afbeeldingen omdat elke afbeelding direct in alle formaten wordt gecomprimeerd. Gemiddeld kunnen er ongeveer honderd afbeeldingen per maand worden gecomprimeerd met het gratis abonnement. Wanneer dit onvoldoende is om alle afbeeldingen de eerste keer te comprimeren, dan is het raadzaam om de maanden er op dit te herhalen totdat alle afbeeldingen en foto’s zijn gecomprimeerd.
Stap 1: installeer de plugin ‘Compress JPEG & PNG images’
Voor het comprimeren van grote aantallen afbeeldingen gebruiken we de plugin ‘Compress JPEG & PNG images’. Installeer de plugin en activeer deze via het plugin menu als dit nodig mocht zijn.
Maak vervolgens een gratis account aan op site van TinyPNG onder het onderdeel Developers API of ga direct naar de registratie pagina via de volgende link: https://tinypng.com/developers. Als het account is aangemaakt dan worden we automatisch doorgeleid naar een pagina waarop de API key voor het nieuwe account wordt getoond. Deze hebben we nodig om de plugin te activeren.
Stap 2: activeer de plugin met de API key
In deze stap wordt de verkregen API key ingevoerd in WordPress onder Media instellingen waarna afbeelding compressie beschikbaar is om te gebruiken. Om de API key in te voeren kiezen we onder het menu Instellingen voor het item Media waarmee het Media instellingen scherm wordt geladen.
Halverwege de pagina bevindt zich het invoerveld ‘TinyPNG API-sleutel’. Voer hier de onder stap 1 verkregen API key in en sla de nieuwe instellingen op.
Stap 3: comprimeer bestaande afbeeldingen
De laatste stap is het in bulk comprimeren van bestaande afbeeldingen en foto’s. Met de installatie van de nieuwe plugin is er een nieuw menu item bijgekomen onder het menu Media met de naam Comprimeer alle afbeeldingen. Kies voor deze optie om het scherm te laden voor het in bulk comprimeren van bestaande afbeeldingen en foto’s. Klik in dit scherm op de knop Comprimeer alle afbeeldingen om het comprimeren te starten. Alle afbeeldingen worden nu één voor één gecomprimeerd totdat de credits op zijn.
Dit blog is een vervolg op de in december 2014 geplaatste post ‘WordPress SEO en afbeeldingen optimalisatie’ welke niet meer relevant is omdat de besproken plugin niet meer beschikbaar is.
Trackbacks
[…] Update 18 januari 2016: de plugin genoemd in deze post is niet meer beschikbaar. Er is een nieuwe post ter vervanging van deze welke wel up to date is: WordPress SEO afbeelding en foto compressie […]