数時間前に私はariaラベル属性:
現在の要素にラベルを付ける文字列値を定義します。
しかし、私の意見では、これがこのtitle属性が行うべきことだったのです。Mozilla 開発者ネットワークいくつかの例と説明を知りたかったのですが、見つかったのは
<button aria-label="Close" onclick="myDialog.close()">X</button>
ラベルが付いていないので、私は誤解していると思います。ここで試してみました。jsfiddle。
そこで質問なのですが、なぜ必要なのかaria-label、どのように使用すればよいのか？
ベストアンサー1
これは、支援技術(例: スクリーン リーダー) 匿名の HTML 要素にラベルを添付します。
つまり、次の要素があります<label>:
<label for="fmUserName">Your name</label>
<input id="fmUserName">
は<label>、ユーザーに、inputボックスに名前を入力するように明示的に指示しますid="fmUserName"。
aria-labellabelほぼ同じことを行いますが、画面上に表示することが実用的ではない、または望ましくない場合に使用します。
<button aria-label="Close" onclick="myDialog.close()">X</button>`
ほとんどの人は、このボタンをクリックするとダイアログが閉じることを視覚的に推測できます。補助技術を使用している視覚障害者は、「X」が読み上げられるのを聞くだけかもしれませんが、視覚的な手がかりがなければあまり意味がありません。aria-labelボタンが何をするかを明示的に伝えます。