Een Nederlandstalige website. Een knop. Op het scherm staat “Submit.” Het aria-label zegt “Verzenden.”
De gebruiker ziet “Submit.” Zegt: “Klik op Submit.” De toegankelijke naam is “Verzenden.” Geen match.
Of andersom: de gebruiker ziet “Submit” en probeert “Klik op Verzenden” (want de website is Nederlands). De zichtbare tekst is “Submit.” Ook geen match.
<!-- Niet doen: zichtbaar Engels, aria-label Nederlands -->
<button aria-label="Verzenden">Submit</button>
<!-- Wel doen: alles in dezelfde taal -->
<button>Verzenden</button>
<!-- Of: als het Engels moet blijven -->
<button aria-label="Submit form">Submit</button>
De les: de zichtbare tekst en de toegankelijke naam moeten in dezelfde taal zijn. En de zichtbare tekst moet onderdeel zijn van de toegankelijke naam.
Het simpelst: gebruik geen aria-label. Dan is de zichtbare tekst automatisch de toegankelijke naam. Geen mismatch mogelijk.
