ARIAコマンドにはアクセス可能な名前が必要です
ルールID:
aria-command-name
ルールセット:
axe-core 4.10
ユーザーへの影響:
深刻
ガイドライン:
WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), Trusted Tester, EN 301 549
Accessibility testing for dev teams - No experience required
Find and fix up to 80% of accessibility issues with axe DevTools Pro. Get started with your free trial today. No credit card needed.
Compliance Data & Impact
修正方法
正しいマークアップソリューション
aria-command-name テスト基準を満たす4つのマークアップパターンがあるルールです。
<div role="link" id="al" aria-label="Name"></div>
<div role="button" id="alb" aria-labelledby="labeldiv"></div>
<div role="menuitem" id="combo" aria-label="Aria Name">Name</div>
<div role="link" id="title" title="Title"></div>
-
role="link"、role="button"、またはrole="menuitem"の各要素が次のいずれかの特性を持つことを確認してください。- スクリーンリーダーユーザーが認識できる内部テキスト。
- 空でない
aria-label属性。 -
aria-labelledbyを、スクリーンリーダーのユーザーが認識できるテキストを含む要素を指します。
誤ったマークアップソリューション
aria-command-name ルールには、テスト基準を満たさない4つのマークアップパターンがあります。
<div role="link" id="empty"></div>
<div role="button" id="alempty" aria-label=""></div>
<div role="menuitem" id="albmissing" aria-labelledby="nonexistent"></div>
<div role="link" id="albempty" aria-labelledby="emptydiv"></div>
<div id="emptydiv"></div>なぜ重要なのか
スクリーンリーダーのユーザーは、アクセシブルな名前を持たない role="link"、 role="button"、または role="menuitem" の要素の目的を判別できません。
ルールの説明
ARIAコマンド要素には、スクリーンリーダーユーザー向けに目的地、目的、機能、またはアクションを明確に説明する識別可能なテキストが必要です。
仕組みについて (簡単に言うと)
role="link"、 role="button"、または role="menuitem" を持つすべての要素をチェックして、識別可能でアクセス可能な名前が付けられていることを確認します。
リソース
Deque University コースのページ (要登録)
関連するコース情報はありません。
axe 4.10 ルールの一覧 を参照する
この情報は役に立ちましたか?
すでにフィードバックをいただきました、ありがとうございます。.
あなたの回答は次のとおりです。
この情報は役に立ちましたか?
フィードバックが提出された日付/時刻:
フィードバックが提出された日付/時刻: