Zelf afbeeldingen optimaliseren in [2024] 💥
Het optimaliseren van uw afbeeldingen wordt steeds belangrijker. Google laat op snelle laadtijd geoptimaliseerde websites/pagina's beter gevonden worden, en de bezoeker van uw website stelt steeds hogere eisen en is ongeduldiger. Door uw afbeeldingen te optimaliseren kunnen pagina's veel sneller geladen worden in browsers, zeker als ze nog eens met G-zip gecomprimeerd worden.
Advertentie
Er zijn vele manieren om aan de slag te gaan, maar het perfect optimaliseren is een uitdaging. Als u uw afbeeldingen bewerkt met Photoshop kunt u ze tijdens het opslaan via de 1 tot en met 12 gradatie van Photoshop een lagere resolutie geven. U kunt zelf via "Opslaan voor web" ze heel precies beoordelen op scherpte en bestandsgrootte maar het blijft natte vinger werk, en de vraag is of Google het een perfecte optimalisatie gaat vinden.
Na meer dan 10 jaar ervaring vertel ik u hoe ik momenteel te werk ga om afbeeldingen te optimaliseren:
JPG-afbeeldingen
Het belangrijkste programma waarmee u gaat werken is Riot, u kunt het hier downloaden. Riot is perfect voor alle .jpg afbeeldingen. Zet u de kwaliteit op 80%, zo krijgen uw afbeeldingen precies de resolutie die Google graag ziet. Riot is in staat om een hele map met afbeeldingen tegelijk te optimaliseren, zorg wel dat alle afbeeldingen alleen .jpg zijn, gemixte soorten afbeeldingen kan wel maar overall zou dan .jpg van gemaakt worden, daarbij bent u niet gebaat.
PNG-afbeeldingen
Ook al kan Riot .png (tweede meest gebruikt type bestand voor afbeeldingen) optimaliseren, er is een veel betere manier als u de bestandsgrootte van de .png afbeeldingen nog een stuk kleiner wilt hebben, en dat is via de website van TINYPNG, klik hier om op die site te komen. TINYPNG maakt uw afbeeldingen zeker nog 40% lager in bestandsgrootte dan Photoshop of Riot en met behoud van kwaliteit en transparantie. TINYPNG biedt voor 50 dollar een Photoshop plug-in aan waarmee u dus meteen via Photoshop zo goed kunt optimaliseren, u kunt deze hier aanschaffen maar ik vind het persoonlijk nog al veel geld aangezien .png slechts met mate gebruikt wordt.
GIF-afbeeldingen
.gif afbeeldingen kunnen beter niet gebruikt worden op websites en vervangen worden door .jpg of .png, maar als het niet anders kan en u moet ze gebruiken optimaliseer de afbeeldingen dan ook met Riot, of Gifmaker, eventueel is Compressor een alternatief.
Er zijn uiteraard veel meer manieren en programma’s die hun werk waarschijnlijk ook goed doen, maar dit is de manier die ik handhaaf en deze is beproefd om snel te kunnen werken en een perfecte optimalisatie te hebben.
Optimaliseren van alle afbeeldingen op een al bestaande site
Als u bijvoorbeeld een Wordpress website heeft en ooit zijn alle bestanden on-geoptimaliseerd ge-upload, dan heeft Wordpress nog veel meer afbeeldingen gegenereerd en deze zijn ook allemaal niet ge-optimaliseerd. Hoe u het beste te werk kunt gaan is de bestanden via de server (Cpanel of FTP) naar uw PC downloaden. Bij Wordpress vind u de afbeeldingen in de map public_html/wp-content/uploads.
Op uw PC maakt u de map open en Windows helpt u via de organize knop om de bestanden op volgorde te zetten, dus .jpg bovenaan, eronder .png enzovoorts. Vervolgens markeert u alle bestanden met een .jpg uitgang en u sleept deze in Riot. Riot zal automatisch de batch-optimizer openen. Maak een nieuwe map aan waar u alle geoptimaliseerde bestanden wilt ontvangen en selecteer deze in Riot.
Zorg dat u een kopie heeft gemaakt van alle originele afbeeldingen en zet deze ergens apart. De map met afbeeldingen waarmee u aan het werk bent, hier overschrijft u alle originele bestanden met de nieuwe ge-optimaliseerde bestanden. Vervolgens doet u hetzelfde voor alle .png en .gif afbeeldingen.
Als alle bestanden ge-optimaliseerd zijn kunt u ze uploaden naar de map op de server, het makkelijkste is als u met een Cpanel kunt werken om de map op uw PC als .zip te comprimeren en deze te uploaden en te ontpakken op de server. Zo niet dan gebruikt u FTP wat helaas erg lang kan duren als het om veel bestanden gaat.
Als in de map /uploads andere mappen aanwezig waren, vaak met jaartallen, bijvoorbeeld 2021, 2022, 2023 zorg dan dat deze structuur niet verloren gaat, want als u de structuur verandert kan uw website de bestanden straks niet meer vinden natuurlijk.
Theme afbeeldingen optimaliseren
Om echt alle afbeeldingen goed ge-optimaliseerd te hebben zou u hetzelfde moeten doen met alle afbeeldingen die uw theme gebruikt. Let op dat themes meestal transparante afbeeldingen gebruiken in .png formaat met schaduwen. Deze bestanden moet u perse optimaliseren met TINYPNG zodat ze niet lelijk worden! Dit vereist uiteraard extra aandacht. Zorg ook dat als u een Wordpress website heeft dat u een child theme gebruikt want anders kunt u na uw theme ge-upgraded te hebben weer opnieuw beginnen. U kunt ook alleen de afbeeldingen optimaliseren die Google u aangeeft waar ze en probleem mee heeft als u een test uitvoert via Google Pagespeed Insights.
Webstick.nl is expert op het gebied van optimalisatie van website, u kunt het optimaliseren van uw afbeeldingen en andere optimalisatie processen dus ook aan ons uitbesteden als u er zelf niet uitkomt of er geen zin in heeft.
- Martijn Assie / Webstick.nl
Advertisement