Dat het belangrijk is om mooie, goede foto’s in je website te gebruiken weet je waarschijnlijk wel. Maar wist je dat het ook belangrijk is dat de foto’s die je in je website gebruikt het juiste formaat hebben? Natuurlijk moet een foto niet te klein zijn, maar ook een te grote foto is niet goed voor je website. Grote foto’s zul je dus moeten optimaliseren. Maar hoe doe je dat, een foto verkleinen? In dit artikel geef ik je 3 simpele tips zodat jij dit straks zonder moeite doet.

Waarom zou je een foto verkleinen?

Misschien denk je, waarom is het eigenlijk belangrijk om mijn foto’s te verkleinen? Is het niet gewoon beter om een foto altijd zo groot mogelijk te uploaden?

Het antwoord is nee. Het gebruiken van te grote foto’s kan vervelende gevolgen hebben voor snelheid van je website.

via GIPHY

Een grote foto kost meer tijd om te laden. Hoe meer grote foto’s je website bevat, hoe trager de laadtijd wordt. Dit kan ervoor zorgen dat het een aantal seconden duurt voordat je website geladen wordt. Dit is een van de grootste irritaties van websitebezoekers. Grote kans dus dat ze snel weg klikken van jouw website en naar die van de concurrent gaan.

Een trage laadtijd van je website wordt ook afgestraft door Google. Bij de berekening van je positie in de zoekresultaten houdt Google namelijk rekening met de laadtijd van je website. Aangezien te grote foto’s je website trager maken is de kans groot dat je lager in Google eindigt. Een foto verkleinen naar het juiste formaat draagt dus bij aan een betere SEO-score!

Een foto verkleinen, hoe doe je dat?

Oké, het is duidelijk: het is belangrijk om foto’s in het juiste formaat te gebruiken voor je website. Maar hoe doe je dit? Er zijn drie belangrijke aspecten voor het optimaliseren van foto’s:

• Bestandsgrootte: een bestand bestaat uit een bepaald aantal bytes. Een foto van een paar MB is groter dan een foto van een paar honderd KB en kan je website dus aanzienlijk trager maken.

• Afbeeldingsgrootte: dit zijn de feitelijke afmetingen van de foto. Deze worden voor het gebruik in je website in pixels uitgedrukt.

• Resolutie: dit is de kwaliteit of dichtheid van de afbeelding. Dit wordt gemeten in dpi (‘dots per inch). Het is een term die veel in de drukwereld wordt gebruikt. Voor drukwerk is het belangrijk dat afbeeldingen een minimaal 300dpi zijn. Voor het gebruik in je website is 72dpi echter genoeg. Sterker nog: een grotere dpi toont de afbeelding niet scherper, maar maakt je website wel trager.

1 – Bepaal de juiste afmetingen

Voordat je een foto gaat verkleinen is het belangrijk om uit te bepalen hoeveel de afbeelding verkleind kan worden.  Het heeft natuurlijk geen zin om een foto zomaar wat te verkleinen. Een foto moet ook weer niet té klein en daardoor onscherp worden.

Het is het beste om de foto te uploaden in het formaat dat deze in je website getoond wordt.

Tips voor het bepalen van het juiste formaat

•  Afbeeldingen die in de volledige breedte van je website worden getoond kun je het beste verkleinen naar 1920px breed.

• Afbeeldingen die je bij blogs gebruikt zijn meestal 800px breed.

• Voor kleinere afbeeldingen, die bijvoorbeeld gebruikt worden bij team-tegels, logo’s, etc. is 500px breed meestal voldoende.

2 – Bepaal de juiste kwaliteit

Naast het bepalen van de juiste afmetingen van de foto is het belangrijk dat je de juiste kwaliteit van een foto gebruikt. De kwaliteit van de foto kun je vaak zien aan de grootte van het bestand. Een foto van 5MB heeft een hogere kwaliteit dan een foto van 300KB.

Een aantal richtlijnen voor het bepalen van de juiste kwaliteit:

• Voor afbeeldingen die je in de volledige breedte gebruikt is 1MB meer dan genoeg

• Voor kleinere afbeeldingen is 300KB vaak al genoeg.

3 – Verklein de foto naar de juiste afmetingen en kwaliteit

Nadat je de juiste afmetingen en kwaliteit hebt bepaald is het tijd om de foto te optimaliseren. Er zijn verschillende tools die je hiervoor kunt gebruiken:

• Photoshop: als je Photoshop tot je beschikking hebt is dit het ideale programma om foto’s mee te optimaliseren. Photoshop heeft namelijk de functie ‘Opslaan voor web’. Als je deze functie gebruikt wordt je foto automatisch in de juiste kwaliteit opgeslagen. Kies bij bestandsformaat voor JPEG en zet de kwaliteit op 60. Vul vervolgens de juiste formaten in en sla je de foto op. De foto is nu perfect geoptimaliseerd voor het gebruik in jouw website!

• Paint: heb je geen Photoshop tot je beschikking dan is Paint een goed alternatief.  Nadat je de foto hebt geopend klik je op ‘Formaat wijzigen’. Kies voor de optie ‘pixels’ en voer het juiste aantal pixels in. De resolutie van de foto is nu verkleind, maar de kwaliteit nog niet.

• Tinyjpg.com: met deze gratis webtool kun je foto’s in de juiste kwaliteit opslaan. De tool verkleint de bestandsgrootte, zonder de kwaliteit van de afbeelding te veranderen.

De foto hierboven had een origineel formaat van 5760 x 3840 pixels en was oorspronkelijk bijna 10MB. Als ik de originele foto had gebruikt zou deze blog zou dan waarschijnlijk erg traag laden, met als logisch gevolg dat jij had weg geklikt van de pagina. Ik heb de foto daarom verkleind naar 700 x 466px: precies het formaat waarin de foto op deze pagina getoond wordt. Daarnaast heb ik de kwaliteit van de foto verlaagd waardoor de foto nu nog maar 79,5KB is.

Conclusie: Maak van afbeeldingen optimaliseren een gewoonte

Het lijkt misschien veel werk, een foto verkleinen, vooral als het om veel foto’s gaat. Maar het is zeker de moeite waard als je de laadtijd van je website wil verkleinen en hoger in Google wil scoren. Als je foto’s direct optimaliseert voordat je ze upload wordt het vanzelf een gewoonte en gaat dit steeds sneller.

Heb je vragen of een extra tip? Laat gerust een reactie achter!