Alt-tekst: Wat is het en waarom is het belangrijk?

Alt-teksten, oftewel alternatieve teksten, zijn korte beschrijvingen die je toevoegt aan afbeeldingen op websites, nieuwsbrieven of sociale media. Ze spelen een cruciale rol in zowel de toegankelijkheid van je content als in je SEO. In deze blog ontdek je wat alt-teksten zijn, waarom ze belangrijk zijn en hoe je ze effectief kunt schrijven.

Wat zijn Alt-teksten?

Een alt-tekst is een HTML-attribuut dat een afbeelding beschrijft. Het worden ook wel “alternatieve teksten” genoemd. Het zijn korte beschrijvingen die worden toegevoegd aan de HTML-code van een afbeelding.

Deze tekst wordt getoond wanneer een afbeelding niet geladen kan worden, maar het heeft ook een veel belangrijkere functie: het beschrijft de afbeelding voor mensen die gebruikmaken van schermlezers of andere hulpmiddelen voor mensen met een visuele beperking. Daarnaast helpt het optimaliseren van afbeeldingen zoekmachines om de inhoud van een afbeelding te begrijpen, wat bijdraagt aan betere vindbaarheid van je website.

Waarom zijn Alt-teksten belangrijk?

Alt-teksten zijn een belangrijk (en vaak onderschat) onderdeel van een goed ontworpen website, en wel om drie belangrijke redenen:

1) Toegankelijkheid

Alt-teksten maken afbeeldingen toegankelijk voor mensen met een visuele beperking. Schermlezers gebruiken alt-teksten om de afbeelding voor te lezen en te beschrijven. Daarom is het belangrijk om in de alt-tekst exact de afbeelding en de inhoud ervan te beschrijven. Dit zorgt ervoor dat iedereen toegang heeft tot de informatie op je website.

2) SEO

Zoekmachines zoals Google kunnen afbeeldingen niet helemaal goed “zien”. Alt teksten helpen zoekmachines daarom om de inhoud van de afbeelding te begrijpen. Op zichzelf heeft dit geen grote impact op je organische positie, maar in het grotere geheel heeft het absoluut een belangrijke toevoeging.

3) Afbeelding wordt niet geladen

Als een afbeelding niet kan worden geladen (bijvoorbeeld door een trage internetverbinding), wordt de alt-tekst weergegeven. Dit helpt gebruikers om te begrijpen wat er op de pagina staat, zelfs zonder de afbeelding. In plaats van een leeg vak zien gebruikers dan de alternatieve tekst.

Hoe schrijf je effectieve alt-teksten?

Het toevoegen van alt-teksten is eenvoudig, maar het is belangrijk om ze op de juiste manier te schrijven. Hier zijn enkele tips:

Wees beschrijvend maar beknopt
Beschrijf wat er op de afbeelding te zien is, maar houd het altijd kort en relevant.
Gebruik zoekwoorden, maar overdrijf niet
Voeg niet alleen zoekwoorden toe, maar zorg ervoor dat ze op natuurlijke wijze passen en bijdragen aan de semantische kracht van de pagina.
Vermijd onnodige informatie
Gebruik geen alt-teksten zoals “afbeelding van” of “foto van”. Dit is overbodig, want je schermlezer kan met het alt-attribuut omgaan.
Laat decoratieve afbeeldingen leeg
Als een afbeelding puur decoratief is en geen toegevoegde waarde heeft, kun je de alt tekst leeg laten (alt=””). Dit voorkomt overbodige informatie voor schermlezers.

Vul geen alt-tekst in bij decoratieve afbeeldingen

Decoratieve afbeeldingen zijn afbeeldingen die puur voor esthetische doeleinden worden gebruikt en geen inhoudelijke waarde toevoegen aan de pagina. Deze afbeeldingen zijn bedoeld om de pagina visueel aantrekkelijker te maken, maar ze dragen niet bij aan de functionaliteit van de website.

Denk bijvoorbeeld aan:

Visuele scheidingslijnen of decoratieve randen.
Iconen die alleen ter versiering zijn toegevoegd.
Afbeeldingen die in CSS worden ingeladen: top images en achtergrond afbeeldingen;
Illustraties zonder inhoudelijke functie;
Iconen en illustraties bij een stappenplan (waar geen knop onder hangt);
Afbeeldingen met tekst die niets toevoegt;
Afbeeldingen met tekst die er net onder nog eens (en beter) omschreven worden.

Let op: Het is belangrijk om de alt-attribuut in je code gewoon te laten staan, en gewoon leeg te laten (alt=””). Zo weten schermlezers dat ze het moeten overslaan er er echt geen alternatieve tekst voor de afbeelding is.

Vul wel een alt-tekst in bij informatieve afbeeldingen

Nu hoor ik je al denken; wat is een informatieve afbeelding dan? Het is soms lastig om goed in te schatten wat nu wel of niet informatief is. De afbeelding moet iets toevoegen aan de inhoud van de pagina waardoor het cruciaal is om te beschrijven wat er op de afbeelding staat.

