SEO optimalisatie van afbeeldingen in WordPress (in 5 stappen)

SEO optimalisatie van afbeeldingen is nog niet zo bekend bij de gemiddelde websitebezitter. Dit artikel tracht hier wat aan te doen. Als we het vroeger hadden over het “foto’s optimaliseren voor website”, dan ging het vooral over comprimeren van afbeeldingen.

Veel foto’s maken dat je website trager laadt. Dat vonden de bezoekers niet leuk en ze klikten verder. Google plaatst trage websites achteraan bij de zoekresultaten. Het is dus ontzettend belangrijk dat een website snel laadt.

Takeaways

🖼️ SEO-optimalisatie van afbeeldingen is een belangrijk, maar vaak over het hoofd gezien aspect van websitebeheer.

1️⃣ De eerste stap is het gebruik van originele foto’s in plaats van stockfoto’s. Dit trekt meer aandacht en maakt je website uniek.

🏷️ Het toevoegen van tags aan je afbeeldingen, zoals title-tags, description-tags en alt-tags, helpt Google meer te weten te komen over de afbeeldingen die je gebruikt. Dit kan je SEO-ranking verbeteren.

🔍 Visual search, waarbij mensen zoeken door een afbeelding te uploaden, wordt steeds populairder. Door je afbeeldingen te taggen, kun je profiteren van deze trend en meer verkeer naar je website trekken.

⏱️ Een snelle laadtijd is essentieel voor een goede gebruikerservaring. Het het optimaliseren van afbeeldingen voor je website om die sneller te laten laden, wat zowel je bezoekers als zoekmachines zoals Google zal plezieren.

🛠️ Als je veel afbeeldingen hebt om te taggen, kun je overwegen om een tool zoals de Bulk Updater te gebruiken. Maar let op, het is beter om handmatig relevante tags toe te voegen dan om automatisch gegenereerde tags te gebruiken.

🚀 Volg deze stappen en je website zal beter gevonden en bezocht worden!

Optimalisatie van afbeeldingen – Hoe moeten we hieraan beginnen?

Optimaliseren van afbeeldingen betekent tegenwoordig ook dat je afbeeldingen voorziet van de nodige tags net zoals je dat doet met de pagina titel en de meta description.

Dat is informatie die je via WordPress kan toevoegen aan de afbeelding. We hebben het dan over een title-tag, een description-tag en een alt-tag. Als we deze informatie toevoegen aan onze afbeeldingen beïnvloedt dat onze SEO ranking positief. Google weet zo namelijk meer over de afbeeldingen die we gebruiken. Deze informatie wordt geïndexeerd en gebruikt in hun zoekmachine.

Visual search neemt toe

Er zijn steeds meer mensen die visueel zoeken, de zogenaamde visual search. Ze uploaden dan een afbeelding van bijvoorbeeld een fiets in Google. Ze krijgen dan resultaten van afbeeldingen van fietsen, en daar kunnen ook winkels tussen zitten. Het is dus commercieel interessant om je foto’s te voorzien van de nodige informatie tags, zeker als het gaat om je producten.

Soms is het erg lastig om de juiste zoektermen te vinden voor wat je wil omschrijven. Je kunt het dan beter gewoon laten zien. Op de achtergrond heeft Google al die afbeeldingen van fietsen nauwkeurig beschreven (bijv.:kleur, type, soort fiets) en de gegevens opgeslagen in een database samen met de afbeelding. En dat willen ze doen voor alle afbeeldingen op het internet.

Het toevoegen van tags aan al je afbeeldingen op je website zorgt ervoor dat je op “afbeeldingen” als contentsoort veel beter gaat scoren. Ook mensen die visual search gebruiken, kunnen dan jouw bezoekers worden. Je zult hiermee meer traffic naar je website lokken, wat uiteindelijk de conversie, dus bezoekers omzetten in betalende klanten, positief zal beïnvloeden.

Verbetering van de laadtijd door optimalisatie van afbeeldingen

Het belang van een snelle laadtijd voor UX

Het is fantastisch dat je interesse toont in het belang van een snelle laadtijd voor de gebruikerservaring, of UX. Laten we dit eens nader bekijken.

Stel je voor, je bent op zoek naar informatie of een product op het internet. Je klikt op een link of typt een URL in, en dan… wacht je. En je blijft wachten. De website laadt maar niet. Hoe voel je je? Gefrustreerd, toch? Misschien geef je het zelfs op en ga je naar een andere website. Dit is precies waarom de laadtijd van een website zo cruciaal is voor de gebruikerservaring.

Een snelle laadtijd betekent dat je bezoekers niet hoeven te wachten om de inhoud te zien die ze willen zien. Dit is vooral belangrijk in onze huidige, snelle wereld waar alles onmiddellijk beschikbaar lijkt te zijn. Als je website snel laadt, voelen je bezoekers zich gewaardeerd en gerespecteerd. Ze zien dat je hun tijd respecteert en dat je moeite hebt gedaan om hun ervaring op je website zo soepel en aangenaam mogelijk te maken.

Bovendien, als je website snel laadt, kunnen je bezoekers gemakkelijker navigeren en vinden wat ze zoeken. Dit kan leiden tot hogere conversieratio’s, omdat tevreden bezoekers eerder geneigd zijn om actie te ondernemen, zoals een aankoop doen of zich inschrijven voor je nieuwsbrief.

Maar het gaat niet alleen om de bezoekers die al op je website zijn. Een snelle laadtijd kan ook helpen om meer bezoekers naar je website te trekken. Zoekmachines zoals Google houden rekening met de laadtijd van een website bij het bepalen van de zoekresultaten. Dus, als je website snel laadt, is het waarschijnlijker dat deze hoger in de zoekresultaten verschijnt, wat kan leiden tot meer verkeer naar je website.

Kortom, een snelle laadtijd is essentieel voor een goede gebruikerservaring. Het houdt je bezoekers tevreden, helpt je om meer bezoekers aan te trekken en kan zelfs leiden tot hogere conversieratio’s. Dus, als je de UX van je website wilt verbeteren, is het optimaliseren van de laadtijd een geweldige plek om te beginnen.

Alle tags ineens aanpassen met Bulk Updater?

Nu zie ik je al denken. “Maar ik heb inmiddels tientallen blogs en artikelen op mijn website staan. Ik heb misschien wel honderden afbeeldingen gebruikt. Als ik nu achteraf alle afbeeldingen moet gaan ‘taggen’ kost me dat dagen werk!”

In zo’n geval kun je gebruik maken van een tool die de optimalisatie van afbeeldingen automatisch doet. Zoals de Bulk Updater. Deze plug-in zet echter bij alle tags zoals alt-tag, alt-description , title-tag de bestandsnaam als tag tekst. Dit gaat automatisch en snel.

Is dit wat je wilt? Je zult zien dat er betere manieren zijn om de SEO optimalisatie van afbeeldingen te regelen voor je WordPress website.

In dit artikel geven we je 5 tips mee hoe je de afbeeldingen het best kunt optimaliseren. Volg de stappen en je website zal beter gevonden en bezocht worden.

Stap 1. Gebruik originele foto’s en zo weinig mogelijk stockfoto’s

Originele foto’s trekken de aandacht

Een punt van aandacht bij de optimalisatie van afbeeldingen is het gebruik van stockfoto’s op je website. Niets is zo makkelijk als gebruik te maken van websites met stockfoto’s, vaak gratis te gebruiken zoals bij Pixabay. Het is niet erg om dit af en toe te doen maar overdrijf niet. Zorg er wel dat de foto iets aan je verhaal toevoegt. Een afbeelding moet in principe altijd functioneel zijn.

Dat gezegd zijnde, is het toch beter om je zelfgemaakte foto’s te gebruiken. Google is namelijk vooral op zoek naar originele content. Websites die veel rijke en originele content weten te bieden komen bovenaan in de ranking te staan.

