ページには繰り返しブロックをスキップする手段が必要です

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

Learn Web Accessibility

Subscribe to our extensive curriculum of online self-paced courses

Compliance Data & Impact

User Impact

Disabilities Affected

  • 盲目
  • 盲ろう者

Standard(s)

  • WCAG 2.1 (A)
  • WCAG 2.0 (A)
  • WCAG 2.2 (A)
  • Section 508
  • Trusted Tester
  • EN 301 549

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

  • 2.4.1: Bypass Blocks

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

  • 2.4.1: Bypass Blocks

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

  • 2.4.1: Bypass Blocks

Section 508 ガイドライン

  • 1194.22: Web based intranet and Internet Information & Applications
  • 1194.22 (o): A method shall be provided that permits users to skip repetitive navigation links.

Trusted Tester 指南

  • 9.A: A keyboard-accessible method is provided to bypass repetitive content.

    修正方法

    各ページに main ランドマークを設置するようにしてください。これにより、繰り返し表示されるコンテンツ ブロックやインターフェイス要素 (ヘッダーやナビゲーションなど) を回避して、メイン コンテンツにすばやく到達できるメカニズムが提供されます。

    ランドマークは、メイン コンテンツ セクションなどのレイアウトの事前定義された部分を指定するために使用すべきです。

    ページには、メインランドマークのインスタンスが複数含まれるべきではありません。

    HTML5対ARIA:

    一般的なルールとして、通常は、可能な限りARIAロールではなく、ネイティブのHTML要素を使用するのが最善です。したがって、ARIAロール role="main" はほとんどのスクリーン リーダーによってランドマークとしてリストされていますが、 main HTML5要素を優先して使用します。

    良い例: 適切なランドマークの使用

    この例では、すべてのコンテンツはランドマーク内にあり、ランドマークはさまざまな種類のコンテンツを適切に識別するために使用されます。

    コードを開始します:
    <header>
      <div>This is the header.</div>
    </header>
    <nav>
      <div>This is the navigation.</div>
    </nav>
    <main>
      <div>This is the main content.</div>
      <section>
        <div>This is a section.</div>
      </section>
      <article>
        <div>This is an article.</div>
      </article>
      <aside>
        <div>This is an aside.</div>
      </aside>
    </main>
    <footer>
      <div>This is the footer.</div>
    </footer>
    コードを終了します。

    なぜ重要なのか

    ウェブサイトでは、多くの場合、複数のページに二次的なコンテンツ(ナビゲーション リンク、見出しグラフィック、広告フレームなど)が繰り返し表示されるため、キーボードのみを使用するユーザーは、ページ上の主要なコンテンツに、より高速かつ直接的にアクセスできるというメリットがあります。これにより、キーストロークが減り、それに伴う身体的苦痛が最小限に抑えられます。

    マウスを使用できないユーザーの場合、インターフェイスにキーボード ナビゲーションを容易にする方法が含まれていないと、キーボードによるナビゲーションはより困難で時間がかかります。たとえば、Webページの中央にあるリンクをアクティブにするには、キーボード ユーザーは、ページのヘッダーとメイン ナビゲーションにある多数のリンクとボタンをタブで移動する必要がある場合があります。

    極端な場合、重度の運動障害を持つユーザーは、これらすべての要素をタブで操作するのに数分かかる可能性があり、一部のユーザーにとっては疲労や身体的痛みにつながる可能性があります。制約がそれほど厳しくないユーザーでも、マウスを使用するユーザーよりもリンクをクリックするのに時間がかかります。マウスを使用するユーザーは、目的のリンクを1秒か2秒でクリックできます。

    ルールの説明

    各ページには、繰り返し表示されるコンテンツ ブロックやインターフェイス要素 (ヘッダーやナビゲーションなど) を回避してメイン コンテンツにすばやく到達するためのメカニズムを提供する main ランドマーク領域が必要です。

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

    以下の機能の少なくとも1つをチェックします。

    • 内部スキップリンク
    • 見出し
    • ランドマーク領域

    リソース

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

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

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

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

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