Afbeeldingen SEO: Optimaliseer je afbeeldingen voor Google Images

Stel, je bent bezig je website te optimaliseren, of misschien wel de website van het bedrijf waar je (voor) werkt. Grote kans dat je veel bezig bent met het verbeteren van de content op de website. Je zorgt bijvoorbeeld voor een goede zoekterm focus in de teksten en voegt relevant beeldmateriaal toe. Daarnaast kijk je misschien wel naar technische aanbevelingen in diverse tools om de snelheid en usability te verbeteren en niet te vergeten: de in- en externe links.

Top, dat is allemaal nuttig en belangrijk! Maar het is ook slim je zo nu en dan te focussen op een specifiek onderdeel binnen de website en daarin een goede optimalisatieslag te maken. Denk bijvoorbeeld aan de afbeeldingen op de website. Misschien heb je al wel gehoord van het concept ‘seo images’ en voeg je al structureel alt-tags toe of comprimeer je standaard de afbeeldingen die je op de site plaatst. Er zijn echter nog veel meer andere zaken die je kunt doen om je website veel beter zichtbaar te maken binnen de zoekresultaten en dan vooral ook binnen Google Afbeeldingen met behulp van SEO.

Hieronder zet ik een aantal praktische tips op het gebied van afbeeldingen seo voor je op een rij:

Zorg ervoor dat Google je afbeeldingen optimaal kan crawlen

1. Bestandsformaat:
Afbeeldingen kunnen in tal van bestandsformaten op je computer worden opgeslagen. De meeste webbrowsers, maar ook zoekmachines, kunnen niet met alle bestandsformaten overweg. Zelf werk ik het liefst met JPEG/JPG- of PNG-afbeeldingen als het gaat om foto’s. Deze kun je namelijk in veel (gratis) programma’s bewerken en zijn met diverse tools ook eenvoudig te comprimeren. PNG heeft dan nog als voordeel boven JPG dat je kunt werken met een transparante achtergrond. Een nieuwer format dat Google ook adviseert is WebP.

Wanneer je een logo of illustratie op je pagina of website wilt gebruiken, overweeg dan het SVG formaat. Dit bestandsformaat is namelijk specifiek geschikt voor lijntekeningen, logo’s of illustraties met relatief eenvoudige kleurinformatie in vergelijking met foto’s. Een SVG bestand neemt dan ook weinig opslagruimte in, maar kun je ver mogelijk uitvergroten als je wilt, zonder kwaliteitsverlies. Ideaal voor drukwerk, maar ook voor websites!

2. Neem afbeeldingen op in de sitemap:
Google is heel goed in staat om zelf afbeeldingen te ontdekken tussen al je website content, maar je kunt Google hierbij toch een extra handje helpen. Dit kun je doen door afbeeldingen apart in je sitemap op te nemen. Zeker als je een grotere website met veel afbeeldingen op iedere pagina beheert, dan is dit zeker de moeite waard. Google omschrijft hier precies waar een ‘image sitemap’ aan moet voldoen.

Afbeelding 1: voorbeeld van 2 afbeeldingen op dezelfde pagina verwerkt in de sitemap.

3. HTML in plaats van CSS
Afbeeldingen die bij de inhoudelijke content op de pagina horen (daarmee bedoel ik dus niet de huisstijl afbeeldingen die bij het design of lay-out van de website horen), kunnen het beste rechtstreeks in de HTML opgenomen worden en niet als een background van een bepaald blok of <div> element door middel van de CSS opmaak. Je wilt namelijk dat deze afbeelding gewoon met de content op de specifieke pagina wordt gecrawld door zoekmachines.

Als je een pagina opmaakt via de HTML code moet de afbeelding idealiter met het <img> element worden aangeroepen. De bekendste CMS systemen, zoals WordPress of Drupal, gebruiken standaard ook dit <img> element in de HTML code als een afbeelding via de visuele editor vanuit de mediabibliotheek wordt ingevoegd op een pagina.

