Skip to content

Commit 1c74d90

Browse files
authored
Merge pull request #365 from ma10/update-en-translation-20250627
参考情報の英訳を追加
2 parents 3be6948 + e3eb7ad commit 1c74d90

File tree

10 files changed

+135
-113
lines changed

10 files changed

+135
-113
lines changed

data/yaml/faq/d0004.yaml

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,10 @@ explanation:
3939
Additionally, if the icon serves as a button, the screen reader will announce that it is a button.
4040
For this reason, there is no need to include the word "button" in the alternative text either.
4141
If the announcement fails to convey that it is a button, there is likely an issue with the markup.
42+
43+
Note: The additional information such as "image" or "button" in screen reader announcements is based on the role of the element being read.
44+
Every element has a default role, and you can change the role of an element from its default using the ``role`` attribute.
45+
By using appropriate elements and, if necessary, leveraging the ``role`` attribute, you can ensure that screen readers can add the correct information.
4246
info:
4347
- exp-image-text-alternative
4448
- exp-markup-component
Lines changed: 16 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,30 @@
11
.. _exp-dynamic-content-hover:
22

33
########################################################
4-
マウスオーバー(ホバー)で表示されるコンテンツと拡大表示
4+
Content Displayed on Mouseover (Hover) and Magnification
55
########################################################
66

7-
マウス・ポインターのマウスオーバー(ホバー)やキーボード・フォーカスを受け取ったことがトリガーになって新たなコンテンツが表示される場合、特に拡大表示を利用しているロービジョンのユーザーのアクセスを阻害する可能性があります。
7+
When new content is displayed, triggered by a mouseover (hover) with the mouse pointer or by receiving keyboard focus, it can hinder access, especially for low-vision users who rely on magnification.
88

9-
拡大表示を利用している場合、一度に画面に表示されるのはコンテンツの一部分に過ぎません。ユーザーはマウス・ポインターを移動させることで、拡大表示する部分を切り替えながら、最終的にコンテンツ全体を理解するという作業をします。
9+
When using magnification, only a portion of the content is displayed on the screen at any given time.
10+
Users navigate by moving the mouse pointer to switch the magnified area, eventually piecing together the entire content.
1011

11-
まず、この一連の動作の中で、マウス・ポインターが意図せずしてマウスオーバー表示をトリガーしてしまうことがあります。そして、こうして表示されたコンテンツによってそれまで閲覧していたコンテンツや操作しようとしていたコンポーネントが適切に表示されなくなり、動作を続けられなくなる場合があります。
12+
First, during this process, the mouse pointer can unintentionally trigger a mouseover display.
13+
When this happens, the newly displayed content can obscure the content the user was viewing or the component they were trying to interact with, preventing them from continuing their task.
1214

13-
もちろん、マウスオーバーで表示されたコンテンツが他のコンテンツの利用を阻害しないようにすれば問題はありませんが、ユーザーによって異なる様々な拡大率のすべてを想定することは現実的ではありません。
14-
もしこのとき、マウス・ポインターを移動させずに、例えばEscキーを押すことでマウスオーバー表示されたコンテンツを非表示にすることができれば、ユーザーはそれまで行っていた動作を容易に継続することができます。
15+
Of course, this is not an issue if the content displayed on mouseover does not interfere with the use of other content, but it is not realistic to anticipate all the different magnification levels used by various users.
16+
If, at this point, the user could hide the mouseover content without moving the mouse pointer, for example, by pressing the :kbd:`Esc` key, they could easily resume their previous task.
1517

16-
一方、マウスオーバーで表示されたコンテンツを拡大表示を用いているユーザーが読みたい場合、特に表示されたコンテンツが占める領域が大きい場合には、表示されたコンテンツをスクロールさせるような操作が必要になります。
17-
しかし、もしマウス・ポインターがマウスオーバーのトリガーとなったオブジェクトから離れることでそのコンテンツが非表示になってしまうと、こういった操作を行えなくなります。
18-
この問題を回避するために、マウスオーバーで新たに表示されたコンテンツ上にマウス・ポインターがある場合も、その表示が継続されるようにすることが求められています。
18+
On the other hand, if a user with magnification wants to read the content displayed on mouseover, they may need to scroll, especially if the displayed content occupies a large area.
19+
However, if the content disappears when the mouse pointer moves away from the object that triggered the mouseover, they cannot perform this operation.
20+
To avoid this problem, it is necessary to ensure that the content remains visible as long as the mouse pointer is over the newly displayed content.
1921

