Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

一部初出時を除いて「ホバー」を「マウスオーバー」に置換 #173

Merged
merged 2 commits into from
Jan 12, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions data/yaml/checks/design/0091.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ platform:
- web
check:
ja: |-
ホバーで表示されるすべてのコンテンツは、以下のすべてを満たす設計になっている:
マウスオーバーで表示されるすべてのコンテンツは、以下のすべてを満たす設計になっている:

* ポインターを移動させることなく、ホバーで表示されたコンテンツを非表示にできる。(ESCキーで消える、など)
* ホバー状態ではなくなった場合、ユーザーが非表示にする操作を行った場合、内容が無効になった場合にのみ、ホバーで表示されたコンテンツを非表示にする
* ポインターを移動させることなく、マウスオーバーで表示されたコンテンツを非表示にできる。(ESCキーで消える、など)
* マウスオーバー状態ではなくなった場合、ユーザーが非表示にする操作を行った場合、内容が無効になった場合にのみ、マウスオーバーで表示されたコンテンツを非表示にする
2 changes: 1 addition & 1 deletion data/yaml/checks/design/0092.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ platform:
- web
check:
ja: |-
ホバーで表示されるすべてのコンテンツは、ポインターをそのコンテンツ上に移動しても、コンテンツが消えない設計になっている。
マウスオーバーで表示されるすべてのコンテンツは、ポインターをそのコンテンツ上に移動しても、コンテンツが消えない設計になっている。
2 changes: 1 addition & 1 deletion data/yaml/checks/design/0211.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ platform:
- web
check:
ja: |-
クリックやホバーなどのマウス操作を受け付けるものは、キーボードのみでも操作できるように設計されている。
クリックやマウスオーバーなどのマウス操作を受け付けるものは、キーボードのみでも操作できるように設計されている。
2 changes: 1 addition & 1 deletion data/yaml/checks/design/0361.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ platform:
- web
check:
ja: |-
マウスのホバー時にしか表示されない情報や実行できない機能が、設計資料に存在しない。
マウスのマウスオーバー時にしか表示されない情報や実行できない機能が、設計資料に存在しない。
2 changes: 1 addition & 1 deletion data/yaml/checks/product/0021.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ procedures:
ja: |-
ただし、ガイドラインを満たしていない状態であっても、以下の場合は問題として表示されませんので注意が必要です。

* マウスホバーなどで背景色やテキスト色が変化する場合の、変化後のコントラスト比が不足する場合
* マウスマウスオーバーなどで背景色やテキスト色が変化する場合の、変化後のコントラスト比が不足する場合
* 大きいテキストのコントラスト比が3:1以上4.5:1未満の場合

- freeeの場合日本語テキストを想定しているため、「大きいテキスト」を29px(22pt)以上または24px(18pt)以上の太字としているが、WCAGでは欧文テキストを想定して18pt以上または14pt以上の太字としているため、18pt以上22pt未満(太字の場合は14pt以上18pt未満)の日本語のテキストについて、Axe DevToolsはコントラスト不足を検知できない
Expand Down
6 changes: 3 additions & 3 deletions data/yaml/checks/product/0111.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,10 @@ platform:
- web
check:
ja: |-
ホバーで表示されるすべてのコンテンツは、以下のすべてを満たしている:
マウスオーバーで表示されるすべてのコンテンツは、以下のすべてを満たしている:

* マウス・ポインターを移動させることなく、ホバーで表示されたコンテンツを非表示にできる。(ESCキーで消える、など)
* ホバー状態ではなくなった場合、ユーザーが非表示にする操作を行った場合、内容が無効になった場合にのみ、ホバーで表示されたコンテンツを非表示にする
* マウス・ポインターを移動させることなく、マウスオーバーで表示されたコンテンツを非表示にできる。(ESCキーで消える、など)
* マウスオーバー状態ではなくなった場合、ユーザーが非表示にする操作を行った場合、内容が無効になった場合にのみ、マウスオーバーで表示されたコンテンツを非表示にする
en: |-
All content displayed on hover meets all of the following

