aria-labelとは? aria-labelledbyとの違いは? | クズリーマンのカス備忘録

aria-labelとは? aria-labelledbyとの違いは?

accessibility-logo Webアクセシビリティ
スポンサーリンク

WAI-ARIAで使用するaria属性の一種ですな。

aria-labelとは

MDNのせつめい:

aria-label 属性は、現在の要素にラベル付けする文字列を定義するために使用されます。 これはテキストラベルが画面に表示されない場合に使用します。

https://developer.mozilla.org/ja/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute

 

 

WCAGの説明:

aria-label 属性は、ボタンなど、オブジェクトのテキストラベルを提供する。スクリーンリーダーがオブジェクトに遭遇した際、aria-label テキストが読み込まれ、利用者はそのオブジェクトがどのようなものかを知ることができる。

ARIA6: オブジェクトのラベルを提供するために aria-label を使用する | WCAG 2.0 達成方法集

制作者は、aria-labelledby が同じオブジェクトに使用される状況では、aria-label が支援技術によって無視される場合があることに注意すべきである

 

aria-labelledbyとは?aria-labelとの違いは?

 

MDNの説明:

要素にラベル付けする目に見えるテキストがある場合は、代わりに aria-labelledby を使用します。

 

  • 見えないテキストは、aria-label で指定する
  • 見えるテキストは、aria-labelledby で指定する

 

っちゅーこっちゃ。

 

 

この属性は、一般的な HTML 要素で使用できます。 ARIA のroleが割り当てられている要素に限定されるものではありません。

 

コメント

タイトルとURLをコピーしました