Alt-attribuut
Het alt-attribuut, technisch incorrect ook aangeduid als alt-tag, is een HTML-attribuut. Het wordt vooral bij afbeeldingen gebruikt om met een korte tekst (de alt-tekst) aan te duiden wat de afbeelding moet weergeven.
Deze tekst gaat in op het gebruik bij afbeeldingen. Ook andere niet-tekstuele HTML- en XHTML-elementen kunnen een alt-attribuut hebben, zie daarvoor het kopje Geschiedenis.
Schermlezers lezen het alt-attribuut voor; dit vervangt de plaatjes en geeft gebruikers een indicatie van wat er te zien is of waar het plaatje voor dient. Het alt-attribuut is ook nuttig als het plaatje niet weergegeven kan of mag worden. In de praktijk wordt het ook veel gebruikt door spiders voor zoekmachine-optimalisatie (SEO).
Voor langere beschrijvingen is er het longdesc-attribuut. Voor de titel is er het title-attribuut, dat ook als tooltip kan dienen; in strijd met de W3C-specificaties is het alt-attribuut daar ook voor gebruikt.
Benaming
[bewerken | brontekst bewerken]Het alt-attribuut wordt vaak aangeduid als alt-tag, maar het is geen tag, het is een attribuut dat metadata bevat over een HTML-element.
De eigenlijke tags van een HTML-element zijn de tekens < en > en alles daartussen, zie het voorbeeld onderaan.
Gebruik
[bewerken | brontekst bewerken]
Zoals de naam al aangeeft biedt het alt-attribuut een alternatief voor niet-tekstuele inhoud. De W3C-aanbevelingen voor toegankelijkheid geven de bedoeling aan:
Principe 1: Waarneembaar - Informatie en onderdelen van de gebruikersomgeving moeten weergegeven kunnen worden op manieren die de gebruikers kunnen waarnemen. Richtlijn 1.1 Tekstalternatieven: Bied tekstuele alternatieven voor elke niet-tekstuele inhoud, zodanig dat deze omgezet kan worden in vormen die mensen nodig hebben, zoals grote letters, braille, spraak, symbolen of eenvoudigere taal.[1]
Idealiter dient het attribuut de mens en legt het uit wat de functie van het element binnen het geheel is,[2] maar in de praktijk wordt het gebruikt als een hulpje dat zoekmachines vertelt wat er te zien is.[3]
De context is belangrijk. In een pagina over vlaggen heeft een afbeelding van de Union Jack weinig toelichting nodig, maar in een artikel over Vivienne Westwood moet duidelijk zijn dat zij de vlag in verschillende ontwerpen verwerkte. In een artikel over het alt-attribuut moet de tekst een zelfreferentie zijn: de tekst moet iets duidelijk maken over alt-attributen.
Het doel is duidelijk anders dan bij het title-attribuut: dat geeft aan wat er getoond wordt, terwijl het alt-attribuut laat zien waarom dit getoond wordt.
Toepassing bij visuele elementen
[bewerken | brontekst bewerken]Het attribuut wordt getoond als een toepassing de afbeelding niet kan tonen of als de gebruiker of systeembeheerder het tonen uitgeschakeld heeft. Bij schermlezers en andere hulpmiddelen voor visueel gehandicapten heeft een plaatje soms zin, maar meestal niet. Ook buiten specifieke doelgroepen zijn er uiteenlopende redenen en oorzaken waardoor een beeld niet getoond wordt, zoals:
- Er zijn onvoldoende middelen beschikbaar, bijvoorbeeld te weinig geheugen of downloadsnelheid.
- Het tonen kan uitgeschakeld zijn in de browser of e-mailclient; eventueel kan de gebruiker aan de hand van de tags besluiten om het materiaal toch te downloaden en te bekijken.
- Mogelijke redenen en oorzaken bij niet-weergeven:
- Beperking van het dataverkeer
- Voorkomen dat kinderen of collega's 'not-safe-for-work' (NSFW)-materiaal zien
- Vanwege auteursrechten of andere juridische of commerciële overwegingen mag het element slechts in een beperkt gebied of gedurende een beperkte tijd getoond worden
- Simpele technische fouten, zoals een spelfout in de link naar de afbeelding
- Het materiaal voldoet niet aan bepaalde specificaties, de weergave-software is niet beschikbaar of er zijn zorgen rond de veiligheid
- Voorkomen dat spam-links geactiveerd worden, zoals bij mail in de map met ongewenste berichten; het alt-attribuut geeft dan toch nog een indicatie, maar soms wordt dit ook niet getoond.
Geschiedenis en doel
[bewerken | brontekst bewerken]Het alt-attribuut werd geïntroduceerd in HTML2 en is vanaf HTML 4.01 verplicht voor de tags img en area. Het is optioneel voor de input-tag en de verouderde applet-tag.
- De area-tag geeft aan wat er op een bepaald deel van een afbeelding te zien is: op een groepsfoto bijvoorbeeld de namen van de mensen, op een kaart van de Verenigde Staten de namen van de staten.
- De input-tag geeft het doel van een klikvlak weer, bijvoorbeeld: Klik om de bestelling af te ronden.
Voorbeeld
[bewerken | brontekst bewerken]
Bijgaande vlag is afkomstig van Wikimedia Commons. In dit geval is het alt-attribuut:
"Wapperende rode vlag met een wit kruis: de vlag van Denemarken".
De HTML voor deze afbeelding kan zijn:
<img alt="Wapperende rode vlag met een wit kruis: de vlag van Denemarken" src="http://upload.a.org/wikipedia/commons/thumb/8/83/Dannebrog.jpg/180px-Dannebrog.jpg">
- ↑ (en) Web Content Accessibility Guidelines (WCAG) 2.0. www.w3.org. Gearchiveerd op 5 september 2025. Geraadpleegd op 8 september 2025. “Principle 1: Perceivable - Information and user interface components must be presentable to users in ways they can perceive. Guideline 1.1 Text Alternatives: Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language.”
- ↑ (en) H37: Using alt attributes on img elements | Techniques for WCAG 2.0. www.w3.org. Gearchiveerd op 9 augustus 2025. Geraadpleegd op 8 september 2025.
- ↑ Groenemans, James, Alt tag. Online Marketing Monkey. Gearchiveerd op 22 november 2021. Geraadpleegd op 22/11/2021.