アクセシビリティ・サポーテッド（AS）情報：G123-4a

G123-4a: 繰り返しているコンテンツのブロックの開始位置に、そのブロックの終了位置へのリンクを追加する

関連する達成基準の実装方法一覧

7.2.4.1ブロックスキップに関する達成基準 (等級A)

テストファイル

G123-4aのテストファイル

見解

要注意

対象

常に表示されているナビゲーションスキップ

注意点

スクリーンリーダーのPC-Talkerがサポートしておらず、VoiceOverでもうまく動作しない。FirefoxとSafariはサポートしているが、IE6, IE7によるサポートが不十分。なお、IE8ならばキャレットブラウジングでキーボード操作していれば、メインコンテンツへ移動できる。
過度なスキップリンクの使用は、逆にアクセシビリティやユーザビリティを損なう恐れがあるので避けたほうがよい。

代替もしくは推奨する方法

WAI-ARIAのlandmarkを使用し、ブロックに対して適切なlandmarkを指定することで、そのブロックの読み飛ばしが可能になる場合がある。
※Techniques for WCAG 2.0の2014年1月版のEditors' Draftでは、実装方法ARIA11としてlandmarkを使用する方法が追加される予定である。

テスト結果の詳細

ユーザエージェント 検証結果 操作手順 備考
Internet Explorer 6.0 △ 1,「メインコンテンツへスキップ」、「メイン ナビゲーションをスキップ」、「サブ ナビゲーションをスキップ」、「ウルトラ サブ ナビゲーションをスキップ」が常に表示されている 2.「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「メインコンテンツへスキップ」にフォーカスがあたる
3.「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスがあたる
4.「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスがあたる
Internet Explorer 7.0 △ 「メインナビゲーションをスキップ」を押下するとテキストの色が変わるが、フォーカスが消える。その後Tabを押すと同じ位置にフォーカスが戻る、他のリンク先も同様で2，3，4は×となる。 1：○表示の状態のみOK
2：×
3：×
4：×
Internet Explorer 8.0 △ 「メインナビゲーションをスキップ」を押下するとテキストの色が変わるが、フォーカスが消える。その後Tabを押すと同じ位置にフォーカスが戻る、他のリンク先も同様で2，3，4は×となる。 1：○表示の状態のみOK
2：×
3：×
4：×
Internet Explorer 9 △ 1:4つのスキップリンクは常に表示されることを確認
2:「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動することを確認
3:：「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動することを確認
4:：「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動することを確認		 1:○　４つのリンクが表示されている
2:×　：「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「メインコンテンツへスキップ」に移動する
３:×　：「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブナビゲーション」に移動
4:×　：「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ 　サブナビゲーション」に移動
Firefox 3.5 ○ 1.４つのスキップリンクは常に表示されている。
2.キーボード操作 1：「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動した。
3.キーボード操作 2：「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動した。
4.キーボード操作 3：「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動した。
Firefox 4.0 ○ 1:4つのスキップリンクは常に表示されることを確認
2:「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動することを確認
3:：「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動することを確認
4:：「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動することを確認
Firefox 9.0 ○ 1:4つのスキップリンクは常に表示されることを確認
2:「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動することを確認
3:：「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動することを確認
4:：「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動することを確認
Safari 3.2 △ 1.４つのステップリンクが表示されている。
2.「メインナビゲーションをスキップ」を押下してからtabで移動するとその下の「リンクA」にフォーカスが移動する。
3.「サブナビゲーションをスキップ」を押下してからtabで移動するとその下の「リンクA」にフォーカスが移動する。
4.「ウルトラナビゲーションをスキップ」を押下してからtabで移動するとその下の「リンクA」にフォーカスが移動する。		 1.OK
2～4　スキップしなかったので、×。
（MacではOption+TabをTabとする。）
Safari 5.0.3 △ 1.４つのステップリンクが表示されている。
2.「メインナビゲーションをスキップ」を押下してからtabで移動するとその下の「リンクA」にフォーカスが移動する。
3.「サブナビゲーションをスキップ」を押下してからtabで移動するとその下の「リンクA」にフォーカスが移動する。
4.「ウルトラナビゲーションをスキップ」を押下してからtabで移動するとその下の「リンクA」にフォーカスが移動する。		 1: ○
2～4：×
（MacではOption+TabをTabとする。）
JAWS for Windows 9.0 × ■操作手順
1.「メイン ナビゲーションをスキップ」を押下した後、スキップ先の読み上げが始まる前と後にそれぞれTabキーを押して確認した。
2.「サブ ナビゲーションをスキップ」を押下した後、スキップ先の読み上げが始まる前と後にそれぞれTabキーを押して確認した。
3.「ウルトラ サブ ナビゲーションをスキップ」を押下した後、スキップ先の読み上げが始まる前と後にそれぞれTabキーを押して確認した。
■音声読み上げ
1.「メイン ナビゲーションをスキップ」を押下時→「メインナビゲーションをスキップ　ページ内リンク　ページに５個の見出しと１６個のリンクがあります　見出しレベル２　サブナビゲーション　ページ内リンク　サブナビゲーションをスキップ・・・（最後まで）」
2.「サブ ナビゲーションをスキップ」を押下時→「サブナビゲーションをスキップ　ページ内リンク　ページに５個の見出しと１６個のリンクがあります　見出しレベル２　ウルトラサブナビゲーション　ページ内リンク　ウルトラサブナビゲーションをスキップ・・・（最後まで）」
3.「サブ ナビゲーションをスキップ」を押下時→「ウルトラサブナビゲーション　ウルトラサブナビゲーションをスキップ　ページ内リンク　ナカテン　リンクＡ　ナカテン　リンクＢ・・・（最後まで）」		 1.「メイン ナビゲーションをスキップ」を押下した後、スキップ先の「サブナビゲーション」からの読み上げが始まる。読み上げが始まる前にタブを押すと「メインコンテンンツへスキップ」にフォーカスがあたり、読み上げが始まった後タブを押すと、読み上げ先にフォーカスがあたる。
2.3も同様である。
ホームページ・リーダー 3.04 ○ ■操作手順
各スキップリンクにフォーカスを移動させて、Enterキー押下
■音声読み上げ
「メインナビゲーションをスキップ、サブナビゲーション、リンクA」
「サブナビゲーションをスキップ、ウルトラサブナビゲーション、リンクA」
PC-Talker XP 3.06 × ■操作手順
1.「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「メインコンテンツへスキップ」にフォーカスが移動する。
2.「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと.「サブ ナビゲーションをスキップ」にフォーカスが戻る。
3.「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと.「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが戻る。
■音声読み上げ
「メイン ナビゲーションをスキップ　メインコンテンツへスキップメイン ナビゲーションをスキップ　リンクA・・・」
「サブ ナビゲーションをスキップ　サブ ナビゲーションをスキップ　リンクA ・・・」
「ウルトラ サブ ナビゲーションをスキップ　ウルトラ サブ ナビゲーションをスキップ　リンクA」		 1.サブナビゲーションへフォーカスが移動しないため、×。
2.「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動しないため、×。
3.「アクセシビリティ」にフォーカスが移動しないため、×。
PC-Talker XP 3.06 + NetReader 1.18 ○ ■操作手順
「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動する。
「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動する。
「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動する。
■音声読み上げ
「メインコンテンツへスキップ　メイン ナビゲーション　メイン ナビゲーションをスキップ　リンク A・・・」		 それぞれクリックした後にフォーカス移動した箇所で読み上げは一度止まるが、tabキーを使用することで目的の場所へフォーカスが移るため、○とした。
FocusTalk V3 △ ■操作手順
1.「メインナビゲーションをスキップ」でEnterを押すと「リンク C」と読み上げる。Tabを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動してゆく
2.「サブ ナビゲーションをスキップ」でEnterを押すと読み上げが停止する。Tabを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動してゆく
3.「ウルトラサブナビゲーションをスキップ」でEnterを押すと読み上げが停止する。Tabを押すと「アクセシビリティ」にフォーカスが移動してゆく
■音声読み上げ
「メインナビゲーションをスキップ、サブナビゲーション　（tab）リンクA」
「サブナビゲーションをスキップ、ウルトラサブナビゲーション、リンクA」		 1：△
tabを押下した後の動作は、テスト方法通りであるが、スキップリンクでEnterを押下した後に、一つ手前の「リンクC」と不要なものを読み上げる。
リンクを押下（Enter）した後、読み上げを待たずにTabを押して検証すると正当な動きはする
2：○
3：○
NVDA 2010.1j ○ ■操作手順
1. 「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動した。
2. 「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動した。
3. 「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動した。
■音声読み上げ
「サブ ナビゲーションをスキップ
ウルトラ サブ ナビゲーションをスキップ
アクセシビリティ」
NVDA 2011.1 ○ ■操作手順
1. 「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動した。
2. 「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動した。
3. 「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動した。
■音声読み上げ
「サブ ナビゲーションをスキップ
ウルトラ サブ ナビゲーションをスキップ
アクセシビリティ」
Firefox18.0.1 ○ 1:4つのスキップリンクは常に表示されることを確認
2:「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動することを確認
3:：「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動することを確認
4:：「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動することを確認
Google Chrome 25 △ 【1】4つのスキップリンク「メインコンテンツへスキップ」、「メイン ナビゲーションをスキップ」、「サブ ナビゲーションをスキップ」、「ウルトラ サブ ナビゲーションをスキップ」が常に表示されているかを確認する。
【2】「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動するかを確認する。
【3】：「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動するかを確認する。
【4】：「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動するかを確認する。		 【1】○
4つのスキップリンクは常に表示されることを確認した。
【2】×
「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「リンクA」に移動する。
【3】×
「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「リンクA」に移動する。
【4】×
「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「リンクA」に移動する。
Safari 6.0.5 × 「メイン ナビゲーションをスキップ」をリターンキーで押し下げてTabキーで移動した先は「リンク A」
「サブ ナビゲーションをスキップ」をリターンキーで押し下げてTabキーで移動した先は「リンク A」
「ウルトラ サブ ナビゲーションをスキップ」をリターンキーで押し下げてTabキーで移動した先は「リンク A」
NVDA 2012.3 ○ ■操作手順
1. 「メイン ナビゲーションをスキップ」を押下した後、Tabキーを押すと「サブ ナビゲーションをスキップ」にフォーカスが移動した。
2. 「サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すと「ウルトラ サブ ナビゲーションをスキップ」にフォーカスが移動した。
3. 「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Tabキーを押すとリンク「アクセシビリティ」にフォーカスが移動した。
■音声読み上げ
「サブ ナビゲーションをスキップ
ウルトラ サブ ナビゲーションをスキップ
アクセシビリティ」
PC-Talker 7 2.12 △ ■操作手順
1.「メイン ナビゲーションをスキップ」を押下した後、Ctrl＋下矢印キーまたはTabキーを押下
2.「サブ ナビゲーションをスキップ」を押下した後、Ctrl＋下矢印キーまたはTabキーを押下
3.「ウルトラ サブ ナビゲーションをスキップ」を押下した後、Ctrl＋下矢印キーまたはTabキーを押下
■音声読み上げ（Ctrl＋下矢印キーの場合：○）
「メイン ナビゲーションをスキップ」
Enterキー
「サブ ナビゲーション」
Ctrl＋下矢印キー
「サブ ナビゲーションをスキップ」
Enterキー
Ctrl＋下矢印キー
「ウルトラ サブ ナビゲーション」
Ctrl＋下矢印キー
「ウルトラ サブ ナビゲーションをスキップ」
Enterキー
Ctrl＋下矢印キー
「アクセシビリティを考える会」		 ■音声読み上げ（Tabキーの場合：×）
「メイン ナビゲーションをスキップ」
Enterキー
「サブ ナビゲーション」
Tabキー
「メイン ナビゲーションをスキップ」
Tabキーで移動
「サブ ナビゲーションをスキップ」
Enterキー
Tabキー
「ウルトラ サブ ナビゲーション」
Tabキー
（サブナビゲーションの）「リンクA」
Tabキーで移動
「ウルトラ サブ ナビゲーションをスキップ」
Enterキー
Tabキー
「アクセシビリティを考える会」
Tabキー
（ウルトラサブナビゲーションの）「リンクA」
VoiceOver × ■操作手順
1. 「メイン ナビゲーションをスキップ」をダブルタップすると「サブ ナビゲーション」にフォーカスが移動した後、「メイン ナビゲーションをスキップ」に戻る。
2. 「サブ ナビゲーションをスキップ」をダブルタップすると「ウルトラ サブ ナビゲーション」にフォーカスが移動した後、「サブナビゲーションをスキップ」に戻る。
3. 「ウルトラ サブ ナビゲーションをスキップ」をダブルタップすると「アクセシビリティを考える会」にフォーカスが移動した後、「ウルトラ サブナビゲーションをスキップ」に戻る。
■音声読み上げ
「メインコンテンツへスキップ ページ内リンク
サブ ナビゲーションをスキップ ページ内リンク
ウルトラ サブ ナビゲーションをスキップ ページ内リンク」		 「メインコンテンツへスキップ」をタップすると、「アクセシビリティを考える会」にフォーカスが移動したのちに「メインコンテンツへスキップ」に戻る。