アサイドは別のランドマークに含まれてはならない

ルールID: landmark-complementary-is-top-level
ルールセット: 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


Minor
Critical

Disabilities Affected

  • 視覚を用いるキーボードユーザー
  • 盲目
  • 盲ろう者
  • 運動・器用さ

Standard(s)

  • Deque Best Practice

    修正方法

    このベスト プラクティス ルールにより、 aside 要素またはその要素に role=complementary が別のARIAランドマークの内部部分ではないことが保証されます。ランドマークをネストすると、ドキュメント構造がわかりにくくなります。このルールは、バナー、コンテンツ情報、メイン ロールに対して同じ ARIA 要件をテストする既存のルールに似ています。

    次の例は、補完的なランドマークが最上位レベルにあるというルールに適合しません。

    <main> 
    <p>Some text</p> 
    <aside><p>An aside</p></aside>
    </main>

    次の例は、補完的なランドマークが最上位レベルにあるというルールを満たします。

    <main><p>Some text</p></main>
    <aside>An aside</aside>

    なぜ重要なのか

    補足コンテンツは、ドキュメントまたはページのメインテーマに対する補助的なコンテンツです。スクリーン リーダーのユーザーには、アクセシビリティAPIの最上位レベルに補足コンテンツが表示された場合に、そのコンテンツをスキップするオプションがあります。別のランドマークに <aside> 要素を埋め込むと、スクリーン リーダーの機能が無効になり、ユーザーが補足コンテンツ内を移動できなくなる可能性があります。

    ルールの説明

    補完的なランドマークまたはアサイドが最上位にあることを確認します

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

    ランドマークとしてマークアップされた他のコンテンツ内に <aside> 要素または role="complementary" を含む要素を含めないでください。

    リソース

    その他のリソース

    その他リソースもあわせてご参照ください。

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

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

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

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

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