Alt-tekst schrijven: zo beschrijf je afbeeldingen goed
Elke afbeelding op je website heeft een onzichtbaar tekstveld: de alt-tekst. De meeste site-eigenaren laten het leeg, want je ziet er aan de buitenkant niks van. Toch leest een deel van je bezoekers juist die tekst, en Google leest 'm ook. In dit stuk leg ik in gewone taal uit wat een alt-tekst is, voor wie je 'm schrijft en hoe je in een paar woorden opschrijft wat er op een foto staat. Met voorbeelden van een vakman-site, want daar wordt het pas concreet.
Wat is een alt-tekst?
Alt is kort voor alternatief. Een alt-tekst is de alternatieve tekst van een afbeelding: een korte beschrijving van wat er op het beeld staat, bedoeld voor iedereen die het beeld zelf niet ziet. Laadt een foto niet, dan verschijnt de tekst op die plek. Luistert iemand naar je pagina met voorleessoftware, dan wordt de tekst voorgelezen.
De tekst hangt in de code aan de afbeelding vast. Bezoekers die het beeld gewoon zien, merken er niks van. Het is dus geen bijschrift onder de foto, maar een beschrijving erachter. Elke afbeelding op je site heeft zo'n veld, van de grote foto bovenaan je homepage tot het kleinste plaatje in de voettekst.
Voor wie schrijf je die tekst eigenlijk?
Voor twee lezers, en allebei kunnen ze niet naar je foto kijken.
De eerste lezer is een mens. Slechtziende en blinde bezoekers laten je website voorlezen door voorleessoftware. Komt die software bij een afbeelding, dan leest die de alt-tekst voor. Staat daar niks, dan hoort de bezoeker alleen dat er een afbeelding is, of erger: een bestandsnaam vol cijfers. MKB Toegankelijk legt dat mooi uit: de voorleessoftware spreekt uit wat jij in de alt-tekst hebt gezet, en zo weet ook deze bezoeker wat er te zien is. Datzelfde veld helpt trouwens ook mensen met een trage verbinding: zij zien de tekst alvast terwijl de foto nog laadt.
De tweede lezer is Google. Een zoekmachine kan niet naar een foto kijken zoals jij en ik dat doen. De alt-tekst vertelt Google wat er op de afbeelding staat, en dat helpt de zoekmachine om je pagina beter te begrijpen. Het is ook de reden dat je werkfoto's kunnen opduiken in Google Afbeeldingen, waar mensen rondkijken voor ze een vakman bellen.
Hoe schrijf je een goede alt-tekst?
De regel die ik aanhoud past op een bierviltje: beschrijf wat er echt op het beeld staat, kort en concreet, in een gewone zin. In de praktijk komt het hierop neer:
- Beschrijf wat er echt te zien is. Niet wat je hoopt dat Google ervan maakt, maar wat je zou antwoorden als iemand vraagt: wat staat hierop?
- Houd het kort. Een zin is meestal genoeg. De tekst wordt voorgelezen, en niemand wil een halve alinea aanhoren bij elke foto.
- Wees concreet. "Kozijn" zegt weinig. "Wit geschilderd kozijn van een woonkamerraam" geeft een beeld.
- Prop er geen zoekwoorden in. Een rij losse zoektermen is hinderlijk om aan te horen, en Google herkent die truc allang.
- "Foto van" mag weg. Dat het om een afbeelding gaat, weet de software al. Begin gewoon met wat erop staat.
Goed en fout: de foto van het geschilderde kozijn
Stel, je bent schilder en je zet een foto op je site van een kozijn dat je net strak in de lak hebt gezet. Drie manieren om het alt-veld in te vullen:
Fout: "IMG_4032.jpg". Dit is geen beschrijving maar een bestandsnaam. De voorleessoftware leest 'm letterlijk voor en de luisteraar weet nog steeds niks.
Ook fout: "schilder kozijn schilderen schildersbedrijf buitenschilderwerk offerte". Dit is zoekwoorden proppen. Voor de luisteraar is het een onverstaanbare brij, en Google heeft er ook niks aan, want het beschrijft de foto niet.
Goed: "wit geschilderd houten kozijn na het buitenschilderwerk". Een gewone zin die zegt wat je ziet. Wie het beeld niet ziet, weet meteen wat daar staat, en Google weet het ook.
Je merkt het al: een goede alt-tekst begint bij een goede foto. Hoe je aan zulke foto's komt, en waarom eigen werkfoto's het bijna altijd winnen van stockbeelden, lees je in foto's op je website: zelf maken of laten maken.
Wanneer laat je de alt-tekst leeg?
Niet elke afbeelding verdient een beschrijving. Puur decoratieve beelden, zoals een sierlijntje, een achtergrondpatroon of een los sfeerplaatje dat inhoudelijk niks toevoegt, laat je bewust leeg. Voorleessoftware slaat zo'n afbeelding dan helemaal over, en dat is precies de bedoeling: de luisteraar mist niks en wordt niet opgehouden.
Let wel op het verschil tussen bewust leeg en vergeten. Een lege alt-tekst bij een decoratief lijntje is een keuze. Een lege alt-tekst bij de foto van je mooiste klus is een gemiste kans. En een veld met alleen het woord "afbeelding" erin is erger dan leeg: de luisteraar hoort dan twee keer dat er een afbeelding is, en nog steeds niet wat erop staat.
Twijfel je? Stel jezelf een vraag: mist iemand iets als dit beeld er niet was? Zo ja, beschrijven. Zo nee, leeg laten.
Eerst kijken, dan pas schrijven
Dan het eerlijke punt uit mijn eigen werkplaats: een alt-tekst schrijf je pas nadat je het beeld echt bekeken hebt. Dat klinkt als een open deur, maar hier gaat het in de praktijk het vaakst mis. Wie dertig foto's tegelijk op zijn site zet, vult de velden in vanaf de bestandsnamen of laat het systeem er automatisch iets in zetten. Zo krijgt de foto van de voordeur de beschrijving van de dakkapel, en niemand die het merkt, totdat iemand de pagina laat voorlezen.
Daarom open ik elke foto op volle grootte en kijk ik eerst: wat staat hier nou echt op? Pas daarna typ ik de beschrijving. Soms betekent dat toegeven dat een foto niks toevoegt. Die krijgt dan een leeg veld, of vliegt er helemaal uit. Dat kost meer tijd dan overal hetzelfde zinnetje inplakken, maar het is de enige manier waarop de tekst klopt met het beeld.
Begin bij de foto's die er echt toe doen
Staat jouw site vol afbeeldingen zonder alt-tekst, ga dan niet vandaag in een keer alles repareren. Begin bij de homepage en de pagina's waar klanten binnenkomen, en werk vanaf daar rustig verder. Tien goede beschrijvingen op je belangrijkste pagina's doen meer dan honderd haastige.
Zie het als een van de kleinere klussen in een langere rij verbeteringen. In website optimaliseren zet ik die hele rij op volgorde, van groot naar klein. En maak er daarna een gewoonte van: elke nieuwe foto die je plaatst, krijgt meteen een beschrijving mee. Dat is een minuut werk per foto, en je site wordt er blijvend beter van: voor de bezoeker die het beeld niet ziet, en voor de zoekmachine die niet kan kijken.
Liever dat dit soort klusjes gewoon meegenomen worden? Bij Start (€39 per maand) horen alt-teksten er vanaf de bouw bij: elke afbeelding die ik plaats, krijgt een beschrijving. Op de prijslijst zie je wat er verder in elk pakket zit.
Veelgestelde vragen over alt-teksten
Hoe lang mag een alt-tekst zijn?
Er is geen officiele maximumlengte, maar kort werkt het best. Denk aan een gewone zin waarin je zegt wat er op het beeld staat. Voorleessoftware leest de hele tekst voor, dus een lange lap tekst wordt al snel hinderlijk voor de luisteraar. Past je beschrijving niet in een of twee zinnen, dan hoort de rest eerder in de gewone tekst van de pagina.
Wat betekent alt?
Alt is de afkorting van alternatief. De alt-tekst is letterlijk de alternatieve tekst van een afbeelding: wat er staat als het beeld zelf niet zichtbaar is. Browsers tonen die tekst als een foto niet laadt, en voorleessoftware spreekt 'm uit voor bezoekers die slecht of niet kunnen zien. In de code heet dit veld het alt-attribuut.
Hoe voeg ik een alt-tekst toe aan een afbeelding?
In de meeste websitesystemen klik je op de afbeelding en zie je een veld met de naam alternatieve tekst of alt-tekst. Wat je daar typt, wordt automatisch aan het beeld gekoppeld. Bouw je zelf in code, dan zet je de beschrijving in het alt-attribuut van de afbeelding. Laat iemand anders je site onderhouden, lever de beschrijvingen dan gewoon per foto aan.

Geschreven door Justin, webvakman. Ik bouw sinds 2019 websites voor lokale ondernemers door heel Nederland. Meer over mij.