Stellt sicher, dass aria-braillelabel und aria-brailleroledescription ein entsprechendes Bon-Braille-Äquivalent haben
Blind
Sehbehindert
Hören
Mobilität
WCAG 2.2 Level A
Von Menschen für Menschen geschrieben und recherchiert
Casandra Visser
Autor
Yotam Flohr
Forscher
Ritvik Shrivastava
Fachmännisch überprüft von
Kommentare:
0
Die Anforderungen an die Barrierefreiheit im Web besagen, dass das Attribut aria-braillelabel nur bei Elementen mit einem zugänglichen Namen verwendet werden sollte. Zusätzlich sollte aria-brailleroledescription nur bei Elementen mit einer aria-roledescription verwendet werden.
Warum es wichtig ist
ARIA-Braille-Attribute ermöglichen es, Beschriftungen und Rollenbeschreibungen für eine Braillezeile anzupassen.
Sie können jedoch nicht das einzige Attribut sein, das eine Beschriftung oder Rollenbeschreibung bereitstellt. Wenn keine entsprechende Beschriftung oder Rollenbeschreibung verwendet wird, ignoriert ARIA diese Attribute. Es sollte jedoch beachtet werden, dass dies nicht immer bei allen Screenreadern und anderen unterstützenden Technologien der Fall ist.
Behebung des Problems
- Stellen Sie sicher, dass das Attribut aria-braillelabel oder aria-brailleroledescription nicht am falschen Element platziert wurde, z. B. an einem übergeordneten oder untergeordneten Element des korrekten Elements.
- Alle Elemente mit einem aria-braillelabel-Attribut benötigen ein aria-label-Attribut oder ein anderes Attribut, das ihnen einen zugänglichen Namen gibt.
- Alle Elemente mit einem aria-brailleroledescription-Attribut benötigen ein aria-roledescription-Attribut.
- Wenn ein aria-braillelabel- oder aria-brailleroledescription-Attribut keine Funktion hat, muss es entfernt werden.
Gutes Codebeispiel (aria-braillelabel)
Codebeispiel
<button aria-braillelabel="****">
<img alt="4 Sterne" src="images/stars.jpg">
</button>
Kopieren Schlechtes Codebeispiel (aria-braillelabel)
Gutes Codebeispiel (aria-brailleroledescription)
Codebeispiel
<div role="article" id="slide" aria-labelledby="slideheading" aria-roledescription="Folie" aria-brailleroledescription="sld">
<h1 id="slideheading">Mein Urlaub in Rom</h1>
</div>
Kopieren Schlechtes Codebeispiel (aria-brailleroledescription)
Codebeispiel
<div role="article" id="slide" aria-labelledby="slideheading" aria-brailleroledescription="Folie">
<h1 id="slideheading">Mein Urlaub in Rom</h1>
</div>
Kopieren