Afbeelding 2: reguliere implementatie van een afbeelding versus een background afbeelding.

Zorg ervoor dat Google je afbeeldingen begrijpt

4. Optimaliseer de bestandsnaam
Google kijkt ook naar de bestandsnaam van een afbeelding om daar mogelijk het onderwerp van de afbeelding uit af te leiden. Het helpt daarom om je afbeeldingen een goede beschrijvende bestandsnaam te geven, het liefst met een relevante zoekterm en de intentie die aansluit bij de afbeelding zelf en de pagina. Dus geen “afbeelding_1.jpg”, maar bijvoorbeeld “Tweedehands-boekenkasten-showroom-Arnhem.jpg”. Maak de bestandsnaam ook niet te lang. Het heeft geen zin om bestandsnamen vol te zetten met allerlei aanverwante zoektermen. Drie tot vijf woorden is een goede richtlijn.

Het heeft geen zin om bestandsnamen vol te zetten met allerlei aanverwante zoektermen.

Daarnaast kun je ook handig gebruikmaken van een goed doordachte mappenstructuur voor de fysieke locatie van afbeeldingen op de server. Dit is natuurlijk alleen toepasbaar als je zelf ook de mogelijkheid hebt om hier wijzigingen in aan te brengen. Zo zou je de afbeelding in het hiervoor genoemde voorbeeld ook als volgt kunnen indelen en benoemen: (jewebsite.nl)/afbeeldingen/showroom-arnhem/tweedehands-boekenkasten.jpg.

5. Gebruik alt-teksten
Wanneer je essentiële informatie als tekst in je afbeelding opneemt, kan Google dit niet lezen. Dat moet je dus voorkomen. Je moet ervoor zorgen dat alles wat je als tekst wilt laten interpreteren door Google voor de indexatie van je website, opneemt in de html van de betreffende pagina. Bij afbeeldingen kun je daarom ook een zogenoemde alt-tekst opgeven. Dit is een stukje tekst dat je als eigenschap (in de visuele pagina editor) ofwel als extra attribuut in het <img> element van de betreffende afbeelding in de html code opneemt. Gebruik deze alt-tekst om zo concreet en bondig mogelijk te benoemen waar de afbeelding over gaat, door bij voorkeur er een relevante zoekterm in te verwerken.

6. Structured data
Een afbeelding omschrijven is één ding, maar met structured data kun je nog een stapje verder gaan. Hiermee kun je bepaalde informatie of afbeeldingen echt labelen als een specifiek ‘ding’. Dit helpt zoekmachines nog beter te interpreteren wat de getoonde informatie op een pagina precies is.

Hoewel sommige CMS systemen opties of een plugin bieden om structured data aan de website toe te voegen, ben je nog vaak aangewezen op je HTML skills om deze opmaak op de juiste manier toe te passen. Google geeft zelf aan de volgende structured data voor afbeeldingen te ondersteunen.

• Product
• Video
• Recept

Dus als je afbeelding om een specifiek product, een video of een recept gaat, dan is het zeker de moeite waard om deze van structured data te voorzien.

Zorg voor relevantie en context

7. Context
Een goede webpagina bevat altijd een mix van tekst en beeld. Deze elementen versterken elkaar. Helemaal wanneer je ervoor zorgt dat de afbeeldingen die je toevoegt aan je webpagina niet alleen relevant zijn, maar ook zo dicht mogelijk bij het meest relevante stuk tekst op de pagina geplaatst worden.

Het is vele malen beter als je zelf de foto’s maakt of laat maken.

8. Unieke & goede afbeeldingen
Je bent je er waarschijnlijk al van bewust dat een webpagina inhoudelijk uniek moet zijn als je wilt dat deze pagina een kans maakt in de zoekresultaten. Het helpt daarom ook om ervoor te zorgen dat je zoveel mogelijk gebruik maakt van origineel beeldmateriaal. Het is natuurlijk heel eenvoudig om gebruik te maken van een rechtenvrije stockfoto, maar het is vele malen beter als je zelf de foto’s maakt of laat maken.

