Zoekformulier
Tekstalternatief toevoegen aan een <svg>-element
Een tekstalternatief kan op een aantal manieren worden toegevoegd aan een <svg>-element. De beste manier is met het <title>-element in het <svg>-element, samen met het aria-labelledby-attribuut op het <svg>-element.
In de code ziet dat er zo uit:
Voeg voor compatibiliteit met verschillende hulptechnologieën altijd role=“img” toe aan het <svg>-element van een informatieve, functionele of complexe afbeelding.
Het <title>-element is niet de enige manier om een tekstalternatief toe te voegen aan een <svg>-element. Een andere mogelijkheid is het aria-label-attribuut.
Voorbeeld: Tekstalternatief toevoegen aan een <svg>-element met het aria-label-attribuut
Een tekstalternatief voor een <svg>-element kan worden gegeven met het aria-label-attribuut.
In de code ziet dat er zo uit:
Voorbeeld: Tekstalternatief toevoegen aan een <svg>-element met het aria-labelledby-attribuut
Een tekstalternatief voor een <svg>-element kan worden gegeven met het aria-labelledby-attribuut.
In de code ziet dat er zo uit:
Zie ook
- WCAG: 1.1.1 Niet-tekstuele content
- Categorie: Afbeeldingen
- Medium: Website
- Functiegroep: Ontwikkelaar of tester
- Functiebeperking: Visuele beperking