Denk bijvoorbeeld aan:

Logo’s;
Stickers met een boodschap/tekst;
Infographics;
Grafieken en diagrammen;
Iconen die een functie hebben (Denk aan het vergrootglas-icoon om iets te zoeken);
Koppen in tabellen;
Productafbeeldingen.

Hoe lang kan een alt-tekst zijn?

Er is geen officiële maximale lengte voor een alt-tekst. Voor bezoekers die geen afbeeldingen kunnen zien, is het noodzakelijk dat de informatie die een afbeelding geeft ook in tekst wordt gegeven.

Maak een alt-tekst gewoon zo lang als deze moet zijn om de afbeelding goed te omschrijven, maar houdt het kort en krachtig. Een korte zin is prima. Het is niet de bedoeling dat je hier halve alinea’s gaat schrijven.

Gaat mijn pagina veel beter ranken met alt-teksten?

Heel simpel gezegd: nee. Vul je alle alt-teksten opeens goed in, dan zal je niet opeens een paar organische posities stijgen, maar het helpt voor een goede fundering van je pagina waar je verder op kunt bouwen.

Als je content goed is en de alt-tekst duidelijk en relevant is voor de inhoud van de pagina, zullen zoekmachines dit kleine detail zeker waarderen. Hoewel het geen rankingfactor is, is het wel een heel klein stukje van de puzzel dat uiteindelijk een verschil kan maken. Alt-teksten geven context.

Hoe verwerk ik zoekwoorden in mijn alt-tekst?

Als je eenmaal besloten hebt dat een afbeelding informatief is en je een alt-tekst moet toevoegen, dan is de volgende stap om na te gaan of het toevoegen van een zoekwoord relevant genoeg is.

Schrijf eerst een duidelijke, beschrijvende alt-tekst die de afbeelding accuraat weergeeft. Beschrijf wat er op de afbeelding te zien is, niet meer en niet minder. Ga dus niet hele zinnen ombouwen om maar een zoekwoord van je te verwerken.

Vaak verwerk je op een natuurlijke wijze je zoekwoord(en) al als ze relevant zijn voor je pagina. En zorg ervoor dat de toevoeging van zoekwoorden de leesbaarheid en begrijpelijkheid niet verstoort.

Wat als ik geen enkele zoekwoord in mijn alt-teksten kan verwerken?

Als er op een pagina geen afbeelding is die een alt-tekst moet krijgen, of er geen alt-tekst is waar je een zoekwoord aan kan toevoegen, dan is er een heel ander probleem. De afbeeldingen die je op dit moment gebruikt zijn blijkbaar niet relevant genoeg voor je pagina. Voeg daarom het liefst andere afbeeldingen toe die wel informatief zijn of context bieden.

Meest voorkomende fouten bij het schrijven van alt-teksten

Alt-teksten zijn dus erg belangrijk. Toch worden er vaak fouten gemaakt bij het schrijven ervan. Denk bijvoorbeeld aan:

Geen alt-tekst invullen als dat wel zou moeten;
Het alt-attribuut helemaal uit de code halen;
Vage of irrelevante beschrijvingen;
Keyword stuffing;
Bestandsnamen gebruiken als alt-tekst;
Veel te lange beschrijvingen gebruiken.

De raakvlakken tussen SEO en Toegankelijkheid

Alt-teksten zijn een perfect voorbeeld van hoe SEO en toegankelijkheid hand in hand gaan. Hier zijn enkele manieren waarop deze twee disciplines elkaar overlappen:

1. Beter begrijpen van afbeeldingen

Zoekmachines gebruiken alt-teksten om de inhoud van afbeeldingen te begrijpen. Dit is vooral belangrijk voor afbeeldingen die geen tekst bevatten, zoals infographics of productafbeeldingen. Door duidelijke en beschrijvende alt teksten toe te voegen vergroot je de kans dat Google begrijpt wat er op de afbeelding staat afgebeeld.

2. Verbeterde gebruikerservaring

Een toegankelijke website is over het algemeen gebruiksvriendelijker voor iedereen, niet alleen voor mensen met een beperking. Alt-teksten zorgen ervoor dat gebruikers de inhoud van een pagina kunnen begrijpen, zelfs als de afbeeldingen niet worden geladen. Dit verbetert de algehele gebruikerservaring, wat indirect een positief effect kan hebben op de organische vindbaarheid van je website.

3. Compliance met WCAG

De Web Content Accessibility Guidelines (WCAG) vereisen dat alle niet-tekstuele content, zoals afbeeldingen, een tekstalternatief heeft. Door alt-teksten toe te voegen, voldoe je niet alleen aan deze richtlijnen, maar zorg je ook voor voldoende informatie en context zodat Google beter begrijpt waar de afbeelding en de pagina over gaan.

Bronnen

– https://www.w3.org/WAI/WCAG22/Techniques/html/H37.html
– https://www.w3.org/TR/UNDERSTANDING-WCAG20/text-equiv-all.html