Stockfoto’s zijn geen originele content. Op honderden websites komen we vaak dezelfde foto’s tegen. Wie kent niet de glimlachende reclamevrouw met de telefoon in de hand, bij de rubriek “contact” opnemen. Sommige sites gaan zelfs zover dat ze een stockfoto als teamfoto gebruiken. De reden maakt niet uit, maar als de klant hierachter komt zal hij toch zijn wenkbrauwen fronzen. De betrouwbaarheid van je bedrijf is in dit geval in het geding.

“gebruik niet teveel stockfoto’s”

Onthoud dat stockfoto’s wel gebruikt mogen worden, maar dat je hiermee niet moet overdrijven. Je zult qua SEO niet kunnen scoren met deze stockfoto’s, maar je wordt nog niet bestraft door Google als je ze gebruikt. Dat zou ook niet eerlijk zijn, omdat ze op bijna alle websites gebruikt worden.

Als je echter een goede zelfgemaakte foto hebt, geef dan hier de voorkeur aan. Je kunt hem gebruiken om die pagina beter te laten scoren in de zoekmachines door er de juiste tags aan toe te voegen. Hierover later meer.

Optimalisatie van afbeeldingen : opgepast voor fotocredits

Voor foto’s kan je dus eerst bepalen of je een stockfoto wilt gebruiken of een foto die je zelf hebt gemaakt. Als je een afbeelding zonder watermerk wilt gebruiken, moet je een afbeelding kiezen met een Creative Commons-licentie. Vervolgens moet je ervoor zorgen dat de eigenaar van de afbeeldingen de machtigingen niet intrekt. Als de fotograaf je toestaat om hun afbeeldingen te gebruiken, kun je ze “crediteren”.

Als je dan toch met stockfoto’s gaat werken, kan je voor gratis foto’s altijd terecht bij Pexels of Unsplash.

Maar dus altijd goed in het oog houden welke rechten je hebt en eventeel welke vermeldingen je moet gebruiken bij bepaalde foto’s. En dat wordt dus ook gecontroleerd door bepaalde zoekrobots en als je een inbreuk pleegt, dan kan je daarvoor een boete krijgen.

Ook zoekmachines zoals Google indexeren afbeeldingen meestal ook op hun auteursrechtelijke status, dus als u zonder toestemming een auteursrechtelijk beschermde afbeelding plaatst, kunt u een boete krijgen.

Stap 2. Voeg je foto’s toe in je xml sitemap

Elke WordPress website heeft een standaard sitemap. Dit is een overzicht van de hele website waarbij de hele pagina structuur wordt weergegeven. We kunnen de afbeeldingen ook toevoegen aan dit overzicht. Dit maakt het voor de robots van Google makkelijker om je website te doorgronden. Het resultaat is dat meer gegevens van je website goed door Google geïndexeerd kunnen worden, wat alleen maar gunstig is voor de zoekresultaten.

Help robots van Google om je website te doorgronden

Je kunt in WordPress een vinkje aanzetten om XML image sitemaps te activeren. Dit gaat om standaard afbeeldingen, galerij afbeeldingen, en zelfs WooCommerce afbeeldingen van producten.

De meeste SEO plugins ondersteunen standaard deze functionaliteit.

Stap 3. Afbeeldingsnaam moet beschrijvend en duidelijk zijn!

Erg belangrijk bij de optimalisatie van afbeeldingen is de bestandsnaam. Als je de SEO score van je website wilt verbeteren, moet je aandacht besteden aan de naamgeving van afbeeldingen. Het klopt dat een bezoeker hier niets van ziet, maar de robotjes van Google wel! Die doorzoeken je hele website. De teksten en ook de afbeeldingen worden geanalyseerd, om de waarde van jouw content te kunnen bepalen. Aan de hand van gegevens die op je site staan probeert Google te achterhalen wat er op de afbeeldingen staat.

Voorbeeld: Stel dat je een tekst hebt geschreven over de binnenstad van Antwerpen, dan kun je een afbeelding de volgende naam meegeven:

“DSC2351.jpg” een dergelijke omschrijving zal Google niets vertellen over de foto.

veel beter zou zijn: “Stadhuis-Antwerpen-met-marktplein”.jpg

Zorg ervoor dat de titel van je afbeelding beschrijvend is. Daarnaast moet de naam zo kort mogelijk gehouden worden. Een uitgebreidere beschrijving kun je kwijt bij de alt-tag en de description tag.

Wanneer u werkt aan website-optimalisatie, is de bestandsnaam die u kiest voor uw afbeeldingen belangrijk. Dat komt omdat de zoekbots van Google alle inhoud op uw site indexeren, inclusief uw afbeeldingen. Als u wilt dat uw site een goede SEO-score heeft, is het belangrijk om bestandsnamen te kiezen die relevant zijn voor de afbeelding en wat deze laat zien. Als u bijvoorbeeld een afbeelding van een hond heeft, wilt u misschien het woord “hond” in de bestandsnaam opnemen.

Stap 4 : Optimalisatie van afbeeldingen: Gebruik de alt- en title-tag

De “alt” tag

Deze tip voor de optimalisatie van afbeeldingen gaat wat verder in op het gebruik van tags. Een alt-tag of alternatieve tekst tag kun je toevoegen aan een afbeelding. Vroeger was deze tekst bedoelt voor blinden of slechtzienden. Tegenwoordig ook voor mensen die surfen zonder afbeeldingen.

Alt-tags spelen een rol bij de SEO van je artikel. Hoe meer informatie Google kan vinden over afbeeldingen in je artikel hoe beter. Deze informatie wordt meegenomen in de zoekresultatenscore.

De zoekmachine kan nu de relevantste resultaten het eerst presenteren bij een zoekopdracht. Geef een afbeelding daarom altijd een goede alt-tekst mee, en wie weet wordt jij straks gevonden op je afbeeldingen en niet op basis van je teksten! Maakt ook niet uit, zolang je maar gevonden wordt. Laat deze kans niet liggen.

Houd rekening met:

• De alt-tag moet beschrijvend zijn en nuttig. Vermeld alleen zaken die belangrijk zijn om de afbeelding te begrijpen. Wat zou jij willen dat een blinde te weten komt over deze afbeelding?
• Houd de alt-tag kort. Beschrijf kort en bondig. Houd voor jezelf 125 leestekens aan als het maximum.
• Goed voor je SEO waarde: gebruik je focus keyword(s) ook in de Alt-tag. De relevantie van de afbeelding gaat met sprongen omhoog. Overdrijf niet want dat wordt keyword-stuffing genoemd, en Google apprecieert dit niet.
• Schrijf je alt-tag met de bezoeker in het achterhoofd, niet voor je SEO score. Dat gebeurt toch wel als je de stappen in dit artikel goed uitvoert. Zorg ervoor dat je alt-tags relevant zijn en goed beschrijven wat er op de afbeelding staat.

De “title” tag

Dan hebben we ook nog de title-tag. Ook deze tag houd je best kort. Als je over de afbeelding gaat met de muis laten sommige browsers de title-tag zien als een soort tooltip tekst. Veel websites zetten bij de title-tag gewoon een kopie is van de alt-tag. Dat kun je natuurlijk ook anders doen! Wellicht is ook dit een kans om nog wat keywords rond te strooien.

Er zijn echter wat problemen met de manier waarop sommige browsers deze informatie interpreteren. Sommige designers gebruiken daarom de title-tag minder en minder. Als de informatie écht belangrijk is zet die in je artikel. Dat is de regel.

Hoe zet je tekst onder een afbeelding in WordPress

Bijschriften of captions zijn korte tekstbeschrijvingen die je aan je afbeeldingen kunt toevoegen. Ze worden meestal gebruikt om extra details over een afbeelding te geven. WordPress heeft de ingebouwde mogelijkheid om voor elke afbeelding gemakkelijk een bijschrift maar ook andere metadata, waaronder titel en alternatieve tekst, toe te voegen.

Als de bijschriften op de juiste manier gebruikt worden, maken ze je inhoud boeiender, geven ze belangrijke informatie door aan je bezoekers, en verbeteren ze de algemene SEO van je site. (ook wel user experience genoemd)

Stap 5. Compressie van afbeeldingen

Technische gids voor afbeeldingscompressie en SEO prestaties

Het comprimeren van afbeeldingen is een cruciale stap in het optimaliseren van je website voor SEO. Dit proces vermindert de bestandsgrootte van je afbeeldingen zonder dat dit ten koste gaat van de zichtbare kwaliteit, waardoor je pagina’s sneller laden. Snellere laadtijden verbeteren de gebruikerservaring en kunnen je SEO-ranking verhogen, zoals uitgelegd door Google.

Er zijn verschillende tools en plugins beschikbaar die je kunnen helpen bij het comprimeren van afbeeldingen. Enkele populaire opties zijn TinyPNG, Smush en ShortPixel. Deze tools werken door onnodige metadata uit je afbeeldingen te verwijderen en door de afbeeldingen te comprimeren tot een kleiner formaat.

Het is belangrijk om te weten dat er twee soorten compressie zijn: lossless en lossy. Lossless compressie vermindert de bestandsgrootte zonder de kwaliteit te verminderen, terwijl lossy compressie de bestandsgrootte vermindert door enige kwaliteit op te offeren. Voor de meeste websites is lossy compressie voldoende en zal het een aanzienlijke verbetering van de laadtijd opleveren, zoals uitgelegd door Kinsta.

Bij het comprimeren van afbeeldingen is het ook belangrijk om het juiste bestandstype te kiezen. JPEG is een goed formaat voor foto’s en afbeeldingen met veel kleuren, terwijl PNG beter is voor afbeeldingen met transparantie en minder kleuren, zoals beschreven door Adobe.

Het comprimeren van je afbeeldingen is een relatief eenvoudige stap die een grote impact kan hebben op de snelheid en prestaties van je website. Door deze stap te nemen, kun je de gebruikerservaring verbeteren, je SEO-ranking verhogen en uiteindelijk meer verkeer naar je website trekken.

Compressie afbeeldingen met WordPress plugins

Zoals we al zagen is het belangrijk voor je website dat die snel geladen wordt. Te grote afbeeldingen vormen de belangrijkste reden dat een website traag is met laden. Vooral als je website bekeken wordt op een smartphone met een slechte 4G verbinding, kan het gebruik van “zware” afbeeldingen leiden tot een trage website en daardoor een hoge “bounce rate”. Je kan zowel de snelheid van je website als bounce rates bekijken via een gratis account bij Googe Analytics.

Daar kun je gelukkig zelf iets aan doen. Door de afbeeldingen kleiner te maken in omvang (aantal MB’s). Een website die snel laadt is gunstig voor je SEO score. En zeker als sinds Google in 2021 op de proppen kwam met de “Core Web Vitals”, is laadsnelheid snelheid één van de belangrijkste ranking factoren omdat het juist zo’n grote invloed heeft op de gebruikerservaring.

Je kunt natuurlijk één voor één alle afbeeldingen comprimeren naar het juiste formaat. Vaak verliest je afbeelding daarbij aan kwaliteit. Vroeger kon dat niet anders, maar dat willen we natuurlijk niet. Gelukkig heeft WordPress kant en klare plug-ins klaar staan om dit lastige karwei van jouw over te nemen. We stellen er eentje voor, gratis en waarschijnlijk meteen de beste: de Smush WordPress plugin.

Wat kun je er allemaal mee:

• Comprimeren zonder kwaliteitsverlies!
• Bulk Smush: optimaliseer comprimeer en verklein tot 50 afbeeldingen met één muisklik
• Voor de afbeeldingen die je aan het optimaliseren bent kun je afbeelding omvang instellen. Alle afbeeldingen worden dan verwerkt naar deze ingestelde waarden. Handig toch?
• Als er ergens op je website nog een te grote afbeelding staat kan deze tool die detecteren en aanpassen.
• Converteren van afbeeldingen naar het moderne WebP formaat (enkel voor betalende gebruikers)
• Lazy loading van images (de afbeeldingen worden één voor één pas getoond nadat de teksten vand e website al geladen zijn)
• Je kan ook starten met CDN of een content delivery network. Is een vrij technisch concept maar zeker voor grotere (internationale) sites kan dit helpen om je afbeeldingen sneller te tonen in de browser van je bezoeker.

