「role=text」にはフォーカス可能な子孫が存在すべきではない

ルールID: aria-text
ルールセット: axe-core 4.10
ユーザーへの影響:
ガイドライン: Deque Best Practice

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

User Impact

Disabilities Affected

  • 盲目
  • 運動・器用さ

Standard(s)

  • Deque Best Practice

    修正方法

    正しいマークアップソリューション

    role="text" 「The」属性は、フォーカス可能な子孫を持たない要素に配置する必要があります。 

    <h1><span role="text">Hello <br/>World</span></h1>

    誤ったマークアップソリューション

    <span role="text">
  <a href="/site.html">Not announced as link</a>
</span>

    なぜ重要なのか

    テキスト ノードがマークアップによって分割されている場合 (例: <h1>Hello <span>World</span></h1>)、VoiceOverはそれを1つのフレーズではなく2つの別々のフレーズとして扱います。要素の周囲に role="text" を追加すると、問題は解決します。ただし、要素とすべての子孫の役割もオーバーライドされ、すべてがテキスト ノードとして扱われます。子孫要素の1つもフォーカス可能である場合は、空のタブ ストップが作成されます。つまり、要素にタブ移動することはできますが、VoiceOverではその要素の名前、役割、または値が読み上げられません。

    ルールの説明

    role="text" "Elements with"を持つ要素には、フォーカス可能な子孫があってはなりません。

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

    role="text" "elements with"を持つすべての要素をチェックして、フォーカス可能な子孫がないことを確認します。

    リソース

    Deque University コースのページ (要登録)

    関連するコース情報はありません。

    GitHub で axe-core に貢献する

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

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

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

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

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