Afbeeldingen optimaliseren is een handige manier om de afbeeldingen op je website meer waarde mee te geven. Losstaande afbeeldingen op je website voegen niet zoveel toe en kunnen er zelfs voor zorgen dat je website trager wordt en er dus op achteruit gaat.
Wanneer we kijken naar het optimaliseren van afbeeldingen moet je begrijpen dat dit op twee verschillende manieren kan. Enerzijds kun je afbeeldingen optimaliseren voor zoekmachines zodat ze er voor zorgen dat je vindbaarheid gaan verbeteren. Anderzijds moet je er voor zorgen dat de grootte van de afbeeldingen zijn geoptimaliseerd. In dit artikel ga ik je stap voor stap uitleggen hoe je op deze twee verschillende manieren je afbeeldingen optimaliseert.
Inhoudsopgave
De grootte van afbeeldingen optimaliseren
Het begint allemaal bij het uploaden van je afbeeldingen in het juiste formaat. Doe je dit namelijk niet wordt je website gigantisch traag. Dat is logisch, als je een gigantisch grootte en scherpe afbeelding in moet laden dan duurt die even.
Het is daarom belangrijk dat je afbeeldingen gaat optimaliseren. Die doe je door de juiste grootte van pixels te kiezen en iets van het kwaliteit van de afbeelding te verwijderen. Daarnaast heb ik een tweetal plugins voor je uitgekozen waardoor je afbeeldingen op je website geen probleem hoeven te zijn voor een lange laadtijd.
Wanneer je de bovenstaande alinea hebt gelezen is het logisch als de volgende vraag bij je naar boven komt: worden mijn afbeeldingen niet slecht zichtbaar als je ze klein maakt of de kwaliteit eruit haalt? Gelukkig is dat niet zo. Doordat je de pixels aanhoudt van de grootte van het scherm zorg je er voor dat hij hierdoor scherp is. En omdat het om een klein gedeelte van de kwaliteit gaat merk je hier ook niks van. Wanneer je als fotograaf te werk gaat kan dit mogelijk een ander verhaal zijn, dan kun je er altijd voor kiezen om je foto’s extern in albums op te slaan.
Jpg of png
Of je moet kiezen voor een jpg of een png hangt af aan de type afbeelding. Jpg zijn over het algemeen kleiner qua grootte waardoor het gangbaarder is om hier voor te kiezen. Echter ontbreekt de mogelijkheid om transparantie in je afbeeldingen toe te voegen. Heb je dus een doorzichtig deel in je afbeelding kies dan voor een png, anders voor gewoon voor jpg.
Welk formaat moet een afbeelding hebben?
Het formaat van de afbeelding is afhankelijk van de plek waar hij wordt geplaatst. Gaat het om een header afbeelding is het verstandig om minimaal een breedte van 1920 pixels aan te houden. De hoogte is dan even afhankelijk van de hoogte die je op je website hanteert. Dit getal haal je uit het feit dat over het algemeen de schermresolutie 1920×1080 is. Als je een afbeelding hebt die je gehele scherm vult moet je afbeelding dus dit formaat hebben. Het is daarom belangrijk dat je jou afbeeldingen aanpast aan de grootte dat ze getoond worden op je website.
Het is verschilt dus per afbeelding hoe groot die moet zijn. Om hier duidelijkheid in te geven heb ik hieronder een aantal standaard maten voor je verzameld. Onthoud, een afbeelding kan beter iets te groot zijn dan te klein, dan wordt deze namelijk wel onduidelijk.
Uiteindelijk bepaald de grootte van de afbeelding de tijd dat het inladen kost. Daarom heb ik ook een indicatie gegeven om aan te houden als het gaat om bestandsgrootte. Wanneer je iets van de kwaliteit uit de afbeelding haalt kun je dit namelijk vaak gigantisch terugbrengen. Ik raad je daarom aan om altijd ongeveer 20% kwaliteit uit een afbeelding te halen. Soms kan het daardoor zijn dat een afbeelding van 1920×800 kleiner is dan 100kb. Dit is niet erg, controleer altijd of de kwaliteit goed is van de afbeeldingen nadat je ze hebt geüpload.
Hieronder vind je een overzicht van de grootte en de afmeting die ik aanhoudt voor mijn websites. Hier wijk ik vaak genoeg vanaf, zeker als het om pixels gaat, zijn afbeeldingen namelijk een ander formaat is het verstandig ze daarin te uploaden.
| Type: | Aantal pixels: | Grootte: |
| Header afbeelding | 1920×800 | max 500kb |
| Grootte afbeelding | 1200×800 | max 200kb |
| Normale afbeelding | 700×700 | max 100kb |
Stappenplan formaat en grootte optimaliseren afbeeldingen
Stap 1: Kies een afbeelding die je wilt gaan optimaliseren
Stap 2: Bepaal de afmeting en grootte. Dit kun je doen door met je rechtermuisknop te klikken, vervolgens klik je op eigenschappen. Is de afbeelding het juiste formaat ga naar verder naar stap 4.
Stap 3: Als het formaat niet correct is kun je hem bijsnijden tot die de juiste verhouding heeft. Zelf doe ik dit het liefst in Canva. Het aanpassen van de juiste grootte in Canva doe je zo:
Stap 3.1: Klik op ‘Maak een ontwerp’ en vervolgens op ‘Aangepaste afmetingen’. Geef hier aan hoe groot je afbeelding moet zijn.
Stap 3.2: Upload vervolgens je afbeelding en snij hem bij door links bovenin gebruik te maken van de optie ‘bijsnijden’.
Stap 3.3: Vervolgens kun je hem rechts bovenin downloaden.
Stap 4: Wanneer je de afbeelding in het juiste formaat hebt is het tijd om er iets kwaliteit uit te halen. Zelf gebruik ik daar Pixlr voor. Kwaliteit uit een afbeelding halen in Pixlr doe je zo:
Stap 4.1: Upload je afbeelding.
Stap 4.2: Klik rechtsonder op ‘save’.
Stap 4.3: Zet de ‘Quality’ op 80%.
Stap 4.4: Download de afbeelding.
De header afbeelding die ik gebruikte in het voorbeeld heb ik verkleint van 5184×3456 en 8500 kb naar 1920×800 en 170 kb. Dit maakt een gigantisch verschil voor de laadsnelheid van deze pagina.
Afbeeldingen optimaliseren voor SEO
Nu je afbeelding het juiste formaat heeft is het belangrijk te vertellen aan Google waar je afbeeldingen over gaan. Hierdoor snapt Google je afbeeldingen beter. Daarnaast zul je merken dat dit de waarde van de pagina’s ten goede komt en je met de afbeeldingen los ook vindbaar bent in Google afbeeldingen.
Je afbeeldingen optimaliseren doe je door je zoekwoorden te vermelden op drie verschillende plekken. Namelijk wanneer je hem opslaat, de alternatieve tekst en de titel van de afbeelding. Tegenwoordig heeft het onderschrift en omschrijving geen toegevoegde waarde meer.
Je moet er dus voor zorgen dat je zoekwoorden terug komen op deze drie plekken. Schrijf deze teksten omschrijvend over de afbeelding. Heb jij namelijk een afbeelding van een ezel en zet je er bij dat het om een televisie gaat komt Google hier in de loop van de tijd vanzelf achter en ga je hierdoor lager scoren.
Stappenplan voor optimaliseren van je afbeeldingen voor Google:
Stap 1: Sla je afbeelding op je pc met het zoekwoord waar je op gevonden wilt worden.
Stap 2: Upload je afbeelding naar je website.
Stap 3: Verwerk je zoekwoorden wederom in de titel en de alt-tag (alternatieve tekst).
Stap 4: Upload de afbeelding.
Wanneer je ook je afbeeldingen voor Google hebt geoptimaliseerd is je website er klaar voor om goed te scoren in de zoekresultaten en om gebruiksvriendelijk te zijn. Mocht je vragen hebben over het optimaliseren van je afbeeldingen of andere vragen neem dan gerust contact op.
