diff --git a/files/ja/web/accessibility/aria/aria_live_regions/index.md b/files/ja/web/accessibility/aria/aria_live_regions/index.md index 12c3e5f2d5548f..e551e3c1941710 100644 --- a/files/ja/web/accessibility/aria/aria_live_regions/index.md +++ b/files/ja/web/accessibility/aria/aria_live_regions/index.md @@ -1,38 +1,59 @@ --- title: ARIA ライブリージョン slug: Web/Accessibility/ARIA/ARIA_Live_Regions +l10n: + sourceCommit: acfe8c9f1f4145f77653a2bc64a9744b001358dc --- + + JavaScript を使うと、検索結果のリストを瞬時に更新する、もしくはユーザーの操作を必要としないような控えめなアラートや通知を表示するなど、ページ全体をリロードせずにページの一部を動的に変更することができます。 これらの変更は通常ページを見ることのできるユーザーにとっては視覚的に明らかですが、支援技術ユーザーにとっては明確ではないかもしれません。ARIA ライブリージョンはこのギャップを埋め、動的なコンテンツの変更を支援技術により通知できるやり方で、プログラムによって表出させる方法を提供します。 > **メモ:** 支援技術はライブリージョンへのコンテンツの _動的な_ 変更を通知します。 -> > `aria-live` 属性もしくは 特化したライブリージョン `role` (例えば `role="alert"` )を、変更をアナウンスしたい要素に含めることで有効になりますが、変更が起こる前にこれらの属性が追加されている必要があります。 — 最初からマークアップに含まれていても、 JavaScript で動的に追加しても構いません。 ## ライブリージョン ページのリロードなしに更新される動的なコンテンツは、ほとんどの場合領域もしくはウィジェットのどちらかです。 対話的でないシンプルなコンテンツの変更は、ライブリージョンとして記されるべきです。ライブリージョンは `aria-live` 属性を使って明示するべきです。 -**`aria-live`**: `aria-live=POLITENESS_SETTING` はスクリーンリーダーがライブリージョンの更新処理の優先度を設定するために使われます。設定は `off`、`polite`、`assertive` で、デフォルトは `off` です。この属性は間違いなく最も重要な属性です。 +**`aria-live`**: `aria-live=POLITENESS_SETTING` はスクリーンリーダーがライブリージョンの更新処理の優先度を設定するために使われます。設定は `off`、`polite`、`assertive` で、既定は `off` です。この属性は間違いなく最も重要な属性です。 通常、`aria-live="polite"` のみが使われます。ユーザーにとって重要な更新を受け取るが、うるさくなるほど速くすべきでない領域にはこの属性を設定すべきです。スクリーンリーダーはユーザーがアイドル状態になったときに読み上げを行います。 `aria-live="assertive"` は、即時に伝えてユーザーの注意を引く必要のある、時間にシビアな通知にのみ使用します。 一般的に assertive なライブリージョンへの変更は、スクリーンリーダーがその時に読み上げているものに割り込みます。つまり、うるさかったり、混乱の元になり得るので、控えめに使うべきです。 -`aria-live="off"` は要素のデフォルトとして扱われるので、明示的に指定する必要はありません。ただし、暗黙のライブリージョンロール (例えば `role="alert"` ) を持つ要素からの出力を止めたい場合は話が別です。 +`aria-live="off"` は要素の既定として扱われるので、明示的に指定する必要はありません。ただし、暗黙のライブリージョンロール(例えば `role="alert"`)を持つ要素からの出力を止めたい場合は話が別です。 ### 基本的な例: 有益な画面上の情報を更新するドロップダウンボックス 惑星についての情報を提供することに特化したウェブサイトにドロップダウンボックスがあります。ドロップダウンから惑星が選ばれたとき、選択された惑星の情報でページ上のある領域が更新されます。 -#### HTML - ```html
Planet information