aria-roledescriptionはセマンティックロールを持つ要素になければなりません

ルールID: aria-roledescription
ルールセット: axe-core 4.10
ユーザーへの影響:
ガイドライン: WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), EN 301 549

Need accessibility training?

Deque University offers an extensive curriculum of self-guided online courses for every skillset and experience level.

Compliance Data & Impact

User Impact


Minor
Critical

Disabilities Affected

  • 盲目
  • 盲ろう者
  • 運動・器用さ

Standard(s)

  • WCAG 2.1 (A)
  • WCAG 2.0 (A)
  • WCAG 2.2 (A)
  • EN 301 549

WCAG 達成基準 [WCAG 2.1 (A)]

  • 4.1.2: Name, Role, Value

WCAG 達成基準 [WCAG 2.0 (A)]

  • 4.1.2: Name, Role, Value

WCAG 達成基準 [WCAG 2.2 (A)]

  • 4.1.2: Name, Role, Value

EN 301 549 指南

  • 9.4.1.2: Name, Role, Value

修正方法

ARIAは、特定のロールに対してどの属性が許可されるか、また各属性がどこで使用される可能性があるかを明示的に定義します。各属性の詳細情報については、各ロールおよび/または各属性のドキュメントを参照してください。

aria-roledescription ルールには、失敗条件が2つ、成功条件が3つ、不完全条件が2つ含まれています。

aria-roledescriptionの失敗条件:

aria-roledescription は、ロール値を指定する必要がある要素でロール値を持たない要素に対してfalseを返します。

  • <p aria-roledescription="my paragraph" id="fail1">paragraph</p>
  • <div aria-roledescription="my div" id="fail2">div</div>

aria-roledescription合格条件:

  • aria-roledescription は、 明示的に サポートされているロールを持つ要素に対して true を返します。
  • aria-roledescription は、 暗黙的に サポートされているロールを持つ要素に対して true を返します。
  1. <img aria-roledescription="my img" src="foo.png" id="pass1" />
  2. <button aria-roledescription="my button" id="pass2">button</button>
  3. <div role="combobox" aria-roledescription="my combobox" id="pass3"></div>

aria-roledescription不完全な状態:

aria-roledescription は、サポートされていないロールを持つ要素に対して undefined を返します。

  1. <h1 aria-roledescription="my heading" id="incomplete1">heading</h1>
  2. <div role="rowgroup" aria-roledescription="my row" id="incomplete2"></div>

具体的な参照: HTML要素で使用できるARIA属性と使用すべきでないARIA属性の詳細については、 HTMLでのARIA - HTMLでのARIA属性の使用に関するドキュメント適合要件を参照してください。 opens in a new window.aria-roledescription 属性の使用に関する詳細については、 HTMLのARIA - aria-roledescription (プロパティ) を参照してください。 opens in a new window.

一般的なリファレンス: ARIAの一般的な情報については、次の外部リソースを参照してください。ARIAは主にWeb開発者やプログラマーによって使用され、ARIAを効果的に実装するには通常JavaScriptのスキルが必要です。プログラミングロジックの複雑さと、ARIAの有効な組み合わせを要求する仕様の微妙な差異により、ARIAの学習は長いプロセスになる可能性があります。 role aria-roledescription

なぜ重要なのか

要素の暗黙的または明示的な aria-roledescription 値と競合する不適切な role 属性値は、Webページのアクセシビリティを妨げる可能性があります。競合する aria-roledescription 属性値は、アプリケーションのアクセシビリティには影響を及ぼさない可能性があり、アプリケーション全体のアクセシビリティを無効にする動作を引き起こす可能性があります。

aria-roledescription属性がWAI-ARIA 1.1に準拠していないHTML要素に適用されると、 aria-roledescription 値と暗黙的または明示的な要素 role 値の間で意味が競合し、支援技術製品が意図したユーザー インターフェイス (UI) エクスペリエンスを正しく表さない無意味なUI情報を報告する可能性があります。

ルールの説明

aria-roledescription 属性が暗黙的または明示的な role 値を持つ要素でのみ使用されるようにします。

仕組みについて (簡単に言うと)

暗黙的または明示的な要素の値を適切に記述するには、 aria-roledescriptionrole を使用します。

リソース

axe 4.10 ルールの一覧 を参照する

この情報は役に立ちましたか?

すでにフィードバックをいただきました、ありがとうございます。.

あなたの回答は次のとおりです。

この情報は役に立ちましたか?
フィードバックが提出された日付/時刻: