Afbeeldingen optimaliseren: help de zoekmachine

Afbeeldingen optimaliseren: help de zoekmachine

Afbeeldingen optimaliseren is een vaak vergeten onderdeel van SEO: zoekmachineoptimalisatie is niet alleen het gebruiken van zoekwoorden in je tekst. Het gaat ook verder dan de groene bolletjes van Yoast SEO.

In dit artikel laat ik je zien hoe je plaatjes voor blogs optimaliseert.

Een zoekmachine doet niets anders dan internet afspeuren naar content. Maar een zoekrobot heeft geen ogen. Hij leest alleen de code van webpagina’s. En dan komt hij bijvoorbeeld dit tegen in een blog over het begin van de lente.

<img class=”alignnone size-medium wp-image-374″ src=”http://businessblogschool.nl/wp-content/uploads/2016/06/DSC05062.jpg” />

De robot begrijpt nu dat het om een afbeelding gaat: img is de afkorting van image. Maar wat er op het plaatje staat, weet hij niet. Laten we dus de zoekmachine een handje helpen door hem gewoon wat meer te ‘vertellen’.

<img class=”alignnone wp-image-377 size-medium” src=”http://businessblogschool.nl/wp-content/uploads/2017/04/Eerste-lammetjes-2017.jpg” alt=”Eerste lammetjes 2017“/>

Voor een robot is dit al een stuk duidelijker. Voor jou niet? Lees dan snel verder!

Stap voor stap afbeeldingen optimaliseren

Je hebt vast wel eens op je computer naar een afbeelding gezocht. En misschien heb je je wel suf gezocht. Want de foto die je nodig had, heette niet ‘Eerste lammetjes 2017.jpg’ maar had van je fototoestel of telefoon een naam meegekregen als ‘DSC05062.jpg’.

De zoekmachine kan niets met zo’n naam. En als een afbeelding eenmaal in WordPress staat, kun je de naam niet meer veranderen.

Afbeelding mediabibliotheek WordPress: title-tag en alt-tekst

In de mediabibliotheek ziet het plaatje waar de code hierboven naar verwijst, er zo uit (afbeelding met de oranje rand). Afbeeldingen optimaliseren doe je voor een groot deel op deze plek in de mediabibliotheek. Ik neem je mee langs de nummers.

  1. Dit is de naam die de afbeelding op jouw computer had. Omdat je deze naam niet meer kan veranderen nadat je afbeelding hebt geüpload, moet je de afbeelding al op je computer een naam geven die wat beter de lading dekt. Als je hierbij een zoekwoord kan gebruiken, is dat mooi meegenomen.
  2. De titel of title-tag is een invulveld. Standaard zet WordPress daar de naam van de afbeelding (zonder extensie als jpg, gif, jpeg of png). Deze tag kun je wijzigen: bedenk of er een zoekwoord is dat je hier kan invullen. Stel dat deze blog gaat over de lente in Moerstraten, dan had ik hier bijvoorbeeld kunnen kiezen voor Moerstraten lente 2017.
  3. Misschien is dit wel het belangrijkste element. Ga je je afbeeldingen optimaliseren, vul dan zeker de alt-tag, alt-tekst of alternatieve tekst in. In de stukjes code boven in dit artikel zie je dat alt=… de eerste keer ontbrak: ik had toen de alt-tag nog niet ingevuld. In het tweede stukje code zie je wel: alt=… Je kan bij de alt-tag hetzelfde invullen als bij de titel, maar je kan ook op een ander zoekwoord ‘mikken’.
    NB: De alternatieve tekst wordt ook getoond als een plaatje niet geladen kan worden. Je ziet dan een rood kruisje met de alternatieve tekst.
  4. Omschrijving of description. Kijk weer even naar de code, dan zie je dat de omschrijving niet in de code terugkomt. De zoekmachine ziet dit niet, dus voor de SEO voegt deze tag niets toe. Om plaatjes snel terug te kunnen vinden in je mediabibliotheek, is het wel handig om dit veld in te vullen.

Snijd afbeeldingen op maat

Afbeeldingen optimaliseren voor de zoekmachine is niet alleen het ‘leesbaar’ maken van je plaatjes. Het gaat ook om het verkleinen van je afbeeldingen. Onder het plaatje van de lammetjes zie je dat deze foto op dit moment 4MB is.

  • Richtlijn: probeer je plaatjes onder de 500kB te houden.

Stel je de mediabieb voor als een rugzak. Als bezoeker zie jij de voorkant van de website. Jij ziet de rugzak niet, maar hoe voller deze is, hoe trager de website is.

De uitgelichte afbeelding in het thema van mijn test-website heeft deze maten: 1140 x 660 pixels. Zorg dat je de afmetingen kent die bij jouw thema horen!

Onder ‘de zwaarte’ van de afbeelding (4MB) staan de huidige afmetingen: 3648 x 2736 pixels. Dat is ruim 3x groter dan getoond kan worden. Dat betekent dat het laden van de afbeelding (WordPress laadt de hele afbeelding) 3x langzamer gaat dan noodzakelijk.

Eén plaatje dat te groot is, is niet zo’n ramp. Maar stel dat je plaatjes voor blogs nóóit bijsnijdt… Je website wordt al snel een log gevaarte en bezoekers haken af.

Afbeelding bijsnijden met Canva

Een hele handige tool om afbeeldingen op maat te maken, is canva.com. Ik zal je laten zien hoe ik een template aanmaak.

