{"id":36006,"date":"2023-06-06T08:30:39","date_gmt":"2023-06-06T06:30:39","guid":{"rendered":"https:\/\/www.strato.nl\/blog\/?p=36006"},"modified":"2025-01-08T10:48:42","modified_gmt":"2025-01-08T09:48:42","slug":"afbeeldingen-optimaliseren-voor-sitebuilder","status":"publish","type":"post","link":"https:\/\/www.strato.nl\/blog\/afbeeldingen-optimaliseren-voor-sitebuilder\/","title":{"rendered":"Afbeeldingen optimaliseren voor Sitebuilder"},"content":{"rendered":"\n

Foto’s en afbeeldingen zijn natuurlijk prachtige design-elementen. Maar je camera of fotosoftware genereert gewoonlijk heel grote bestanden. Die moet je dus optimaliseren voor je website, zodat die snel laadt.<\/strong><\/p>\n\n\n\n

De oorzaak van trage websites ligt heel vaak in grote afbeeldingsbestanden. Telkens als je de website bezoekt, moeten die bestanden gedownload worden en dat kost tijd. Daarom is het belangrijk om afbeeldingen te optimaliseren v\u00f3\u00f3r je ze op je website zet. <\/p>\n\n\n

\n
\"Afbeeldingen
Dezelfde afbeeldingen, dezelfde resolutie, maar een aanzienlijk kleinere bestandsgrootte: beeldoptimalisatie is een belangrijke SEO-factor!<\/figcaption><\/figure>\n<\/div>\n\n\n

Bestandsformaten zijn belangrijk<\/strong><\/h2>\n\n\n\n

Er zijn veel verschillende bestandsformaten voor afbeeldingen: TIF, bitmap, PNG, GIF en JPG\/JPEG zijn de bekendste. Foto’s van digitale camera’s zijn meestal beschikbaar als JPG. Dat is het meest effici\u00ebnte, gangbare bestandsformaat. Misschien ken je ook digitale animaties of video’s van social media. Dat zijn meestal GIF-bestanden. PNG wordt vaak gebruikt voor screenshots, maar is niet erg effici\u00ebnt. En bitmap- of TIF-bestanden zijn ongecomprimeerd en daardoor bijzonder groot. Die kun je beter niet op een website gebruiken!<\/p>\n\n\n\n

\"Beeldbewerkingsprogramma's
Zelfs eenvoudige beeldbewerkingsprogramma’s (zoals hier van Apple) helpen je om je afbeeldingen te optimaliseren.<\/figcaption><\/figure>\n\n\n\n

Wat betekent \u2018te groot\u2019?<\/strong><\/h2>\n\n\n\n

Maar wat is \u2018te groot\u2019 precies? In principe zijn er twee specificaties voor digitale afbeeldingsbestanden. Ten eerste de grootte gemeten in resolutie, bijvoorbeeld 12 megapixels (4032 \u00d7 3024) voor een foto gemaakt met een iPhone. Ten tweede de grootte van het bestand, dat bij een onbewerkte afbeelding van een smartphone of camera momenteel tussen de 1 en 12 megabyte ligt. Beide vormen een indicatie voor de beeldkwaliteit. De eerste factor bepaalt de hoeveelheid pixels, de tweede de mate van compressie. <\/p>\n\n\n\n

Als beide waarden hoog zijn, kun je zo\u2019n foto prachtig vergroten tot posterformaat. Je ziet dan namelijk veel details zonder dat je de pixels z\u00e9lf ziet. Maar voor gebruik op het web zijn zulke afbeeldingen v\u00e9\u00e9l te groot. Het duurt lang voor ze zijn geladen, vooral met een mobiele verbinding. Ook hebben de schermen van pc\u2019s en smartphones<\/a> vaak niet de resolutie om zulke afbeeldingen in hun geheel weer te geven. De afbeeldingen verschijnen sowieso meestal niet schermvullend, maar zijn verwerkt in het design van de website. Kortom: je kunt ze zonder problemen verkleinen.<\/p>\n\n\n

\n
\"Beeldbewerkingsprogramma's
Het bijsnijden van je foto bespaart al opslagruimte en laadtijd.<\/figcaption><\/figure>\n<\/div>\n\n\n

Foto’s verkleinen: zo werkt het<\/strong><\/h2>\n\n\n\n

Om afbeeldingen te optimaliseren voor gebruik op je website zijn er drie parameters: de resolutie, de compressie en het bestandsformaat. In principe is het altijd zinvol om alle bestanden eerst om te zetten naar JPG. Let op: vergeet niet het origineel te back-uppen en daarna alleen met een JPG-kopie te werken. Want alle volgende stappen verminderen de kwaliteit van de afbeelding voor online gebruik! Het eigenlijke verkleinen is vervolgens een fluitje van een cent:<\/p>\n\n\n

\n
\"Een
Het reduceren van de afbeeldingskwaliteit is een handige methode om kilobytes te besparen.<\/figcaption><\/figure>\n<\/div>\n\n\n