ページには複数のバナーランドマークを含めることはできません

ルールID: landmark-no-duplicate-banner
ルールセット: axe-core 4.10
ユーザーへの影響: 普通
ガイドライン: Deque Best Practice
 

Start building more accessible experiences

Axe DevTools Pro helps dev teams find and fix up to 80% of accessibility issues while coding. No experience required. Get started with your free trial today.

Compliance Data & Impact

User Impact

普通
Minor
Critical

Disabilities Affected

  • 目の見えるキーボードユーザー
  • 視覚障害
  • 視聴覚障害

Standard(s)

  • Deque Best Practice

    修正方法

    個別の HTML ページに banner ランドマークが一つのみであることを確認します。

    どの banner ランドマークを残したいかを考え、その他の banner ランドマークを削除します。

    HTML5 の仕様書は同等の header ランドマーク値の複数インスタンスを許可していますが、role="banner" ARIA ランドマークは HTML ドキュメントで一意の要素に一度のみ現れるべきです。ほとんどの web デザインでは、ARIA または HTML5 で指定されているかに関わらず、banner ランドマークは一つのみであることが適切です。

    なぜ重要なのか

    ランドマークは全盲のユーザーが素早くナビゲートし、コンテンツを見つけることを可能にします。ランドマークが不足していると、スクリーン・リーダーのユーザーは、何を見つけるにしても多くの余分な情報を整理しなければならなくなります。

    JAWS、NVDA、そして VoiceOver は ARIA ランドマークを使って web ページのセクションをナビゲートする機能をサポートしています。ランドマークはユーザーが web ページのメインコンテンツにスキップする方法を提供するという問題に対して、より洗練された解決方法を提供します。Web デザインに対して可視な変更は加えられないため、目立たず、不可視にできます。もちろん、この方法が不可視であるという事実は全盲のスクリーン・リーダーのユーザーにとっては問題ありませんが、目の見えるキーボードユーザーやロービジョンのスクリーンを拡大しているユーザーにとっては良くありません。その意味では、HTML5 領域や ARIA ランドマークは昔からの「スキップリンク」をまだ置き換えることはできません。ブラウザーにはまだ、HTML5 領域または ARIA ランドマークが存在することをユーザーに通知する組み込まれた方法がありません。スクリーン・リーダーのユーザーだけがこれらの強みを活かすことができます。Firefox 内でランドマークをナビゲートする機能を追加する Firefox ARIA landmark extension 新規ウィンドウで開きます という拡張機能が存在しますが、これはブラウザーのネイティブ機能ではありません。

    ルールの説明

    banner ランドマークはページに最高でも一つのみであることを確認します。

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

    このルールはすべての banner ランドマークを探し、それらのロールを反映しないあらゆるランドマークを除外し、複数存在しないことを確認します。

    リソース

    その他のリソース

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

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

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

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

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

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