Op de WordPress website is te lezen dat de overgrote meerderheid deze plug-in waardeert met de hoogste score! Het is een populair hulpmiddel dat niet mag ontbreken bij jouw tools om de afbeeldingen op je website grondig aan te pakken en je SEO te verbeteren.

Andere WordPress plugins om je afbeeldingen te comprimeren

Andere degelijke plugins om min of meer hetzelfde te bereiken, is ewww image optimizer, Shortpixel, ReSmush.it,

EWWW Image Optimizer

ShortPixel Image Optimizer – Optimize Images, Convert WebP & AVIF

reSmush.it : The original free image compressor and optimizer plugin

Voordelen en nadelen van verschillende bestandsformaten

Verschillende bestandsformaten hebben elk hun eigen voordelen en nadelen, en het is belangrijk om deze te begrijpen om de juiste keuze te maken voor je specifieke behoeften.

Laten we beginnen met JPEG. Dit formaat is ideaal voor foto’s vanwege de lossy compressie, die de bestandsgrootte vermindert zonder een merkbare vermindering van de kwaliteit. Echter, het is niet geschikt voor afbeeldingen met veel tekst of scherpe lijnen, omdat deze kunnen vervagen.

PNG, aan de andere kant, is perfect voor afbeeldingen met tekst of scherpe lijnen, omdat het lossless compressie gebruikt. Dit betekent dat er geen kwaliteitsverlies is bij het comprimeren. Het nadeel is dat PNG-bestanden groter zijn dan JPEG-bestanden, wat een probleem kan zijn voor de laadtijd van je website. PNG bestanden kunnen ook een transparante achtergrond hebben.

GIF is een ander populair formaat, vooral voor geanimeerde afbeeldingen. Het ondersteunt echter slechts een beperkt aantal kleuren, dus het is niet ideaal voor foto’s.

Ten slotte is er nog het WebP-formaat, dat zowel lossy als lossless compressie ondersteunt en kleiner is dan zowel JPEG als PNG. Het nadeel is dat het niet door alle browsers wordt ondersteund.

Kortom, het kiezen van het juiste bestandsformaat hangt af van je specifieke behoeften. Het is belangrijk om de voordelen en nadelen van elk formaat te begrijpen om de beste keuze te maken voor je website.

Wat is lossy compressie en wanneer deze te gebruiken

Lossy compressie is een methode voor gegevenscompressie waarbij een deel van de gegevens wordt verwijderd om de bestandsgrootte te verkleinen. Dit betekent dat wanneer het gecomprimeerde bestand wordt gedecodeerd, het niet precies hetzelfde is als het origineel. Er is wat informatie verloren gegaan tijdens het compressieproces, vandaar de term ‘lossy’.

Deze methode wordt vaak gebruikt bij het comprimeren van afbeeldingen, video’s en audio. Bijvoorbeeld, JPEG is een populair beeldformaat dat lossy compressie gebruikt. Het verwijdert details die het menselijk oog waarschijnlijk niet zal opmerken, waardoor de bestandsgrootte aanzienlijk wordt verminderd zonder een merkbare vermindering van de kwaliteit.

Lossy compressie is vooral nuttig wanneer je te maken hebt met grote bestanden en de bestandsgrootte een probleem is, zoals bij het uploaden naar het web of het verzenden via e-mail. Het is ook nuttig wanneer opslagruimte beperkt is, zoals op mobiele apparaten. Echter, het is belangrijk om te onthouden dat lossy compressie niet ideaal is voor situaties waarin elke bit van gegevens belangrijk is, zoals bij sommige soorten wetenschappelijke of medische beeldvorming.

De website tinypng is ideaal om je afbeeldingen te comprimeren en te verkleinen.

FAQ