aria-labelledby別の要素を参照して名前を組み立てる
WEB ACCESSIBILITY · NAME COMPUTATION
Accessible Name Inspector
見えている名前と、伝わる名前を比べる。 HTMLのどこから名前が決まるかを見る。
LIVE NAME INSPECTOR
同じ見た目でも、名前は変わる
6 CASESNEEDS A NAME
HOW A NAME IS FOUND
最初に使える名前が採用される
aria-label属性に直接、短い名前を書く
labelやaltなどを使う
要素内のテキストから名前を取る
目的を短く伝える
同種の要素を区別できる、短く安定した名前にします。
ネイティブHTMLを使う
buttonやinputなら、役割と操作方法も一緒に伝わります。
状態を名前へ混ぜない
aria-pressedなどを使い、名前を操作のたびに変えないようにします。