Een beeld zegt meer dan duizend woorden. Een veel gehoord gezegde en ook op het internet is niets minder waar. Toch zie ik nog erg veel websites voorbij komen met enorme lappen tekst en zonder mooie afbeeldingen. Afbeeldingen kunnen niet alleen de aandacht van een bezoeker trekken, ze kunnen soms ook een verhaal beter vertellen dan een lap tekst dat doet. In dit artikel ga ik het hebben over drie aspecten van afbeeldingen die je positie in Google kunnen verbeteren.

Maak je pagina’s aantrekkelijker met afbeeldingen

In de inleiding gaf ik al aan dat afbeeldingen soms meer kunnen vertellen dan lappen tekst. Op het internet lezen bezoekers maar weinig van je teksten, zij scannen je pagina’s en wanneer iets hun aandacht weet vast te houden zijn zij eventueel bereid om teksten te lezen.

Door op de juiste plekken mooie, aandachttrekkende afbeeldingen te gebruiken kun je er dus voor zorgen dat het scannen daar even wordt onderbroken om toch een tekst te lezen.

Bedenk zelf maar eens hoe je Facebook gebruikt op je mobiele telefoon. De kans is groot dat je zo’n 90% van de tijd met je duim door je feed scrolled en wanneer iets je aandacht weet te pakken, meestal een afbeelding of video, stop je daar even met scrollen om na het bekijken van de afbeelding of video, weer verder te scrollen.

Waar plaats je afbeeldingen?

Het is dus belangrijk om afbeeldingen te gebruiken op je website maar waar plaats je deze afbeeldingen? Waar je afbeeldingen plaatst is afhankelijk van de rest van de opmaak van je website. Maar wanneer je bijvoorbeeld een artikel op je blog publiceert doe je er goed aan om zogenaamd de tekst te breken. Dit kun je bijvoorbeeld doen door een afbeelding naast een blok tekst te plaatsen in plaats van er boven of er onder.

Wanneer een afbeelding als versterker van een tekst dient, plaats je de afbeelding natuurlijk boven, onder of naast deze betreffende tekst.

Al met al kunnen afbeeldingen voor aantrekkelijkere pagina’s zorgen, dit zorgt ervoor dat jouw pagina’s meer in de smaak zullen vallen bij bezoekers wat er uiteindelijk weer voor zorgt dat je hoger zult ranken in Google.

Wat voor afbeeldingen moet ik gebruiken?

We hebben vandaag de dag veel meer beeldmateriaal dan alleen foto’s maar toch gaan de meeste mensen uit van foto’s wanneer ik het heb over afbeeldingen gebruiken op je website.

Je zou bijvoorbeeld ook eens kunnen kijken naar illustraties. Zelf ben ik een groot fan van illustraties aangezien je hiermee meer bewerkingsmogelijkheden hebt dan foto’s (of je moet natuurlijk een pro Photoshopper zijn).

Naast illustraties heb je ook nog infographics, infographics vind ik helemaal geweldig. Infographics zijn een combinatie van illustraties en tekst. Het mooie van deze combinatie is dat de illustraties zorgen voor een speels effect terwijl de tekst alsnog een serieuze zaak kan vertellen. Op Pinterest kun je mijn bord met infographics volgen.

Naast illustraties en infographics heb je bijvoorbeeld ook nog GIF. GIF staat voor Graphic Interchange Format en is als het ware een bewegende foto. Ik hoor je denken: “Dat is toch video?” – Klopt. Maar het verschil tussen video en GIF is onder andere de kwaliteit en de lengte. Daarnaast speelt een GIF automatisch in loop af, wat wil zeggen dat hij nadat hij afgelopen is, opnieuw weer begint.


via GIPHY

Waar vind ik foto’s voor op mijn website?

Foto’s voor op je website zou ik altijd proberen zoveel mogelijk zelf te maken. Foto’s voor op je blog vallen daar in principe onder maar ik kan me voorstellen dat je deze mogelijkheid niet hebt. Stockphoto’s zijn dan een goed alternatief. Stockphoto’s zijn foto’s die zijn gemaakt door fotografen die zij vervolgens op een verzamelwebsite plaatsen waar jij de foto’s tegen een bepaalde vergoeding kunt kopen.

Hoeveel zo’n stockphoto kost is per foto verschillend. Vrijwel de bekendste stockphoto website is istockphoto.com.

Gratis stockphoto’s voor op je website

Er zijn ook een aantal websites met gratis stockphoto’s. Deze foto’s mag je dus gewoon gebruiken op jouw website of bijvoorbeeld in social media campagnes. Zelf maak ik nog wel eens gebruik van de gratis stockphoto’s van unsplash.com

Waar vind ik illustraties voor op mijn website?

De laatste tijd probeer ik zoveel mogelijk illustraties zelf te maken in de macOS applicatie Sketch. Maar ik maak ook nog vrij vaak gebruik van de illustraties van freepik.com. Freepik is vergelijkbaar met istockphoto maar het verschil is dat freepik.com zich vrijwel alleen richt op illustraties en iconen.

freepik.com biedt zowel gratis als premium afbeeldingen aan. De gratis afbeeldingen mag je gebruiken wanneer je credits plaatst naar de betreffende designer en freepik.com.

Voor de cover van mijn Yoast SEO Plugin Handleiding heb ik gebruik gemaakt van een gratis Freepik illustratie welke ik zelf in Sketch heb aangepast.

Waar vind ik infographics voor op mijn website?

Infographics bekijk ik dus vaak op Pinterest en sla ik op, op mijn bord Infographics. Af en toe deel ik er een via Twitter, Facebook of mijn blog.

Wanneer je zelf een Infographic wil maken maar niet genoeg kennis hebt van applicaties als Sketch, Illustrator en/of Photoshop moet je zeker eens naar Piktochart.com kijken. Met deze online dienst kun je vrij eenvoudig zelf een infographic maken.

Afbeeldingen zoekmachine vriendelijk plaatsen

Nu we het hebben gehad over de voordelen van afbeeldingen, de soorten afbeeldingen en waar je deze kunt vinden of maken is het volgende onderdeel aan de beurt. Dit onderdeel is minstens zo belangrijk.

Wat veel website-beheerders en eigenaren vergeten is dat het belangrijk is hoe zij een afbeelding op hun website zetten.

Zoals je misschien weet heeft Google meerdere soorten zoekmachines. Google Search is bij uitstek de grootste maar daarnaast hebben zij bijvoorbeeld YouTube voor video’s, GoogleMaps voor locaties en Google Images voor afbeeldingen. Hoogstwaarschijnlijk heb je deze allemaal al wel eens gebruikt.

Maar wist je ook dat het mogelijk was om je afbeeldingen te optimaliseren voor Google Images? Elke afbeelding die je upload naar je WordPress mediabibliotheek kun je daar een titel, onderschrift, Alt-tekst en omschrijving invoeren.

Bestandsnaam

Maar eigenlijk zijn we dan al een stapje te laat, de naam die jij je afbeelding geeft op jouw lokale opslag (jouw computer) is ook al van belang! Zorg dus dat je foto’s niet de naam IMG_0242 of iets dergelijks laat houden. In plaats daarvan doe je er goed aan om een beschrijvende bestandsnaam mee te geven aan je afbeelding voor je ‘m upload naar je mediabibliotheek.

Titel

Wanneer de afbeelding eenmaal naar je WordPress mediabibliotheek is geüpload geef je de afbeelding ook een beschrijvende titel. Dit mag dezelfde tekst zijn als de bestandsnaam.

Onderschrift

Het onderschrift is optioneel. Afhankelijk van je instellingen verschijnt de tekst die je hier invoert onder de betreffende afbeelding wanneer je deze op je website gebruikt. Logischerwijs doe je er goed aan om hier bijvoorbeeld een beschrijvende tekst in te voeren.

ALT-tekst

