WCAG 2.1 に対する私的解釈 (その1) : 達成基準 1.4.13 Content on Hover or Focus
この記事は、Web アクセシビリティ Advent Calendar 2018 の16日目の記事です。
今年は、W3C の WCAG (Web Content Accessibility Guidelines) の新バージョンである WCAG 2.1 が、正式な Recommendation (勧告) になりました。
私も参加しているウェブアクセシビリティ基盤委員会 (WAIC) 翻訳ワーキンググループ (WG4) にて、鋭意日本語翻訳中です。(作業中ドラフト : Web Content Accessibility Guidelines (WCAG) 2.1 (日本語訳))バージョンが 2.1 になり、ロービジョン、モバイル、認知/学習障害への配慮が強化され、より進化したガイドラインになったのは事実ですが、個人的には若干もやもやする箇所がいくつかあります。そこで当サイトでは、「WCAG 2.1 ではこう規定されているが、本当はこう考えたほうがもっとよいのでは？」という私的な解釈を加えてみたいと思います。
今回取り上げるのは、達成基準 1.4.13 Content on Hover or Focus (ホバーまたはフォーカスで表示されるコンテンツ) (レベル AA) です。
Where receiving and then removing pointer hover or keyboard focus triggers additional content to become visible and then hidden, the following are true: (ポインタホバーまたはキーボードフォーカスを受け取る/外すことで、追加コンテンツを表示させる/非表示させる場合は、以下の要件を満たす。)
- Dismissable (非表示にすることができる)
- A mechanism is available to dismiss the additional content without moving pointer hover or keyboard focus, unless the additional content communicates an input error or does not obscure or replace other content; (ポインタホバーやキーボードフォーカスを動かさずに追加コンテンツを非表示にするメカニズムが存在する。ただし、追加コンテンツが入力エラーを伝える場合や、他のコンテンツを不明瞭にしたり置き換えたりしない場合は除く。)
- Hoverable (ホバーすることができる)
- If pointer hover can trigger the additional content, then the pointer can be moved over the additional content without the additional content disappearing; (ポインタホバーによって追加コンテンツを表示させることができる場合、その追加コンテンツを消すことなく、ポインタを追加コンテンツ上で動かすことができる。)
- Persistent (表示が継続される)
- The additional content remains visible until the hover or focus trigger is removed, the user dismisses it, or its information is no longer valid. (ホバーやフォーカスが解除される、利用者が非表示にする、またはその情報が有効でなくなるまでは、追加コンテンツが表示され続ける。)
Exception: The visual presentation of the additional content is controlled by the user agent and is not modified by the author. (例外: 追加コンテンツの視覚的提示がユーザエージェントによって制御されていて、かつコンテンツ制作者が変更していない場合は例外とする。)
出典 : WCAG 2.1 Success Criterion 1.4.13 Content on Hover or Focus (Level AA)
この達成基準の意図
この達成基準は主にロービジョン向けの配慮で、マウスによるホバー (hover) やキーボード操作によるフォーカスによって、以下の問題が生じることへの対策を示したものです。
- コンテンツのある部分を見ようとして、そこにマウスポインター/フォーカスを移動しようとたら、その途中に、ホバー/フォーカスによって「追加コンテンツ」をオーバーレイ表示させる UI コンポーネントが仕込まれていて、ユーザーの意図に反する形で、見たかったコンテンツが覆い隠されてしまう。
- オーバーレイした「追加コンテンツ」を見ようとして、その上にマウスポインター/フォーカスを移動たら、「追加コンテンツ」を表示するトリガーとして機能していたホバー/フォーカス状態が解除されてしまい、ユーザーの意図に反する形で、「追加コンテンツ」が消えてしまう。
ロービジョンのユーザーの多くは、OS の画面拡大機能 (Windows の「拡大鏡」機能や、Mac の [option]＋[command]＋[8] によるズーム機能など) を用いてコンテンツを利用しますが、拡大された画面表示からはみ出した部分にアクセスするためには、マウスなどを動かして画面をスクロールし、見たい箇所をポインターで指し示すアクションを採る形になるので、上記の問題に直面しやすくなります。加えて、画面表示の拡大率が高いと、追加コンテンツのオーバーレイが、オーバーレイであると視認しにくい (ビューポート全体がごっそり差し替わって見えるので、状況がわからずどう対処したらよいかわからなくなる) という問題もあります。こうした問題に対処するために、以下の配慮をしましょう、というのがこの達成基準の意図になります。
- マウスによるホバーやキーボード操作によるフォーカスを外さなくても、追加コンテンツを非表示にできるようにする。(たとえば、[Esc] キーで追加コンテンツを閉じる、など。)
- マウスによるホバーによって追加コンテンツを表示させる場合、その追加コンテンツ上にマウスポインターを動かしても、当該追加コンテンツが消えないようにする。
- マウスによるホバーやキーボード操作によるフォーカスを外す、ユーザーが任意で追加コンテンツを非表示する操作をする、あるいは追加コンテンツによって提示された情報が不要になる、といった状態になるまでは、追加コンテンツが表示され続けるようにする。
そもそもホバーやフォーカスで追加コンテンツを出すのってどうなの？
この達成基準は、PC を使用しているロービジョンのユーザーへの配慮としては、よいと思います。ただ、これを満たす実装をしようとすると面倒な感じがしますし、より広いスコープでアクセシビリティを考えると、「この達成基準が満たされていれば十分にアクセシブルである」と言ってしまってよいものか、個人的には釈然としないものがあります。
- マウスによるホバーは、(昨今多くのユーザーが使用している) スマートフォンやタブレットといったタッチインターフェースではそもそも機能しない。
- キーボード操作によるフォーカスだけで追加コンテンツを開くというインタラクションは、ユーザーのメンタルモデルに合致するものではなく、予想外の挙動になってしまうのでは？
こうしたことも併せて考えると、そもそもホバーやフォーカスで追加コンテンツを出すのってどうなのだろう？という気がするのです。追加コンテンツは、あくまでもユーザーの任意で提示されるべきで、ユーザーの明確な意思表示 (クリック、タップ、フォーカスされた UI コンポーネントに対する [Enter] キーでの実行) をもってはじめて表示されるようデザインしたいな、というのが私自身のこの達成基準に対する捉えかたです。