Daarnaast is het belangrijk dat je foto van goede kwaliteit is. Dus scherp, duidelijk en het liefst ook mooi, want het oog van de websitebezoeker wil natuurlijk ook wat!

9. Paginatitel en meta description
Meestal maak je op basis van de content op je pagina een relevante paginatitel en meta description. Dat is mijn ogen de juiste volgorde. Het kan alleen geen kwaad om eens goed te kijken of je afbeeldingen ook goed aansluiten bij de paginatitel en meta description van de pagina waar deze op staan. Zeker als je ook graag meer zichtbaar wil zijn binnen Google Afbeeldingen. Deze informatie gebruikt Google namelijk ook om de inhoud van een afbeelding te achterhalen.
Dit geeft maar al te goed aan dat het belangrijk is om altijd voor een duidelijk afgebakende zoektermfocus per pagina te gaan en onderwerpen die te sterk afwijken, op een andere aparte pagina te behandelen.

Zorg voor een optimale gebruikerservaring

10. Snelheid
Afbeeldingen zijn naast allerlei scripts die op een pagina worden ingeladen regelmatig een oorzaak van een traag aanvoelende website. Dit komt de gebruikerservaring niet ten goede en dat kan gevolgen hebben voor je positie in zoekmachines. Daarom adviseer ik altijd om je afbeeldingen zoveel mogelijk te comprimeren. Hoe je dat doet? Dat vertel ik in mijn video: 3 manieren om foto’s op jouw website te verkleinen.

11. Afmetingen
Vaak worden afbeeldingen in originele grootte aan een pagina toegevoegd. Bij de meeste website schaalt de afbeelding automatisch naar de beschikbare ruimte. Dat is superhandig uiteraard, maar toch kan het nadelig zijn voor de gebruikerservaring.

Probeer afbeeldingen zoveel mogelijk te comprimeren.

Als een afbeelding zich schaalt naar de beschikbare ruimte bij het inladen van de betreffende webpagina, is de kans groot dat bepaalde content op de pagina nog verspringt terwijl een gebruiker al de eerste interactie met de pagina wil aangaan. Dit kan diegene als hinderlijk ervaren. Daarnaast moet de browser nog een extra berekening doen tijdens het laden van een pagina, terwijl de browser met veel dingen tegelijk bezig is.

Dit kun je voorkomen door enerzijds een afbeelding die je wilt gebruiken meteen al in de juiste afmeting te schalen en deze dan pas te uploaden naar je website. Anderzijds kun je ook specifiek de dimensies per afbeelding opgeven om ervoor te zorgen dat er in de lay-out van je webpagina al de correcte ruimte wordt gereserveerd. Dat voorkomt irritante verspringingen na het inladen van de pagina, zorgt voor een betere CLS score als het gaat om site vitaliteit en dat is weer gunstig voor de vindbaarheid van je content.

Afbeelding 3: HTML van een afbeelding geïmplementeerd op een pagina met alt-tekst en dimensies.

Veel mogelijkheden

Zoals je ziet zijn er tal van mogelijkheden om in het kader van SEO afbeeldingen op je website te optimaliseren. Met alles wat je op dit gebied doet, wil je enerzijds dat je de tekstuele content verrijkt met relevant beeldmateriaal en daarmee de zichtbaarheid in de universele zoekresultaten verbeterd. Anderzijds werk je ook aan een betere zichtbaarheid binnen de resultaten van Google Afbeeldingen.

Er zijn daarnaast ook nog verdergaande stappen die je kunt nemen, die ik niet in dit artikel heb meegenomen. Een voorbeeld daarvan is hosten van afbeeldingen via een Content Distribution Network (CDN). In mijn optiek is dit een oplossing die meer geschikt is voor grotere internationale websites. Mocht je meer willen weten hierover of heb je specifieke vragen over afbeeldingen SEO. Laat het gerust weten