Expand Down
2 changes: 1 addition & 1 deletion data/yaml/checks/product/0112.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,6 @@ platform:
- web
check:
ja: |-
ホバーで表示されるコンテンツは、マウス・ポインターをそのコンテンツ上に移動しても、コンテンツが消えない。
マウスオーバーで表示されるコンテンツは、マウス・ポインターをそのコンテンツ上に移動しても、コンテンツが消えない。
en: |-
Content displayed on hover does not disappear when the mouse pointer is moved over it.
2 changes: 1 addition & 1 deletion data/yaml/checks/product/0231.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,6 @@ platform:
- web
check:
ja: |-
クリックやホバーなどのマウス操作を受け付けるものは、キーボードのみでも操作できる。
クリックやマウスオーバーなどのマウス操作を受け付けるものは、キーボードのみでも操作できる。
en: |-
Anything that accepts mouse operation, such as clicks and hover, can also be operated using only the keyboard.
6 changes: 3 additions & 3 deletions data/yaml/gl/dynamic_content/hover-magnify.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,15 @@ id: gl-dynamic-content-hover-magnify
sortKey: 2011
category: dynamic_content
title:
ja: ホバーで表示されるコンテンツの拡大
ja: マウスオーバー(ホバー)で表示されるコンテンツの拡大
platform:
- web
guideline: |-
ホバーで表示されるコンテンツについて、ポインターをホバーで表示されたコンテンツ上に移動しても、コンテンツが消えないようにすることで、そのコンテンツを拡大表示して利用することを可能にする。
マウスオーバー(ホバー)で表示されるコンテンツについて、ポインターをマウスオーバーで表示されたコンテンツ上に移動しても、コンテンツが消えないようにすることで、そのコンテンツを拡大表示して利用することを可能にする。
sc:
- 1.4.13
intent: |-
拡大表示を利用しているロービジョン者が、ホバーで表示される内容を利用できるようにする
拡大表示を利用しているロービジョン者が、マウスオーバーで表示される内容を利用できるようにする
checks:
- '0092'
- '0112'
Expand Down
10 changes: 5 additions & 5 deletions data/yaml/gl/dynamic_content/hover.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,18 @@ id: gl-dynamic-content-hover
sortKey: 2016
category: dynamic_content
title:
ja: ホバーで表示されるコンテンツの非表示
ja: マウスオーバー(ホバー)で表示されるコンテンツの非表示
platform:
- web
guideline: |-
ホバーで表示されるコンテンツについて、以下のすべてを満たす。
マウスオーバー(ホバー)で表示されるコンテンツについて、以下のすべてを満たす。

- ポインターを移動させることなく、ホバーで表示されたコンテンツを非表示にできる。(Escキーで消える、など)
- ホバー状態ではなくなった場合、ユーザーが非表示にする操作を行った場合、内容が無効になった場合にのみ、ホバーで表示されたコンテンツを非表示にする
- ポインターを移動させることなく、マウスオーバーで表示されたコンテンツを非表示にできる。(Escキーで消える、など)
- マウスオーバー状態ではなくなった場合、ユーザーが非表示にする操作を行った場合、内容が無効になった場合にのみ、マウスオーバーで表示されたコンテンツを非表示にする
sc:
- 1.4.13
intent: |-
拡大表示を利用しているロービジョン者が、ホバーで表示される内容を利用できるようにする
拡大表示を利用しているロービジョン者が、マウスオーバーで表示される内容を利用できるようにする
checks:
- '0091'
- '0111'
Expand Down
28 changes: 14 additions & 14 deletions source/explanations/dynamic_content-hover.rst
Original file line number Diff line number Diff line change
@@ -1,28 +1,28 @@
.. _exp-dynamic-content-hover:

######################################
ホバーで表示されるコンテンツと拡大表示
######################################
########################################################
マウスオーバー(ホバー)で表示されるコンテンツと拡大表示
########################################################

マウス・ポインターのホバーやキーボード・フォーカスを受け取ったことがトリガーになって新たなコンテンツが表示される場合、特に拡大表示を利用しているロービジョンのユーザーのアクセスを阻害する可能性があります。
マウス・ポインターのマウスオーバー(ホバー)やキーボード・フォーカスを受け取ったことがトリガーになって新たなコンテンツが表示される場合、特に拡大表示を利用しているロービジョンのユーザーのアクセスを阻害する可能性があります。

拡大表示を利用している場合、一度に画面に表示されるのはコンテンツの一部分に過ぎません。ユーザーはマウス・ポインターを移動させることで、拡大表示する部分を切り替えながら、最終的にコンテンツ全体を理解するという作業をします。

まず、この一連の動作の中で、マウス・ポインターが意図せずしてホバー表示をトリガーしてしまうことがあります。そして、こうして表示されたコンテンツによってそれまで閲覧していたコンテンツや操作しようとしていたコンポーネントが適切に表示されなくなり、動作を続けられなくなる場合があります。
まず、この一連の動作の中で、マウス・ポインターが意図せずしてマウスオーバー表示をトリガーしてしまうことがあります。そして、こうして表示されたコンテンツによってそれまで閲覧していたコンテンツや操作しようとしていたコンポーネントが適切に表示されなくなり、動作を続けられなくなる場合があります。

もちろん、ホバーで表示されたコンテンツが他のコンテンツの利用を阻害しないようにすれば問題はありませんが、ユーザーによって異なる様々な拡大率のすべてを想定することは現実的ではありません。
もしこのとき、マウス・ポインターを移動させずに、例えばEscキーを押すことでホバー表示されたコンテンツを非表示にすることができれば、ユーザーはそれまで行っていた動作を容易に継続することができます。
もちろん、マウスオーバーで表示されたコンテンツが他のコンテンツの利用を阻害しないようにすれば問題はありませんが、ユーザーによって異なる様々な拡大率のすべてを想定することは現実的ではありません。
もしこのとき、マウス・ポインターを移動させずに、例えばEscキーを押すことでマウスオーバー表示されたコンテンツを非表示にすることができれば、ユーザーはそれまで行っていた動作を容易に継続することができます。

