達成基準 2.4.3 の失敗例 - 連続するナビゲーション順序において、トリガーとなるコントロールに隣接していないダイアログ又はメニューを使用している

達成方法に関する重要な情報

この達成方法 (参考) の使用法と、この達成方法が WCAG 2.1 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.1 を満たすコンテンツを作成するために使用できることを意味するものではない。

適用 (対象)

全てのウェブコンテンツ技術

これはSuccess Criterion 2.4.3: Focus Order (失敗) に関する達成方法である。

解説

この文書では、連続するナビゲーション順序の中での順番が原因で、キーボードだけで操作している利用者がウェブページ上に実装されたダイアログ又はメニューのインタフェースコンポーネントの操作が困難になってしまう失敗例について述べている。ボタン又はリンクを起動してウェブページ上のダイアログ又はメニューを開いたとき、利用者の次の行動は、ダイアログ又はメニューを操作することである。もしフォーカスがダイアログ又はメニューに設定されていないと、連続するナビゲーション順序の中で、トリガーとなるコントロールと連続していない場合、キーボードだけで操作している利用者がダイアログ又はメニューを操作することが困難になる。

事例

例 1: ウェブページ上のダイアログ又はメニューが連続するナビゲーション順序の最後に追加されている

DHTML のメニュー又はダイアログは、起動されると、動的に生成され、視覚的にはトリガーの近くに配置され、DOM の最後に付け加えられる。DOM の最後に付け加えられるため、連続するナビゲーション順序の最後となる。利用者は、メニュー又はダイアログを操作するまでに、ページ上の残りの部分をタブ操作で進んで行かなければならない。

例 2: ページ上に実装されたメニューを閉じるとフォーカスがドキュメントに設定される

メニューが閉じられるとき、メニューはウェブページから削除又は隠されてフォーカスはドキュメントの先頭に設定される。利用者はメニューを開いた場所までナビゲーション順序の最初からタブを操作しなおさなければならない。

検証

手順

トリガーとなるコントロールによって開くウェブページ上に埋め込まれた各メニュー又はダイアログに対して:

  1. トリガーとなるコントロールをキーボードで起動させる。

    • メニュー又はダイアログにフォーカスがあるかどうかを確認する。
    • 連続するナビゲーション順序においてフォーカスを進めていくと、メニュー又はダイアログにフォーカスが置かれるかどうかを確認する。
  2. メニュー又はダイアログを閉じる。

    • トリガーとなるコントロールにフォーカスがあるかどうかを確認する。
    • 連続するナビゲーション順序においてフォーカスを後ろに戻すと、トリガーとなるコントロールにフォーカスが置かれるかどうかを確認する。

期待される結果

  • #1 の結果が両方とも偽である場合、この失敗例の条件は適用され、コンテンツは達成基準の失敗となる。
  • #2 の結果が両方とも偽である場合、この失敗例の条件は適用され、コンテンツは達成基準の失敗となる。