WCAG 2.0 実装方法集

メインコンテンツへスキップ

-

G165: 視認性に優れた標準のフォーカスインジケータが引き継がれるように、プラットフォーム標準のフォーカスインジケータを用いる

適用(対象)

フォーカス可能な要素を提供する全てのウェブコンテンツ技術

これは、次の達成基準に関連する実装方法である:

解説

この実装方法の目的は、視認性に優れた標準のフォーカスインジケータが引き継がれるように、プラットフォーム標準のフォーカスインジケータを用いることである。OSには標準のフォーカス表示があり、多くのユーザーエージェントで利用可能となっている。フォーカスインジケータのデフォルトの描画は常に視認性に優れているわけではなく、ある背景では見づらくなっている。しかしながら、多くのプラットフォームでは、利用者がフォーカスインジケータの描画をカスタマイズすることができる。支援技術では、標準のフォーカスインジケータの外観を変更することもできる。標準のフォーカスインジケータを使っている場合、システム全体に対する見え方の設定はウェブページに引継がれる。例えば、利用者の操作に反応してページの一部分を色付けするといった独自のフォーカスインジケータを表示させる場合、このような設定は引継がれない。通常、支援技術は利用者独自のフォーカスインジケータを見つけることはできない。

事例

事例 1:

マイクロソフトウィンドウズのデフォルトのフォーカスインジケータは、フォーカスが当たっている要素の回りに1ピクセルの黒い点線で表示される。暗い背景のページ上では、これは非常に見づらくなる。そのページの制作者がデフォルトを使用し、利用者はウィンドウズ上で明るい色にカスタマイズする。

事例 2:

HTMLにおいて、フォーム要素とリンクにはデフォルトでフォーカスが当たるようになっている。さらに、tabindexの属性値が0以上のあらゆる要素はフォーカスを受け取る。フォーカスが当たっている要素はどちらのタイプの場合でも、システムのフォーカスインジケータを使用し、フォーカスインジケータのスタイルについてのプラットフォームの変更を検知する。

検証

チェックポイント

  1. フォーカスインジケータの外観をカスタマイズするには、プラットフォームの機能を使用する。

  2. フォーカスの移動順序に注意しながら、ページ内をキーボード操作でタブ移動する。

  3. 全てのコントロールでフォーカスインジケータが視覚的に認識可能である。

判定基準

注意: この実装方法が「達成基準を満たすことのできる実装方法」の一つである場合、このチェックポイントや判定基準を満たしていなければ、それはこの実装方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の実装方法によってその達成基準が満たされていることもありうる。

日本語訳における注記:

この文書の正式版は、W3Cサイトで公開されている英語の文書であり、この日本語訳には誤訳が含まれていることもありえます。なお、文中にある「日本語訳における注記」は、W3Cの原文にはないものであり、日本語訳監修者が追記したものです。