it-swarm.com.de

Der Zweck der Verwendung von "aria-labelledby" für bereits beschriftete Eingabeelemente?

Viele ARIA-Demonstrationswebsites verwenden Code wie:

<label for="name" id="label-name">Your Name</label>
<input id="name" aria-labelledby="label-name" type="text">


Aber wozu dient aria-labelledby Attribut in diesem Fall? Das Element input wurde bereits durch das Element label gekennzeichnet, das das Attribut for verwendet, nicht wahr?

76
Ian Y.

Es gibt einige gute Beispiele für seine Verwendung unter Mozilla-Entwicklerseiten . Vielleicht ist das beste ihrer Beispiele, wo es verwendet wird, um ein Popup-Menü mit dem übergeordneten Menüelement zu verknüpfen - es ist Beispiel 7 auf der Seite:

<div role="menubar">  
    <div role="menuitem" aria-haspopup="true" id="fileMenu">File</div>  
    <div role="menu" aria-labelledby="fileMenu">  
        <div role="menuitem">Open</div>  
        <div role="menuitem">Save</div>  
       <div role="menuitem">Save as ...</div>  
       ...  
    </div>  
    ...  

ARIA-Attribute sind in der Regel am nützlichsten, wenn Sie barrierefreie Rich-Internet-Anwendungen erstellen : Solange Sie sich an semantisches Standard-HTML halten und Formulare mit Standardbezeichnungen verwenden - Sie sollten es überhaupt nicht brauchen: Es gibt also keinen Grund, es für ein LABEL/INPUT-Paar zu verwenden. Wenn Sie jedoch eine "reichhaltige Benutzeroberfläche" von Grund auf erstellen (DIVs und andere Elemente auf niedriger Ebene mit Javascript, das Interaktivität hinzufügt), ist dies wichtig, damit ein Bildschirmleser weiß, was die Absicht auf höherer Ebene ist.

63
BrendanMcK

Es gibt immer UA-Support-Probleme mit Neuem, daher achten Entwickler auf die fortschreitende Verbesserung. Diese ARIA-Technik bietet die Möglichkeit, das Attribut "for" zu entfernen und andere Elemente als Teil der Rich-Form zu verwenden. Diese Techniken werden zur gängigen Praxis.

4
user2323922