Was die Norm sagt
Bei Benutzerschnittstellen-Komponenten mit Beschriftungen, die Text oder Bilder eines Textes enthalten, enthält der Name den Text, der visuell dargestellt wird.
Warum das zählt
Wer per Sprache steuert, sagt, was er sieht. Steht auf dem Button „Senden“, heißt er zugänglich aber „Formular absenden“, passiert bei „klicke Senden“ nichts.
Wie ein Fehlschlag aussieht
- fällt durchEin Button mit der Aufschrift „Suchen“ und `aria-label="Absenden"`.
- fällt durchEin `aria-label`, das den sichtbaren Text ersetzt, statt ihn zu erweitern.
So beheben Sie es
- tunBeginnen Sie den zugänglichen Namen mit dem sichtbaren Text: `aria-label="Produkte suchen"` auf einem Button mit der Aufschrift „Suchen“.
- tunNoch besser: eine sichtbare Beschriftung gar nicht erst überschreiben.
Wie A11ySignal es prüft
Bei jedem Scan läuft 1 automatische Prüfung gegen dieses Kriterium.
schwerwiegendlabel-content-name-mismatchElemente müssen ihren sichtbaren Text auch als Teil des zugänglichen Namens (accessible name) haben.