aria-labelledby属性
aria-labelledby属性は要素とラベルを関連付けるWAI-ARIA属性です。
利用方法はlabel要素に対するfor属性と同じで、関連付けたい要素のid属性をaria-labelledby属性の値として指定します。
<p id="yourName">名前</p>
<p><input type="text" name="yourName" aria-labelledby="yourName"></p>
リンクのラベル付
以下のように指定をすることでリンクに対してラベル付を行うこともできます。
<h2 id="title">aria-labelledby属性とは?lt;/h2>
<p>aria-labelledby属性は要素とラベルを関連付けるWAI-ARIA属性です。
<a id="link" href="aria-labelledby.html" aria-labelledby="link title">詳細</a></p>
このように指定を行うとスクリーンリーダーなどの支援デバイスは「詳細 aria-labelledby属性とは?」といった内容でリンクを評価します。
評価対象
スクリーンリーダーなどの支援デバイスは、
aria-labelledby属性 > aria-label属性 > テキストの内容
の順に評価れる為、自身のテキストの内容も評価されたい場合は自身の関連付けを行います。
参考URL
aria-labelledby - WAI-ARIA - W3C
登録日 : 2015年10月12日 最終更新日 : 2018年1月7日
同じカテゴリー(WAI-ARIA)のエントリー
- aria-required属性
- aria-current属性
- aria-orientation属性
- aria-multiselectable属性
- aria-multiline属性
- aria-live属性
- aria-level属性
- aria-labelledby属性
- aria-label属性
- aria-invalid属性
- aria-hidden属性
- aria-haspopup属性
- aria-grabbed属性
- aria-flowto属性
- aria-expanded属性
- aria-dropeffect属性
- aria-disabled属性
- aria-describedby属性
- aria-checked属性
- aria-controls属性
- aria-busy属性
- aria-autocomplete属性
- aria-atomic属性
- aria-activedescendant属性
- role属性