Afbeelding op je website? Denk aan de title-tag en alt-tag

11 juni 2019 • Dick van Lieshout
Als je een afbeelding toevoegt aan je website, kun je ook een title-tag en een alt-tag toevoegen. Dat is slim om te doen. Het is niet moeilijk en heeft een paar grote voordelen.

Afbeeldingen en title- en alt-tags

Een alt-tag, of alt-tekst, is een stukje tekst dat je aan een afbeelding kunt toevoegen. Het is niet hetzelfde als de alt-title. De alt-title kun je ook aan een afbeelding toevoegen, en die verschijnt dan als je met je muis over de afbeelding ‘hovert’ (zweeft).

Een compleet voorbeeld van een afbeelding in html (image tag) is:

<img src=“voorbeeld.jpg” alt=“voorbeeld alt tag” title=“voorbeeld title tag” />

Over bestandsnamen

Met de bestandsnaam van de afbeelding wordt helemaal niets gedaan. Met de extensie in feite ook niet. Dat zegt meer iets over het type bestand. Zo is het veelgebruikte .jpg een gecomprimeerd bestand en een .png-afbeelding heeft een transparante achtergrond.

Waarom hier moeilijk over doen?

Het heeft twee grote voordelen om een alt-tag aan je afbeelding toe te voegen.

  1. Beter gevonden worden. De robots van zoekmachines kunnen jouw afbeeldingen niet “lezen”, maar wél de alt-tag. Met alt-tags word je dus beter gevonden in zoekmachines zoals Google.
  2. Beter begrepen worden. Ook slechtzienden bekijken je websitepagina’s. Zij gebruiken dan vaak software die de website voorleest. Zo kunnen zijn de afbeelding herkennen.

Beter gevonden worden

Google haalt informatie over het onderwerp van de afbeelding op uit de pagina-inhoud (content) en bijschriften (alt-tags) en afbeeldingstitels (title-tags). Plaats daarom altijd relevante afbeeldingen in de buurt van de tekst waar de afbeelding betrekking op heeft.


Zoso-tip. Ook de naam van het bestand kan Google meer over het onderwerp vertellen. “zo gebruik je alt-tags.jpg” werkt dus beter dan “IMG001254.jpg”


Extensies. Google ondersteunt afbeeldingen met de volgende extensies: bmp, gif, jpeg, png, webp, svg en inline afbeeldingen.

Wat zet je in een alt-tag?

De tekst van een alt-tag is kort en omschrijvend. Het omschrijft het onderwerp; het omschrijft waarover het gaat. De tekst vertelt wat er op de afbeelding staat en legt als het ware de functie van pagina uit.

Voorbeeld

Hier vind je onze algemene voorwaarden

Bestandsnaam: algemene-voorwaarden-zoso.jpg
Title-tag: Onze algemene voorwaarden
Alt-tag: Hier vind je onze algemene voorwaarden


Zoso-tip. Stop de alt-tag niet boordevol met allerlei zoekwoorden. Google ziet dat al snel als spam, en als de tag wordt voorgelezen is er geen touw aan vast te knopen.


Alt-tags in de praktijk

MijnRetail-website. Als je een MijnRetail-website hebt en je wilt op een pagina of in een bericht een afbeelding toevoegen in de tekst, dan kun je dat via de teksteditor doen. Je kiest een afbeelding en je voegt een omschrijving (de alt-tag) toe. Daarnaast kun je bij een pagina of bericht ook foto's uploaden, deze worden dan naast de tekst weergegeven. Hierbij is de bestandsnaam van je afbeelding automatisch ook de alt-tag.

Een Wordpress-site. Als je in een Wordpress een afbeelding toevoegt en je doet verder niets, dan wordt de bestandsnaam als title-tag toegevoegd en vervolgens als alt-tag gebruikt. Beter is het dus om de title-tag en alt-tag zelf in te vullen.

Een eigen website van Zoso. Hebben wij voor jou een website gemaakt? Dan geen zorgen! Wij wijzen jou op de mogelijkheden en voegen op de statische pagina’s afbeeldingen toe, voorzien van de juiste title- en alt-tags. 


Zoso-tip. Voeg altijd een alt-tag aan de afbeelding op je website toe, die de functie van de afbeelding omschrijft. Dat is goed voor de zoekresultaten in Google én dat werkt fijn als slechtzienden de websitepagina laten voorlezen.