Menu

PNG afbeeldingen comprimeren in WordPress

Leo 28 november 2014

TinyPNG - PandaIk heb al vaker geschreven over het comprimeren van afbeeldingen in WordPress. Zo schreef ik in 2011 al over het comprimeren (verkleinen) van afbeeldingen met behulp van WP Smush.it. Eind juli schreef collega Remco nog over het optimaliseren van afbeeldingen met ImageOptim een app voor de Mac. In deze blog ga ik in op het comprimeren van PNG in WordPress met behulp van TinyPNG.

TinyPNG is een online tool waarbij je PNG afbeeldingen kunt uploaden om deze te laten comprimeren. Vaak zijn PNG bestanden vrij groot qua bestandsgrootte. Dit komt doordat de data van de afbeelding ‘lossless’ wordt gecomprimeerd. Of wel alle data wordt zo compact mogelijk opgeslagen, maar alle data blijft in de afbeelding staan. Wat TinyPNG doet is alle overbodige data uit de afbeelding halen deze vervolgens weer opslaan. Hierbij wordt de kwaliteit van de afbeelding zo weinig mogelijk beïnvloed waardoor deze scherp blijft.

TinyPNG integreren met WordPress

Sinds enige tijd heeft TinyPNG een API waardoor externe diensten gebruik kunnen maken van de compressie methode van TinyPNG. Ondertussen zijn er diverse WordPress plugins beschikbaar die gebruik maken van deze API en kunnen PNG afbeeldingen die worden geupload automatisch worden gecomprimeerd.

Voorbeeld

Op mijn persoonlijke blog had ik onderstaande afbeelding geupload bij een blog over de cookieswetgeving in Nederland. De originele afbeelding was 384kb groot. Een vrij grote afbeelding dus.

Voorbeeld PNG

Nadat ik de WordPress plugin “Compress PNG for WP” had heb ik de afbeelding gecomprimeerd. Het resultaat is dat de afbeelding nu 95kb is, een verschil van 289kb! Dit is 75% kleiner dan dat de afbeelding eerst was.

Resultaat PNG compressie

Waarom PNG afbeeldingen comprimeren

Het antwoord op deze vraag is vrij eenvoudig. Wanneer afbeeldingen worden gecomprimeerd, worden ze kleiner in omvang en daardoor worden deze sneller geladen. Daarnaast neemt het minder ruimte in op de server en neemt het dataverkeer af. Het resultaat, een snellere website, minder dataverkeer en minder ruimte op de server.

Gratis en betaalde pakketten voor TinyPNG

Om gebruik te kunnen maken van de TinyPNG API moet een account aangemaakt worden met een e-mailadres. Er hoeft enkel een e-mailadres ingevuld te worden en vervolgens kan via een toegestuurde link een API sleutel worden verkregen. Deze API sleutel moet ingevuld worden in de Compress PNG plugin (via Instellingen > Media), waarna de plugin gebruikt kan worden. Per maand kunnen er gratis 500 PNG bestanden worden gecomprimeerd. Wil je meer afbeeldingen comprimeren, dan dien je een betaald pakket bij TinyPNG aan te schaffen. De kosten daarvan zijn $ 15,00 voor 3.500 afbeeldingen en $ 100,00 per maand voor 50.000 afbeeldingen.

Voor de meeste gebruikers / websites is de gratis pakket voldoende om de PNG afbeeldingen te comprimeren.

Ik ben zelf erg te spreken over TinyPNG. Dat er nu ook goede WordPres plugins zijn die gebruik maken van deze dienst vind ik helemaal om vrolijk van te worden. Twee mooie producten die elkaar versterken, heerlijk toch?!

3 reacties

  1. Ik zie dat jij een t overhebt achter antwoord(t), mag ik deze hebben voor wordfreud? :)

    Waarom PNG afbeeldingen comprimeren
    Het antwoordt op deze vraag is vrij eenvoudig.

    Dan ook een vraag over het produkt zelf. Waarom niet alle plaatjes niet gewoon eerst door tinypng.com halen voordat je ze in wordpress zet? Kom er niet achter in je artikel of de plaatjes nu elke keer bij het open van de pagina worden gecomprimeerd of dat het gebeurd tijdens het uploaden en opslaan.

    groet,

    Jeroen

    • Beste Jeroen,

      Het comprimeren gebeurd bij het uploaden van de afbeeldingen. Dus dat is één keer automatisch door TinyPNG halen. Daarna worden de gecomprimeerde afbeeldingen geladen.

      Betreft de t, die mag je hebben voor Wordfeud. Mag ik dan de r van jou? Wordfreud.

  2. Bedankt voor de toelichting. Dan is het helemaal top om tinypng zo te kunnen gebruiken.
    En uiteraard mag je van mij de r hebben ;)

Altijd op de hoogte blijven?