一方、ホバーで表示されたコンテンツを拡大表示を用いているユーザーが読みたい場合、特に表示されたコンテンツが占める領域が大きい場合には、表示されたコンテンツをスクロールさせるような操作が必要になります。
しかし、もしマウス・ポインターがホバーのトリガーとなったオブジェクトから離れることでそのコンテンツが非表示になってしまうと、こういった操作を行えなくなります。
この問題を回避するために、ホバーで新たに表示されたコンテンツ上にマウス・ポインターがある場合も、その表示が継続されるようにすることが求められています。
一方、マウスオーバーで表示されたコンテンツを拡大表示を用いているユーザーが読みたい場合、特に表示されたコンテンツが占める領域が大きい場合には、表示されたコンテンツをスクロールさせるような操作が必要になります。
しかし、もしマウス・ポインターがマウスオーバーのトリガーとなったオブジェクトから離れることでそのコンテンツが非表示になってしまうと、こういった操作を行えなくなります。
この問題を回避するために、マウスオーバーで新たに表示されたコンテンツ上にマウス・ポインターがある場合も、その表示が継続されるようにすることが求められています。

このように、拡大表示を用いている場合は、用いていない場合と比較してより多くの操作が必要となり、同じコンテンツを読むのにもより時間がかかる場合があります。
そのため、ホバー表示されたコンテンツを非表示にする操作をユーザーが能動的にした場合と、表示されているものが意味を持たなくなった場合(例えば「読み込み中……」といったメッセージなど)以外には、基本的にホバー表示されたコンテンツを自動的に非表示にしないことが求められています
そのため、マウスオーバー表示されたコンテンツを非表示にする操作をユーザーが能動的にした場合と、表示されているものが意味を持たなくなった場合(例えば「読み込み中……」といったメッセージなど)以外には、基本的にマウスオーバー表示されたコンテンツを自動的に非表示にしないことが求められています

これらの基準を満たしていても、ホバー表示のトリガーとなるオブジェクトの位置と実際に表示されるコンテンツの表示位置が離れていると、ユーザーはその表示に気づかない場合があるという点には注意が必要です。
本当にホバーによる表示が最善の方法なのか、よく検討する必要があるでしょう。
これらの基準を満たしていても、マウスオーバー表示のトリガーとなるオブジェクトの位置と実際に表示されるコンテンツの表示位置が離れていると、ユーザーはその表示に気づかない場合があるという点には注意が必要です。
本当にマウスオーバーによる表示が最善の方法なのか、よく検討する必要があるでしょう。

なお、ホバーをトリガーとする場合、 :ref:`gl-input-device-keyboard-operable` を満たすために、キーボード・フォーカスも合わせてトリガーにする必要がある点に十分注意する必要があります。
なお、マウスオーバーをトリガーとする場合、 :ref:`gl-input-device-keyboard-operable` を満たすために、キーボード・フォーカスも合わせてトリガーにする必要がある点に十分注意する必要があります。

.. include:: /inc/info2gl/exp-dynamic-content-hover.rst
2 changes: 1 addition & 1 deletion source/explanations/tab-order-check.rst
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ Tab/Shift+Tabキーを用いたチェックは、以下を確認するために
必ずしもマウスを使っているわけではないという前提ですから、操作を受け付けるコンポーネントについてはキーボードのみで操作できる必要があります。

- マウス・クリックをトリガーとしたようなイベントは、Enterキーの押下もトリガーになるようにする
- ホバーによってのみ表示される情報や実行できる機能がない
- マウスオーバー(ホバー)によってのみ表示される情報や実行できる機能がない

* フォーカスされているコンポーネントを視覚的に判別できる:

Expand Down
2 changes: 1 addition & 1 deletion source/info/priority.rst
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,6 @@ freeeのプロダクトにおいては、その性質上フォーム・コント
達成基準1.4.13
^^^^^^^^^^^^^^

この達成基準は、拡大表示を利用しているユーザーがホバーによって表示されるコンテンツを利用しやすくすることを意図しています。具体的には、ユーザーの意図に反してそのコンテンツが非表示にならないようにすることや、必要なタイミングでそのコンテンツを非表示にできるようにすることを目的としたものです。
この達成基準は、拡大表示を利用しているユーザーがマウスオーバー(ホバー)によって表示されるコンテンツを利用しやすくすることを意図しています。具体的には、ユーザーの意図に反してそのコンテンツが非表示にならないようにすることや、必要なタイミングでそのコンテンツを非表示にできるようにすることを目的としたものです。

このうち、ユーザーの意図に反してコンテンツが非表示になってしまうという現象は、場合によってはユーザーのコンテンツ利用を不可能にする可能性があるものだと考え、当ガイドラインではこの部分を取り出し、レベルA相当の項目として扱うことにしました。