Je kan met Canva echt prachtige afbeeldingen en infographics maken. Ook veel ebooks worden tegenwoordig opgemaakt met deze tool. Voor dit blogartikel houd ik het even bij het bijsnijden van de afbeelding, een belangrijk onderdeel van afbeeldingen optimaliseren.

Zie je de video niet? Bekijk ‘m dan rechtstreeks via https://youtu.be/IOiey_vHD0A.

Afbeelding comprimeren met tinypng.com

De afbeelding heeft nu de juiste afmetingen. Dit scheelt al enorm voor de bestandsgrootte. Toch raad ik je aan om een plaatje nog verder te verkleinen.

We noemen dit comprimeren, en hier gebruik ik tinypng.com voor. Anders dan de naam doet vermoeden, kan deze online tool zowel overweg met .png als met .jpg-afbeeldingen. In de video laat ik je zien hoe je een foto comprimeert zonder kwaliteitsverlies. Of liever gezegd, hoe deze tool dat in een oogwenk voor je doet.

Zie je de video niet? Bekijk ‘m dan rechtstreeks via https://youtu.be/8VVaN_fFDGs.

Klaar!

Dit zijn de stappen die je moet doorlopen om afbeeldingen te optimaliseren voor de zoekmachine. Vergeet niet dat Google de laadsnelheid van jouw website een hele belangrijke factor vindt. Niemand zit graag te koekeloeren op zijn mobieltje terwijl een webpagina aan het laden is. Dus stuurt Google minder bezoekers naar trage websites.

Het lijkt misschien nogal wat werk voor ‘gewoon een plaatje’, maar het is absoluut de moeite waard. De voordelen op een rijtje:

  • De zoekmachine kan jouw afbeeldingen ‘lezen’ en indexeren.
  • Je scoort hoger in de zoekmachine (ook bij Afbeeldingen).
  • Je website laadt sneller: dit vergroot de website usability (hoe gebruiksvriendelijker je website, hoe blijer je bezoekers en hoe hoger je scoort in Google).

Succes, en je zult zien: afbeeldingen optimaliseren wordt al snel een automatisme en kost dan echt niet zoveel tijd.

Heb jij de afbeeldingen op jouw website in alle opzichten geoptimaliseerd?

Ook interessant voor je:

Interessant? Deel dit artikel zodat ook andere ondernemers ervan kunnen profiteren.

10 reacties op “Afbeeldingen optimaliseren: help de zoekmachine

  1. Corinne schreef:

    Goede, informatieve post! Gelukkig heb ik dit van het begin af aan gedaan met mijn foto’s. Ik wist alleen niet zo goed het verschil tussen de title-tag en de alt-tag. Dat is me nu duidelijk. Dank je!

    1. Jessie schreef:

      Ha Corinne, goed dat je dat meteen opgepakt hebt. Volgens mij ben je daarmee een van de weinigen 🙂 Succes met je blogs!

  2. Nicole Orriëns schreef:

    Ik gebruik inmiddels standaard alt-tags want ik vind het zonde om een kans dat Google een afbeelding vindt mis te lopen!

    1. Jessie schreef:

      En gelijk héb je Nicole!

  3. Maaike schreef:

    Wat een fijn artikel zeg! Van die afbeeldingen een naam geven wist ik al (alhoewel ik wel een aantal heb gemist, omdat ik tóch te lui was… slecht. Gelukkig zijn het er nog maar heel weinig), maar die tool om de afbeelding te verkleinen kende ik nog niet. Heb ik meteen even opgeslagen. DANK!!

    1. Jessie van Loon schreef:

      Ha Maaike, leuk te horen dat je er wat mee kan! Succes met je blog, groeten Jessie

  4. Marita schreef:

    Hoi Jessie, begrijp ik goed dat ik mijn mediabibliotheek nu niet meer kan aanpassen met namen voor de foto’s” Ik gebruik trouwens al WP smush om alle afbeeldingen te comprimeren, is dat voldoende denk jij?

    1. Jessie schreef:

      Hai Marita, klopt. De naam van het bestand staat niet in een invulveld en is niet meer aan te passen (de title wel). De plugin WP Smush comprimeert afbeeldingen alleen als het origineel kleiner is dan 1MB. Dat is bij zelfgemaakte foto’s vaak niet het geval. Ook lijkt de plugin op dit moment vaak conflicten te geven met het https-protocol (dat websites veiliger maakt). Als je van dat laatste geen last hebt, is WP Smush zeker een optie. Om tot de zo kleinst mogelijke afbeeldingen te komen, zou ik zeggen: maak met bijv. Canva de afbeeldingen passend en uploadt dan de verkleinde afbeelding. Succes!

  5. Liselotte schreef:

    Deze blog gaat een beetje boven mijn pet. Ik blog nog niet zo lang en vind veel zaken erg moeilijk. Ik probeer stukje voor stukje onder de knie te krijgen. Jouw blogs helpen mij daarbij. Ik kijk uit naar een volgende! (Hopelijk een gemakkelijke ).

    1. Jessie schreef:

      Dat je blogt, is al super! Ik kan me voorstellen dat dit misschien nu nog wat abacadabra overkomt, zeker als WordPress nieuw voor je is. Don’t worry, je groeit er vanzelf in. Dit heet niet voor niks ‘optimaliseren’ 🙂 Volgende keer weer een meer basic blog, beloofd!

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *