Wat het is
Alt-tekst is een korte geschreven beschrijving die aan een afbeelding in de code van een pagina is gekoppeld, en die een schermlezer hardop aankondigt in plaats van de afbeelding zelf, omdat een blinde of slechtziende bezoeker die er een gebruikt de afbeelding niet rechtstreeks kan zien. Waar onze SEO-gerichte alt-tekstgids kijkt naar hoe hetzelfde attribuut zoekmachines helpt afbeeldingen te ontdekken, gaat deze invalshoek specifiek over wat alt-tekst betekent voor een echt persoon die erop vertrouwt om dezelfde informatie te krijgen die een ziende bezoeker krijgt door simpelweg naar de foto te kijken.
Dit onderscheid is in de praktijk belangrijk: alt-tekst die puur is geschreven om hoog te scoren in afbeeldingenzoekopdrachten kan eindigen volgestopt met zoekwoorden in plaats van daadwerkelijk te beschrijven wat de afbeelding toont, wat een schermlezergebruiker slecht van dienst is, zelfs als het technisch aan de letter van de vereiste voldoet.
Waarom het belangrijk is
Voor een schermlezergebruiker wordt een afbeelding zonder alt-tekst ofwel volledig overgeslagen (alsof hij niet bestaat) of aangekondigd als een nutteloze bestandsnaam zoals "IMG_4821.jpg" β in beide gevallen gaat alle informatie die die afbeelding aan een ziende bezoeker moest overbrengen, simpelweg verloren. Dit wordt een serieuze drempel wanneer de afbeelding betekenisvolle inhoud draagt: een grafiek met gegevens, een diagram dat een proces uitlegt, een productfoto die een kenmerk toont dat nergens anders in de omringende tekst wordt beschreven.
Dit is in veel contexten ook een wettelijke toegankelijkheidsvereiste, onder standaarden zoals WCAG (de Web Content Accessibility Guidelines) waar veel bedrijven aan moeten voldoen β maar het puur als een nalevingsvakje behandelen mist het punt dat het een echt, alledaags toegangsprobleem voor echte bezoekers oplost.
Hoe je het oplost
- Schrijf voor elke afbeelding die echte informatie overbrengt alt-tekst die beschrijft wat er daadwerkelijk op te zien is, alsof je het beschrijft aan iemand aan de telefoon die het niet kan zien.
- Houd beschrijvingen beknopt en specifiek β meestal is een zin of korte zinsnede genoeg; vermijd het herhalen van informatie die al in de omringende tekst staat.
- Gebruik voor puur decoratieve afbeeldingen die geen informatie toevoegen (achtergrondtexturen, scheidingslijnen) een lege
alt="", zodat een schermlezer ze volledig overslaat in plaats van iets betekenisloos aan te kondigen. - Schrijf voor een afbeelding die zelf een link is (zoals een logo dat naar de homepage linkt) alt-tekst die beschrijft waar de link naartoe gaat, niet alleen hoe de afbeelding eruitziet.
- Test met een gratis schermlezer (NVDA, VoiceOver) om te horen hoe je afbeeldingen daadwerkelijk worden aangekondigd, in plaats van aan te nemen dat de tekst die je schreef goed hardop leest.