De ALT-tekst is belangrijk wanneer je goed gevonden wil worden in Google Images. De ALT-tekst is namelijk de tekst die Google indexeert wanneer het een zoekopdracht krijgt in Google Images. Er zijn maar weinig mensen die een ALT-tekst invoeren en wanneer mensen wel een ALT-tekst invoeren zie ik nog vaak gebeuren dat zij hier dezelfde tekst invoeren als bij de titel.

Je moet het echter zo zien dat de ALT-tekst een beschrijving zou moeten zijn waarmee je iemand die de afbeelding niet kan zien, een beschrijving krijgt van de afbeelding.

In plaats van ‘voetbalveld’ of ‘voetballen’ zou je deze foto dus een ALT-tekst mee kunnen geven als “Foto van voetballende jongens en mannen in de vorm van een training met tribunes op de achtergrond”

Omschrijving

De omschrijving die je hier kunt invoeren is niet zichtbaar op de voorkant van je website. Het is meer als geheugensteun voor jezelf. Ik laat dit veld vrijwel altijd leeg.

Afbeeldingen zoekmachine vriendelijk maken

Nu we het hebben gehad over de belangrijke onderdelen als soorten afbeeldingen en hoe je deze zoekmachine vriendelijk kunt plaatsen hebben we nog een heel belangrijk onderdeel over. Namelijk het zoekmachine vriendelijk maken van afbeeldingen.

Vandaag de dag hebben we allemaal geweldige mobiele telefoons die met een hoge resolutie foto’s en video’s kunnen maken. Dit zorgt voor geweldige kwaliteit foto’s maar tegelijkertijd voor enorm grote bestanden.

Ik zie nog erg vaak gebeuren dat dit soort foto’s direct op een website worden geplaatst. Dit resulteert in hoge kwaliteitsfoto’s maar dus ook in enorm zware foto’s en daarmee langere laadtijden voor de bezoekers van de website wat uiteindelijk resulteert in vertrekkende bezoekers wat weer nadelig is voor je positie in de zoekresultaten van Google. Gelukkig is er genoeg aan te doen!

Het juiste type afbeelding gebruiken

Allereerst is het belangrijk dat je kijkt naar het type afbeelding dat je gebruikt. Je hebt vast wel eens van JPG gehoord. Naast JPG zijn er nog meerdere type afbeeldingen. Zo kennen we bijvoorbeeld nog PNG, TIFF, RAW en SVG.

Ik wil je aanraden om op je website zoveel mogelijk gebruik te maken van JPG en waar niet anders kan van PNG. Een voordeel van PNG is dat je hiermee een transparante achtergrond kunt gebruiken. Maar een nadeel van PNG is dat het in verhouding met JPG vaak zwaardere bestanden zijn.

Is het qua het soort afbeelding dus niet nodig om PNG te gebruiken, gebruik dan JPG. Het omzetten van PNG naar JPG kun je met allerlei soorten fotobewerkingsprogramma’s doen.

De juiste formaten afbeeldingen gebruiken

Wanneer we een foto maken met onze mobiele telefoon of met een digitale camera zal de resolutie afgestemd zijn op het tonen van de foto in een groot formaat. Op onze website gebruiken we dit formaat echter negen van de tien keer niet.

WordPress zal de afbeelding echter automatisch verkleinen naar het formaat dat je wel gebruikt. Het probleem hierbij is alleen dat de afbeelding met de ontzettend grote afmetingen alsnog op je server komt te staan en WordPress als het ware elke keer werk moet verrichten om de juiste, kleinere versie, te tonen.

Je kunt er dus beter voor zorgen dat je de afbeelding meteen in het juiste formaat op je website zet.

Het formaat van afbeeldingen kun je wijzigen met allerlei soorten fotobewerkingsprogramma’s. Met macOS kun je dit bijvoorbeeld zelfs doen met de applicatie Voorvertoning. Kies voor Extra’s en vervolgens voor Pas grootte aan.

Je afbeeldingen comprimeren