20-
このように、拡大表示を用いている場合は、用いていない場合と比較してより多くの操作が必要となり、同じコンテンツを読むのにもより時間がかかる場合があります。
21-
そのため、マウスオーバー表示されたコンテンツを非表示にする操作をユーザーが能動的にした場合と、表示されているものが意味を持たなくなった場合(例えば「読み込み中……」といったメッセージなど)以外には、基本的にマウスオーバー表示されたコンテンツを自動的に非表示にしないことが求められています。
22+
As a result, using magnification often requires more operations and takes more time to read the same content compared to not using it.
23+
Therefore, it is generally recommended that content displayed on mouseover not automatically hide itself, except when the user actively performs an action to hide it or when the displayed content becomes meaningless (for example, a "loading..." message).
2224

23-
これらの基準を満たしていても、マウスオーバー表示のトリガーとなるオブジェクトの位置と実際に表示されるコンテンツの表示位置が離れていると、ユーザーはその表示に気づかない場合があるという点には注意が必要です。
24-
本当にマウスオーバーによる表示が最善の方法なのか、よく検討する必要があるでしょう。
25+
Even when these criteria are met, it is important to note that if the object that triggers the mouseover display is far from where the content is actually displayed, the user may not notice the new content.
26+
It is important to carefully consider whether a mouseover display is truly the best method.
2527

26-
なお、マウスオーバーをトリガーとする場合、 :ref:`gl-input-device-keyboard-operable` を満たすために、キーボード・フォーカスも合わせてトリガーにする必要がある点に十分注意する必要があります。
28+
You should also note that when using mouseover as a trigger, it is crucial to also use keyboard focus as a trigger to meet the requirements of :ref:`gl-input-device-keyboard-operable`.
2729

2830
.. include:: /inc/info2gl/exp-dynamic-content-hover.rst
Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,18 @@
11
.. _exp-keyboard-notrap:
22

3-
####################################
4-
キーボード・トラップが引き起こす問題
5-
####################################
63

7-
ガイドラインでは、ページ上にあるコンポーネントにキーボードを使ってフォーカスを移動できる場合、そのコンポーネントからフォーカスを外す操作もキーボードで可能にするように求めています。
4+
#################################
5+
Problems Caused by Keyboard Traps
6+
#################################
87

9-
これは、元々JavaアプレットやFlashを用いたページが頻繁に作られていた時期に、キーボードのみを使っているユーザーがページ中に埋め込まれたJavaアプレットやFlashプレイヤーからフォーカスが外せなくなる現象がしばしば見られたことに起因して定められた項目です。
10-
一般的なHTMLで実装されているページではこのような状況を引き起こすことは少ないですが、Reactコンポーネントやページ中に埋め込まれる音声/動画プレイヤーなどではこのような状況が発生する可能性があります。
8+
The guidelines require that if a user can use the keyboard to move the focus to a component on a page, they must also be able to move the focus away from that component using the keyboard.
119

12-
こういった状況が発生すると、ユーザーはそのコンポーネントの外にあるコンテンツにアクセスできなくなってしまいます。
13-
すなわち、ページの他の部分がいくらアクセシビリティーが高い状態であっても、この問題が発生しているページではページ全体を利用できない状態になってしまいますので、このような状況を回避することは必須です。
10+
This requirement was established because a common problem during the era of Java applets and Flash was that users who only used a keyboard would often get their focus trapped within an embedded Java applet or Flash player, unable to move it out.
11+
While this situation is less common on pages implemented with standard HTML, it can still occur with React components and embedded audio/video players.
1412

15-
Tab/Shift+Tabキー、矢印キー、Escキーなど、簡単な操作でフォーカスを外せるようにすることが必要です。
13+
When this happens, the user is unable to access any content outside of that component.
14+
This means that no matter how accessible other parts of the page are, the entire page becomes unusable if this problem occurs. Therefore, it is essential to prevent such situations.
15+
16+
It is necessary to allow users to move the focus out of a component with simple key presses like :kbd:`Tab` / :kbd:`Shift+Tab`, arrow keys, or :kbd:`Esc`.
1617

1718
.. include:: /inc/info2gl/exp-keyboard-notrap.rst
Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,35 @@
11
.. _exp-link-text:
22

3-
################################
4-
リンク先の内容を推測しやすくする
5-
################################
3+
############################################
4+
Making It Easy to Guess the Link Destination
5+
############################################
66

7-
リンク先に求めている情報があるかどうかを推測しやすくすることは、どのようなユーザーにとっても使い勝手の向上につながります。
7+
Making it easier to predict whether a link leads to the desired information improves the user experience for everyone.
88

9-
リンク先の内容の推測を容易にして、不必要なページ遷移を抑制することは、肢体不自由でマウス操作に時間がかかるなどといった状況のユーザーにとっては特に重要です。
9+
For users with physical disabilities who take more time to operate a mouse, it is especially important to make it easier to predict the content of a linked page and thereby prevent unnecessary page transitions.
1010

11-
また、スクリーン・リーダーのユーザーは、スクリーン・リーダーが提供するページ中のリンクを一覧表示する機能を用いて、目的のページへのリンクを探す場合があります。
12-
さらに、 :kbd:`Tab` キーや :kbd:`Shift+Tab` キーを繰り返し押すことでフォーカスを移動させ、目的のリンクを探すユーザーも少なくありません。
13-
このような場合、リンク・テキスト( ``a`` 要素の中身)が、リンク先のページの内容を推測できるものになっているかどうかが重要です。
11+
Additionally, screen reader users may use their screen reader's feature to list all links on a page to find the one they need.
12+
Many users also find links by repeatedly pressing the :kbd:`Tab` / :kbd:`Shift+Tab` keys to move the focus.
13+
In these cases, it is crucial that the link text (the content of the ``a`` element) enables users to predict the content of the destination page.
1414

15-
.. list-table:: 注意すべきリンク・テキストの文言の例(「」部分がリンク・テキスト)
15+
.. list-table:: Examples of problematic link text (link text is in quotation marks)
1616
:header-rows: 1
1717

18-
* - NG
19-
- OK
20-
* - ○○は「こちら」
21-
- 「○○はこちら」
22-
* - 「もっと見る」
23-
- 「○○についてもっと見る」
24-
* - 「詳細」
25-
- 「○○についての詳細」
18+
* - Inadvisable
19+
- Recommended
20+
* - "Click here" for XX
21+
- "Click here for XX"
22+
* - "Read more"
23+
- "Read more about XX"
24+
* - "Details"
25+
- "Details about XX"
2626

27-
また、マークアップによってリンクの意図が明確になっていれば、ガイドラインを満たすことができます。
27+
You can also meet the guidelines if the link's purpose is clear from the markup.
2828

29-
具体的には、リンク・テキストが同じ複数のリンクがあるページで、以下のような条件を満たしている場合を例として挙げられます。
29+
Specifically, consider a page with multiple links that have the same link text and meet the following conditions:
3030

31-
* 当該のリンクがページ中の異なるセクションに含まれている場合、見出しが適切にマークアップされていて、各リンクが含まれるセクションが明確になっている
32-
* リストの各項目に同じリンク・テキストのリンクがある場合に、適切にリスト・アイテムがマークアップされていて、どのリスト項目に含まれるリンクかが明確になっている
33-
* 表の各行に同じリンク・テキストがある場合に、適切に ``table`` 要素や関連要素でリンクが含まれる行と列が明確になっている
31+
* If the links are in different sections of the page, the headings are properly marked up, making it clear which section each link is in.
32+
* If a list contains links with the same link text, the list items are properly marked up, making it clear which list item each link belongs to.
33+
* If a table has links with the same link text in each row, the ``table`` element and related elements are properly marked up, making the row and column of each link clear.
3434

3535
.. include:: /inc/info2gl/exp-link-text.rst

0 commit comments

Comments
 (0)