Wanneer jij je afbeeldingen het juiste bestandstype hebt gemaakt en het juiste formaat hebt gegeven kun je je afbeeldingen ook nog eens comprimeren. Dit is hetzelfde principe als wanneer je van een aantal bestanden op je computer een .zip of een .rar bestand maakt.

Zelf maak ik gebruik van de simpele applicatie ImageOptim, deze is er helaas alleen voor macOS. Voor Windows gebruikers heb ik de tool ImageResizer gevonden maar hier heb ik dus zelf geen ervaring mee.

Helemaal handig is de gratis online tool TinyPNG, al hoewel de naam anders doet vermoeden kun je hiermee zowel PNG als JPG bestanden comprimeren. Je gaat simpelweg naar https://tinypng.com/ en sleept jouw PNG of JPG afbeelding op het vak en TinyPNG zal jouw afbeelding comprimeren.


Hoe groot mogen mijn afbeeldingen zijn?

Het is lastig om op die vraag antwoord te geven. Het heeft namelijk met meerdere dingen te maken, zoals eerder aangegeven is een PNG over het algemeen groter dan een JPG, dus mocht je echt een PNG afbeeldingen moeten gebruiken dan is het logisch dat deze iets groter is dan een JPG.

Daarnaast is het afhankelijk van de afmetingen van je afbeelding en nog belangrijker van de gewenste kwaliteit van je afbeelding.

Stel dat jij professioneel fotograaf bent dan kan ik me voorstellen dat het voor jou van groot belang is dat je afbeelding in de best mogelijke kwaliteit te bekijken is.

Wil toch een leidraad dan zou ik proberen je afbeeldingen rond de 50 kb te houden.

Afbeeldingen in WordPress comprimeren

Ik ben er voorstander van om je foto’s al zoveel mogelijk te optimaliseren voor je ze überhaupt upload naar je WordPress mediabibliotheek maar mocht je daar toch nog wat optimalisatie mogelijkheden zien dan kun je gebruik maken van een compressie plugin.

Zelf maak ik in zo’n geval gebruik van de plugin Smush Image Compression and Optimization. De plugin is ook wel bekend onder de naam WP Smush. Het is een gratis plugin van WPMU DEV en doet wat het beloofd, het comprimeren van je afbeeldingen.

Je kunt de plugin vinden door in de Plugin redirectory (in de backend van je WordPress website) te zoeken naar WP Smush. Zodra je de plugin hebt geïnstalleerd en geactiveerd krijg je onder het onderdeel Media, in de linker navigatiebalk van WordPress, een extra onderdeel met de naam WP Smush.

Wanneer je hier op klikt krijg je een scherm te zien waarin de plugin je onder andere verteld hoeveel afbeeldingen de plugin heeft gevonden die het kan optimaliseren.

Klik op Bulk Smush Now om te beginnen met comprimeren. In de gratis versie kun je 50 afbeeldingen tegelijkertijd comprimeren dus het kan zijn dat je even een paar keer opnieuw op de knop moet drukken.

Aan de rechterkant van het scherm zie je hoeveel afbeeldingen de plugin in totaal al heeft gecomprimeerd en hoeveel kb, of zelfs mb je dit al heeft gescheeld.

Conclusie

Afbeeldingen kunnen dus erg goed zijn voor je zoekmachine optimalisatie mits je ze de juiste gegevens mee geeft en je ze met het juiste bestandstype en formaat upload. Wanneer je dit niet doet kan het juist zorgen voor een tragere website dat uiteindelijk kan leiden tot een lagere positie in de zoekresultaten van Google.

Laat je me weten of jij aan de slag gaat met het optimaliseren van je afbeeldingen?

Wil je meer van dit soort artikelen en instructies lezen? Blijf dan mijn blog in de gaten houden, volg me op Facebook en luister mijn Internet Marketing Podcast op Apple Podcasts of gewoon hier op mijn website.

Groeien als ondernemer?

Ontvang wekelijks een e-mail voor een betere business

Je gegevens zijn veilig en zullen nooit met derde partijen worden gedeeld.