From 139398ccd0823eb628ec8714c2e781b67054c16b Mon Sep 17 00:00:00 2001
From: Shimada Takayuki <taka@tsmd.jp>
Date: Sun, 27 Aug 2023 07:16:01 +0900
Subject: [PATCH 1/3] =?UTF-8?q?Alert=20and=20Message=20Dialog=20Pattern?=
 =?UTF-8?q?=E3=81=AE=E6=97=A5=E6=9C=AC=E8=AA=9E=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 content/index/index.html                      |  12 +-
 .../alertdialog/alertdialog-pattern.html      |  35 ++---
 .../alertdialog/examples/alertdialog.html     | 140 +++++++++---------
 3 files changed, 94 insertions(+), 93 deletions(-)

diff --git a/content/index/index.html b/content/index/index.html
index e9f3c4d4..618f0a38 100644
--- a/content/index/index.html
+++ b/content/index/index.html
@@ -37,13 +37,13 @@ <h2 id="examples_by_role_label">Examples by Role</h2>
             <td>
               <ul>
                 <li><a href="../patterns/alert/examples/alert.html">Alert</a></li>
-                <li><a href="../patterns/alertdialog/examples/alertdialog.html">Alert Dialog</a></li>
+                <li><a href="../patterns/alertdialog/examples/alertdialog.html">アラートダイアログの例</a></li>
               </ul>
             </td>
           </tr>
           <tr>
             <td><code>alertdialog</code></td>
-            <td><a href="../patterns/alertdialog/examples/alertdialog.html">Alert Dialog</a></td>
+            <td><a href="../patterns/alertdialog/examples/alertdialog.html">アラートダイアログの例</a></td>
           </tr>
           <tr>
             <td><code>article</code></td>
@@ -551,7 +551,7 @@ <h2 id="examples_by_props_label">Examples By Properties and States</h2>
             <td><code>aria-describedby</code></td>
             <td>
               <ul>
-                <li><a href="../patterns/alertdialog/examples/alertdialog.html">Alert Dialog</a></li>
+                <li><a href="../patterns/alertdialog/examples/alertdialog.html">アラートダイアログの例</a></li>
                 <li><a href="../patterns/combobox/examples/combobox-datepicker.html">Date Picker Combobox</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../patterns/dialog-modal/examples/datepicker-dialog.html">Date Picker Dialog</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../patterns/dialog-modal/examples/dialog.html">Modal Dialog</a></li>
@@ -564,7 +564,7 @@ <h2 id="examples_by_props_label">Examples By Properties and States</h2>
             <td><code>aria-disabled</code></td>
             <td>
               <ul>
-                <li><a href="../patterns/alertdialog/examples/alertdialog.html">Alert Dialog</a></li>
+                <li><a href="../patterns/alertdialog/examples/alertdialog.html">アラートダイアログの例</a></li>
                 <li><a href="../patterns/menubar/examples/menubar-editor.html">Editor Menubar</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../patterns/toolbar/examples/toolbar.html">Toolbar</a></li>
               </ul>
@@ -665,7 +665,7 @@ <h2 id="examples_by_props_label">Examples By Properties and States</h2>
             <td>
               <ul>
                 <li><a href="../patterns/accordion/examples/accordion.html">Accordion</a></li>
-                <li><a href="../patterns/alertdialog/examples/alertdialog.html">Alert Dialog</a></li>
+                <li><a href="../patterns/alertdialog/examples/alertdialog.html">アラートダイアログの例</a></li>
                 <li><a href="../patterns/checkbox/examples/checkbox.html">Checkbox  (Two State)</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../patterns/combobox/examples/combobox-datepicker.html">Date Picker Combobox</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../patterns/combobox/examples/combobox-select-only.html">Select-Only Combobox</a></li>
@@ -732,7 +732,7 @@ <h2 id="examples_by_props_label">Examples By Properties and States</h2>
             <td><code>aria-modal</code></td>
             <td>
               <ul>
-                <li><a href="../patterns/alertdialog/examples/alertdialog.html">Alert Dialog</a></li>
+                <li><a href="../patterns/alertdialog/examples/alertdialog.html">アラートダイアログの例</a></li>
                 <li><a href="../patterns/combobox/examples/combobox-datepicker.html">Date Picker Combobox</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../patterns/dialog-modal/examples/datepicker-dialog.html">Date Picker Dialog</a> (<abbr title="High Contrast Support">HC</abbr>)</li>
                 <li><a href="../patterns/dialog-modal/examples/dialog.html">Modal Dialog</a></li>
diff --git a/content/patterns/alertdialog/alertdialog-pattern.html b/content/patterns/alertdialog/alertdialog-pattern.html
index 88de2c6d..d2a06ed5 100644
--- a/content/patterns/alertdialog/alertdialog-pattern.html
+++ b/content/patterns/alertdialog/alertdialog-pattern.html
@@ -1,9 +1,9 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="ja">
   <head>
     <meta charset="UTF-8">
     <meta content="width=device-width, initial-scale=1.0" name="viewport">
-    <title>Alert and Message Dialogs Pattern</title>
+    <title>アラートとメッセージダイアログ パターン</title>
 
     <!-- Core JS and CSS shared by all patterns -->
     <link rel="stylesheet" href="https://www.w3.org/StyleSheets/TR/2016/base.css">
@@ -14,46 +14,47 @@
   </head>
   <body>
     <main>
-      <h1>Alert and Message Dialogs Pattern</h1>
+      <h1>アラートとメッセージダイアログ パターン</h1>
+      <!-- 翻訳元リビジョン: https://github.com/w3c/aria-practices/tree/d6cf9d8db772603a456e7d7ef52e409d39124301 -->
 
       <section id="about">
-        <h2>About This Pattern</h2>
+        <h2>このパターンについて</h2>
         <p>
-          An alert dialog is a <a href="../dialog-modal/dialog-modal-pattern.html">modal dialog</a> that interrupts the user's workflow to communicate an important message and acquire a response.
-          Examples include action confirmation prompts and error message confirmations.
-          The <a href="#alertdialog" class="role-reference">alertdialog</a> role enables assistive technologies and browsers to distinguish alert dialogs from other dialogs so they have the option of giving alert dialogs special treatment, such as playing a system alert sound.
+          アラートダイアログは、重要なメッセージを伝え、応答を取得するためにユーザーのワークフローを中断する<a href="../dialog-modal/dialog-modal-pattern.html">モーダルダイアログ</a>です。
+          アクションの確認プロンプトやエラーメッセージの確認などが例として挙げられます。
+          <a href="#alertdialog" class="role-reference">alertdialog</a>の役割は、アシスティブテクノロジーやブラウザがアラートダイアログを他のダイアログと区別できるようにするためのもので、システムアラート音を再生するなど、アラートダイアログに特別な処理を施すオプションを持っています。
         </p>
       </section>
 
       <section id="examples">
-        <h2>Example</h2>
-        <p><a href="../alertdialog/examples/alertdialog.html">Alert Dialog Example</a>: A confirmation prompt that demonstrates an alert dialog.</p>
+        <h2>例</h2>
+        <p><a href="../alertdialog/examples/alertdialog.html">アラートダイアログの例</a>：アラートダイアログを示す確認プロンプト。</p>
       </section>
 
       <section id="keyboard_interaction">
-        <h2>Keyboard Interaction</h2>
-        <p>See the keyboard interaction section for the <a href="../dialog-modal/dialog-modal-pattern.html">modal dialog pattern</a>.</p>
+        <h2>キーボードの操作</h2>
+        <p><a href="../dialog-modal/dialog-modal-pattern.html">モーダルダイアログのパターン</a>のキーボード操作セクションを参照してください。</p>
       </section>
 
       <section id="roles_states_properties">
-        <h2>WAI-ARIA Roles, States, and Properties</h2>
+        <h2>WAI-ARIAの役割、状態、およびプロパティ</h2>
         <ul>
           <li>
-            The element that contains all elements of the dialog, including the alert message and any dialog buttons, has role <a class="role-reference" href="#alertdialog">alertdialog</a>.
+            ダイアログのすべての要素、アラートメッセージやダイアログボタンを含む要素を含む要素には、<a class="role-reference" href="#alertdialog">alertdialog</a>の役割があります。
           </li>
           <li>
-            The element with role <code>alertdialog</code> has either:
+            役割<code>alertdialog</code>を持つ要素は、以下のいずれかを持っています：
             <ul>
               <li>
-                A value for <a href="#aria-labelledby" class="property-reference">aria-labelledby</a> that refers to the element containing the title of the dialog if the dialog has a visible label.
+                ダイアログに可視ラベルがある場合、ダイアログのタイトルを含む要素を参照する<a href="#aria-labelledby" class="property-reference">aria-labelledby</a>の値。
               </li>
               <li>
-                A value for <a href="#aria-label" class="property-reference">aria-label</a> if the dialog does not have a visible label.
+                ダイアログに可視ラベルがない場合、<a href="#aria-label" class="property-reference">aria-label</a>の値。
               </li>
             </ul>
           </li>
           <li>
-            The element with role <code>alertdialog</code> has a value set for <a href="#aria-describedby" class="property-reference">aria-describedby</a> that refers to the element containing the alert message.
+            役割<code>alertdialog</code>を持つ要素には、アラートメッセージを含む要素を参照する<a href="#aria-describedby" class="property-reference">aria-describedby</a>の値が設定されています。
           </li>
         </ul>
       </section>
diff --git a/content/patterns/alertdialog/examples/alertdialog.html b/content/patterns/alertdialog/examples/alertdialog.html
index 4a8921de..3ab5ab9f 100644
--- a/content/patterns/alertdialog/examples/alertdialog.html
+++ b/content/patterns/alertdialog/examples/alertdialog.html
@@ -1,9 +1,9 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="ja">
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Alert Dialog Example</title>
+    <title>アラートダイアログの例</title>
 
     <!-- Core JS and CSS shared by all examples -->
     <link rel="stylesheet" href="https://www.w3.org/StyleSheets/TR/2016/base.css">
@@ -26,53 +26,53 @@
       </ul>
     </nav>
     <main>
-      <h1>Alert Dialog Example</h1>
+      <h1>アラートダイアログの例</h1>
+      <!-- 翻訳元リビジョン: https://github.com/w3c/aria-practices/tree/d6cf9d8db772603a456e7d7ef52e409d39124301 -->
 
       <section>
-        <h2>About This Example</h2>
+        <h2>この例について</h2>
         <p>
-          The below example of a confirmation prompt demonstrates the <a href="../alertdialog-pattern.html">Alert Dialog Pattern</a>.
-          It also includes an example of the <a href="../../alert/alert-pattern.html">Alert Pattern</a> to make comparing the experiences provided by the two patterns easy.
+          下の確認プロンプトの例は、<a href="../alertdialog-pattern.html">アラートダイアログのパターン</a>を示しています。
+          また、2つのパターンによって提供される経験を簡単に比較するための<a href="../../alert/alert-pattern.html">アラートのパターン</a>の例も含まれています。
         </p>
-        <p>To use this example:</p>
+        <p>この例の使用方法：</p>
         <ul>
           <li>
-            Activate the "discard" button to trigger a confirmation dialog that has the <code>alertdialog</code> role.
+            "discard"ボタンを作動すると、<code>alertdialog</code>の役割を持つ確認ダイアログがトリガーされます。
             <ul>
-              <li>Activating the "yes" button in the confirmation dialog removes the contents of both the "Notes" text area and local storage of the notes.</li>
-              <li data-test-id="save-button">Activating the "no" button or pressing <kbd>escape</kbd> closes the dialog.</li>
-              <li>The "discard" button is disabled if the notes text area does not contain any text.</li>
+              <li>確認ダイアログの"yes"ボタンを作動すると、"Notes"テキストエリアの内容とノートのローカルストレージの両方が削除されます。</li>
+              <li data-test-id="save-button">"no"ボタンを作動するか、<kbd>escape</kbd>を押すと、ダイアログが閉じます。</li>
+              <li>ノートのテキストエリアにテキストが含まれていない場合、"discard"ボタンは無効になります。</li>
             </ul>
           </li>
           <li>
-            Activate the "save" button to trigger an alert when the contents of the "Notes" text area is saved to
-            <a href="https://html.spec.whatwg.org/multipage/webstorage.html#the-localstorage-attribute">local storage</a>.
+            "Notes"テキストエリアの内容が<a href="https://html.spec.whatwg.org/multipage/webstorage.html#the-localstorage-attribute">ローカルストレージ</a>に保存されるときにアラートをトリガーするために"save"ボタンを作動します。
             <ul>
-              <li>A successful save triggers a short alert to notify the user that the notes have been saved.</li>
-              <li>The "save" button is disabled if the user's local storage value is the same as the "Notes" field.</li>
+              <li>成功した保存は、ノートが保存されたことをユーザーに通知する短いアラートをトリガーします。</li>
+              <li>ユーザーのローカルストレージの値が"Notes"フィールドと同じ場合、"save"ボタンは無効になります。</li>
             </ul>
           </li>
-          <li>Modify the "notes" text area as needed to enable and disable the discard and save functions.</li>
+          <li>必要に応じて"notes"テキストエリアを変更して、discardとsaveの機能を有効/無効にします。</li>
         </ul>
-        <p>Similar examples include:</p>
+        <p>類似の例には以下があります：</p>
         <ul>
-          <li><a href="../../alert/examples/alert.html">Alert</a>: a basic alert.</li>
-          <li><a href="../../dialog-modal/examples/dialog.html">Modal Dialog Example</a>: An example demonstrating multiple layers of modal dialogs with both small and large amounts of content.</li>
-          <li><a href="../../dialog-modal/examples/datepicker-dialog.html">Date Picker Dialog example</a>: Demonstrates a dialog containing a calendar grid for choosing a date.</li>
+          <li><a href="../../alert/examples/alert.html">アラート</a>：基本的なアラート。</li>
+          <li><a href="../../dialog-modal/examples/dialog.html">モーダルダイアログの例</a>：少ない量と多い量のコンテンツの両方を持つモーダルダイアログの複数のレイヤーを示す例。</li>
+          <li><a href="../../dialog-modal/examples/datepicker-dialog.html">日付選択ダイアログの例</a>：日付を選択するためのカレンダーグリッドを含むダイアログを示します。</li>
         </ul>
       </section>
 
       <section>
         <div class="example-header">
-          <h2 id="ex_label">Example</h2>
+          <h2 id="ex_label">例</h2>
         </div>
-        <div role="separator" id="ex_start_sep" aria-labelledby="ex_start_sep ex_label" aria-label="Start of"></div>
+        <div role="separator" id="ex_start_sep" aria-labelledby="ex_label ex_start_sep" aria-label="の開始"></div>
         <div id="ex_alertdialog">
-          <label for="notes">Notes</label>
-          <textarea class="notes" name="notes" id="notes" rows="7">This is an example text box, which unsurprisingly contains text. The user is given the option to save this text - which triggers a basic alert - or to discard the text - which triggers an alert dialog that prompts the user for confirmation.</textarea>
+          <label for="notes">ノート</label>
+          <textarea class="notes" name="notes" id="notes" rows="7">これは例のテキストボックスで、予想通りテキストが含まれています。ユーザーはこのテキストを保存するオプションを持っています - これは基本的なアラートをトリガーします - またはテキストを破棄するオプションを持っています - これはユーザーに確認を求めるアラートダイアログをトリガーします。</textarea>
           <div class="visually-hidden" id="notes_save_status" role="alert"></div>
           <button type="button" id="notes_save">
-            Save
+            保存
             <svg class="icon spinner" viewBox="0 0 32 32" aria-hidden="true">
               <path d="M16 32c-4.274 0-8.292-1.664-11.314-4.686s-4.686-7.040-4.686-11.314c0-3.026 0.849-5.973 2.456-8.522 1.563-2.478 3.771-4.48 6.386-5.791l1.344 2.682c-2.126 1.065-3.922 2.693-5.192 4.708-1.305 2.069-1.994 4.462-1.994 6.922 0 7.168 5.832 13 13 13s13-5.832 13-13c0-2.459-0.69-4.853-1.994-6.922-1.271-2.015-3.066-3.643-5.192-4.708l1.344-2.682c2.615 1.31 4.824 3.313 6.386 5.791 1.607 2.549 2.456 5.495 2.456 8.522 0 4.274-1.664 8.292-4.686 11.314s-7.040 4.686-11.314 4.686z"></path>
             </svg>
@@ -80,46 +80,46 @@ <h2 id="ex_label">Example</h2>
               <path d="M27 4l-15 15-7-7-5 5 12 12 20-20z"></path>
             </svg>
           </button>
-          <button type="button" data-textbox="notes" id="notes_discard" onclick="openAlertDialog('alertdialog', this)">Discard</button>
+          <button type="button" data-textbox="notes" id="notes_discard" onclick="openAlertDialog('alertdialog', this)">破棄</button>
           <div class="dialog-backdrop no-scroll">
             <div id="alertdialog" role="alertdialog" aria-modal="true" aria-labelledby="dialog_label" aria-describedby="dialog_desc" class="hidden">
-              <h2 id="dialog_label" class="dialog_label">Confirmation</h2>
+              <h2 id="dialog_label" class="dialog_label">確認</h2>
               <div id="dialog_desc" class="dialog_desc">
-                <p>Are you sure you want to discard all of your notes?</p>
+                <p>すべてのノートを破棄してもよろしいですか？</p>
               </div>
               <div class="dialog_form_actions">
-                <button type="button" id="notes_cancel" onclick="closeDialog(this)">No</button>
-                <button type="button" id="notes_confirm" onclick="discardInput()">Yes</button>
+                <button type="button" id="notes_cancel" onclick="closeDialog(this)">いいえ</button>
+                <button type="button" id="notes_confirm" onclick="discardInput()">はい</button>
               </div>
             </div>
           </div>
         </div>
-        <div role="separator" id="ex_end_sep" aria-labelledby="ex_end_sep ex_label" aria-label="End of"></div>
+        <div role="separator" id="ex_end_sep" aria-labelledby="ex_end_sep ex_label" aria-label="の終了"></div>
       </section>
 
       <section>
-        <h2>Accessibility Features</h2>
+        <h2>アクセシビリティの特徴</h2>
         <ul>
-          <li>The accessible name of the alert dialog is set to its heading ("Confirmation").</li>
-          <li>The dialog's prompt ("Are you sure...?") is referenced via <code>aria-describedby</code> to ensure that the user is immediately aware of the prompt.</li>
+          <li>アラートダイアログのアクセシブルな名前は、その見出し（"確認"）に設定されています。</li>
+          <li>ダイアログのプロンプト（"本当に...?"）は、<code>aria-describedby</code>を使用して参照されているため、ユーザーはプロンプトをすぐに認識できます。</li>
           <li>
-            Focus is automatically set to the first focusable element inside the dialog, which is the "No" <code>button</code>.
-            This is the least destructive action, so focusing "No" helps prevent users from accidentally confirming the destructive "Discard" action, which cannot be undone.
+            フォーカスは、ダイアログ内の最初のフォーカス可能な要素、つまり"No" <code>button</code>に自動的に設定されます。
+            これは最も破壊的でないアクションですので、"No"にフォーカスを合わせることで、ユーザーが破壊的な"Discard"アクションを誤って確認するのを防ぐのに役立ちます。
           </li>
           <li>
-            When the buttons are disabled, <code>aria-disabled</code> is used instead of the HTML <code>disabled</code> attribute so the buttons will remain in the page <kbd>Tab</kbd> sequence.
-            This makes it easier for screen reader users to discover the buttons and discern how the interface works.
+            ボタンが無効の場合、HTMLの<code>disabled</code>属性の代わりに<code>aria-disabled</code>が使用されるため、ボタンはページの<kbd>Tab</kbd>シーケンスに残ります。
+            これにより、スクリーンリーダーのユーザーがボタンを発見し、インターフェースの動作を判断するのが容易になります。
           </li>
         </ul>
       </section>
 
       <section>
-        <h2 id="kbd_label">Keyboard Support</h2>
+        <h2 id="kbd_label">キーボードのサポート</h2>
         <table aria-labelledby="kbd_label" class="def">
           <thead>
             <tr>
-              <th>Key</th>
-              <th>Function</th>
+              <th>キー</th>
+              <th>機能</th>
             </tr>
           </thead>
           <tbody>
@@ -127,8 +127,8 @@ <h2 id="kbd_label">Keyboard Support</h2>
               <th><kbd>Tab</kbd></th>
               <td>
                 <ul>
-                  <li>Moves focus to next focusable element inside the dialog.</li>
-                  <li>When focus is on the last focusable element in the dialog, moves focus to the first focusable element in the dialog.</li>
+                  <li>ダイアログ内の次のフォーカス可能な要素にフォーカスを移動します。</li>
+                  <li>フォーカスがダイアログ内の最後のフォーカス可能な要素にある場合、ダイアログ内の最初のフォーカス可能な要素にフォーカスを移動します。</li>
                 </ul>
               </td>
             </tr>
@@ -136,36 +136,36 @@ <h2 id="kbd_label">Keyboard Support</h2>
               <th><kbd>Shift + Tab</kbd></th>
               <td>
                 <ul>
-                  <li>Moves focus to previous focusable element inside the dialog.</li>
-                  <li>When focus is on the first focusable element in the dialog, moves focus to the last focusable element in the dialog.</li>
+                  <li>ダイアログ内の前のフォーカス可能な要素にフォーカスを移動します。</li>
+                  <li>フォーカスがダイアログ内の最初のフォーカス可能な要素にある場合、ダイアログ内の最後のフォーカス可能な要素にフォーカスを移動します。</li>
                 </ul>
               </td>
             </tr>
             <tr data-test-id="key-escape">
               <th><kbd>Escape</kbd></th>
-              <td>Closes the dialog.</td>
+              <td>ダイアログを閉じます。</td>
             </tr>
             <tr>
               <th><kbd>Command + S</kbd></th>
-              <td>(Mac only) Save the contents of the notes <code>textarea</code> when focused.</td>
+              <td>(Macのみ) フォーカスがあるときにノートの<code>textarea</code>の内容を保存します。</td>
             </tr>
             <tr data-test-id="key-control-s">
               <th><kbd>Control + S</kbd></th>
-              <td>(Windows only) Save the contents of the notes <code>textarea</code> when focused.</td>
+              <td>(Windowsのみ) フォーカスがあるときにノートの<code>textarea</code>の内容を保存します。</td>
             </tr>
           </tbody>
         </table>
       </section>
 
       <section>
-        <h2 id="rps_label">Role, Property, State, and Tabindex Attributes</h2>
+        <h2 id="rps_label">役割、プロパティ、状態、およびTabindex属性</h2>
         <table aria-labelledby="rps_label" class="data attributes">
           <thead>
             <tr>
-              <th scope="col">Role</th>
-              <th scope="col">Attribute</th>
-              <th scope="col">Element</th>
-              <th scope="col">Usage</th>
+              <th scope="col">役割</th>
+              <th scope="col">属性</th>
+              <th scope="col">要素</th>
+              <th scope="col">使用法</th>
             </tr>
           </thead>
           <tbody>
@@ -173,59 +173,59 @@ <h2 id="rps_label">Role, Property, State, and Tabindex Attributes</h2>
               <th scope="row"><code>alertdialog</code></th>
               <td></td>
               <td><code>div</code></td>
-              <td>Identifies the element that serves as the alert dialog container.</td>
+              <td>アラートダイアログのコンテナとして機能する要素を識別します。</td>
             </tr>
             <tr data-test-id="aria-labelledby">
               <td></td>
               <th scope="row"><code>aria-labelledby="ID_REFERENCE"</code></th>
               <td><code>div</code></td>
-              <td>Gives the alert dialog an accessible name by referring to the element that provides the alert dialog title.</td>
+              <td>アラートダイアログのタイトルを提供する要素を参照して、アラートダイアログにアクセシブルな名前を付けます。</td>
             </tr>
             <tr data-test-id="aria-describedby">
               <td></td>
               <th scope="row"><code>aria-describedby="ID_REFERENCE"</code></th>
               <td><code>div</code></td>
-              <td>Gives the alert dialog an accessible description by referring to the alert dialog content that describes the primary message or purpose of the alert dialog.</td>
+              <td>アラートダイアログの主要なメッセージや目的を説明するアラートダイアログのコンテンツを参照して、アラートダイアログにアクセシブルな説明を付けます。</td>
             </tr>
             <tr data-test-id="aria-modal">
               <td></td>
               <th scope="row"><code>aria-modal="true"</code></th>
               <td><code>div</code></td>
-              <td>Tells assistive technologies that the windows underneath the current alert dialog are not available for interaction (inert).</td>
+              <td>現在のアラートダイアログの下のウィンドウが操作できない（非アクティブ）ことを支援技術に伝えます。</td>
             </tr>
             <tr>
               <th data-test-id="alert-role" scope="row"><code>alert</code></th>
               <td></td>
               <td><code>div</code></td>
-              <td>Identifies the element that serves as the alert notification.</td>
+              <td>アラート通知として機能する要素を識別します。</td>
             </tr>
             <tr>
               <td></td>
               <th scope="row"><code>aria-disabled="true"</code></th>
               <td><code>button</code></td>
-              <td>Tells assistive technology users the button cannot be activated.</td>
+              <td>ボタンが活性化できないことを支援技術のユーザーに伝えます。</td>
             </tr>
           </tbody>
         </table>
-        <h3>Notes on <code>aria-modal</code> and <code>aria-hidden</code></h3>
+        <h3><code>aria-modal</code>と<code>aria-hidden</code>に関する注意</h3>
         <ul>
           <li>
-            The <code>aria-modal</code> property was introduced in ARIA 1.1.
-            As a relatively new property, screen reader users may experience varying degrees of support for it.
+            <code>aria-modal</code>プロパティはARIA 1.1で導入されました。
+            比較的新しいプロパティであるため、スクリーンリーダーのユーザーはそれに対するサポートの度合いが異なる場合があります。
           </li>
-          <li>Applying the <code>aria-modal</code> property to the <code>dialog</code> element replaces the technique of using <code>aria-hidden</code> on the background for informing assistive technologies that content outside a dialog is inert.</li>
+          <li><code>aria-modal</code>プロパティを<code>dialog</code>要素に適用することで、ダイアログの背景に<code>aria-hidden</code>を使用してコンテンツが非アクティブであることを支援技術に伝える技術を置き換えます。</li>
           <li>
-            In legacy dialog implementations where <code>aria-hidden</code> is used to make content outside a dialog inert for assistive technology users, it is important that:
+            <code>aria-hidden</code>を使用してダイアログの外のコンテンツを支援技術のユーザーに対して非アクティブにするレガシーダイアログの実装では、以下が重要です：
             <ul>
-              <li><code>aria-hidden</code> is set to <code>true</code> on each element containing a portion of the inert layer.</li>
-              <li>The dialog element is not a descendant of any element that has <code>aria-hidden</code> set to <code>true</code>.</li>
+              <li>非アクティブなレイヤーの一部を含む各要素に<code>aria-hidden</code>が<code>true</code>に設定されていること。</li>
+              <li>ダイアログ要素が<code>aria-hidden</code>が<code>true</code>に設定されている要素の子孫でないこと。</li>
             </ul>
           </li>
         </ul>
       </section>
 
       <section>
-        <h2 id="src_label">Javascript and CSS Source Code</h2>
+        <h2 id="src_label">JavascriptとCSSのソースコード</h2>
         <ul id="css_js_files">
           <li>CSS: <a href="css/alertdialog.css" type="text/css">alertdialog.css</a></li>
           <li>Javascript: <a href="js/alertdialog.js" type="text/javascript">alertdialog.js</a>, <a href="../../../shared/js/utils.js">utils.js</a></li>
@@ -233,10 +233,10 @@ <h2 id="src_label">Javascript and CSS Source Code</h2>
       </section>
 
       <section>
-        <h2 id="sc1_label">HTML Source Code</h2>
-        <div role="separator" id="sc1_start_sep" aria-labelledby="sc1_start_sep sc1_label" aria-label="Start of"></div>
+        <h2 id="sc1_label">HTMLのソースコード</h2>
+        <div role="separator" id="sc1_start_sep" aria-labelledby="sc1_start_sep sc1_label" aria-label="の開始"></div>
         <pre><code id="sc1"></code></pre>
-        <div role="separator" id="sc1_end_sep" aria-labelledby="sc1_end_sep sc1_label" aria-label="End of"></div>
+        <div role="separator" id="sc1_end_sep" aria-labelledby="sc1_end_sep sc1_label" aria-label="の終了"></div>
         <script>
           sourceCode.add('sc1', 'ex_alertdialog', 'ex_label', 'css_js_files');
           sourceCode.make();

From 2bc97bee378a08a2fa160604a98f806a2da78140 Mon Sep 17 00:00:00 2001
From: Shimada Takayuki <taka@tsmd.jp>
Date: Tue, 26 Sep 2023 09:28:19 +0900
Subject: [PATCH 2/3] =?UTF-8?q?=E4=B8=80=E9=83=A8=E3=81=AE=E8=AA=9E?=
 =?UTF-8?q?=E5=8F=A5=EF=BC=88role,=20state,=20tabindex=EF=BC=89=E3=81=AE?=
 =?UTF-8?q?=E8=A8=B3=E5=87=BA=E3=82=92=E7=B5=B1=E4=B8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 content/patterns/alertdialog/alertdialog-pattern.html  | 10 +++++-----
 content/patterns/alertdialog/examples/alertdialog.html |  6 +++---
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/content/patterns/alertdialog/alertdialog-pattern.html b/content/patterns/alertdialog/alertdialog-pattern.html
index d2a06ed5..5eb7ff84 100644
--- a/content/patterns/alertdialog/alertdialog-pattern.html
+++ b/content/patterns/alertdialog/alertdialog-pattern.html
@@ -22,7 +22,7 @@ <h2>このパターンについて</h2>
         <p>
           アラートダイアログは、重要なメッセージを伝え、応答を取得するためにユーザーのワークフローを中断する<a href="../dialog-modal/dialog-modal-pattern.html">モーダルダイアログ</a>です。
           アクションの確認プロンプトやエラーメッセージの確認などが例として挙げられます。
-          <a href="#alertdialog" class="role-reference">alertdialog</a>の役割は、アシスティブテクノロジーやブラウザがアラートダイアログを他のダイアログと区別できるようにするためのもので、システムアラート音を再生するなど、アラートダイアログに特別な処理を施すオプションを持っています。
+          <a href="#alertdialog" class="role-reference">alertdialog</a>ロールは、支援技術やブラウザがアラートダイアログを他のダイアログと区別できるようにするためのもので、システムアラート音を再生するなど、アラートダイアログに特別な処理を施すオプションを持っています。
         </p>
       </section>
 
@@ -37,13 +37,13 @@ <h2>キーボードの操作</h2>
       </section>
 
       <section id="roles_states_properties">
-        <h2>WAI-ARIAの役割、状態、およびプロパティ</h2>
+        <h2>WAI-ARIAのロール、ステート、およびプロパティ</h2>
         <ul>
           <li>
-            ダイアログのすべての要素、アラートメッセージやダイアログボタンを含む要素を含む要素には、<a class="role-reference" href="#alertdialog">alertdialog</a>の役割があります。
+            ダイアログのすべての要素、アラートメッセージやダイアログボタンを含む要素を含む要素には、<a class="role-reference" href="#alertdialog">alertdialog</a>ロールがあります。
           </li>
           <li>
-            役割<code>alertdialog</code>を持つ要素は、以下のいずれかを持っています：
+            <code>alertdialog</code>ロールを持つ要素は、以下のいずれかを持っています：
             <ul>
               <li>
                 ダイアログに可視ラベルがある場合、ダイアログのタイトルを含む要素を参照する<a href="#aria-labelledby" class="property-reference">aria-labelledby</a>の値。
@@ -54,7 +54,7 @@ <h2>WAI-ARIAの役割、状態、およびプロパティ</h2>
             </ul>
           </li>
           <li>
-            役割<code>alertdialog</code>を持つ要素には、アラートメッセージを含む要素を参照する<a href="#aria-describedby" class="property-reference">aria-describedby</a>の値が設定されています。
+            <code>alertdialog</code>ロールを持つ要素には、アラートメッセージを含む要素を参照する<a href="#aria-describedby" class="property-reference">aria-describedby</a>の値が設定されています。
           </li>
         </ul>
       </section>
diff --git a/content/patterns/alertdialog/examples/alertdialog.html b/content/patterns/alertdialog/examples/alertdialog.html
index 3ab5ab9f..061331e9 100644
--- a/content/patterns/alertdialog/examples/alertdialog.html
+++ b/content/patterns/alertdialog/examples/alertdialog.html
@@ -38,7 +38,7 @@ <h2>この例について</h2>
         <p>この例の使用方法：</p>
         <ul>
           <li>
-            "discard"ボタンを作動すると、<code>alertdialog</code>の役割を持つ確認ダイアログがトリガーされます。
+            "discard"ボタンを作動すると、<code>alertdialog</code>ロールを持つ確認ダイアログがトリガーされます。
             <ul>
               <li>確認ダイアログの"yes"ボタンを作動すると、"Notes"テキストエリアの内容とノートのローカルストレージの両方が削除されます。</li>
               <li data-test-id="save-button">"no"ボタンを作動するか、<kbd>escape</kbd>を押すと、ダイアログが閉じます。</li>
@@ -158,11 +158,11 @@ <h2 id="kbd_label">キーボードのサポート</h2>
       </section>
 
       <section>
-        <h2 id="rps_label">役割、プロパティ、状態、およびTabindex属性</h2>
+        <h2 id="rps_label">ロール、プロパティ、ステート、およびtabindex属性</h2>
         <table aria-labelledby="rps_label" class="data attributes">
           <thead>
             <tr>
-              <th scope="col">役割</th>
+              <th scope="col">ロール</th>
               <th scope="col">属性</th>
               <th scope="col">要素</th>
               <th scope="col">使用法</th>

From d7c0105110ab93030d6ef399af2c53df900cf9b4 Mon Sep 17 00:00:00 2001
From: Kazuhiko Tsuchiya <kaz.tsuchiya@gmail.com>
Date: Mon, 16 Oct 2023 16:24:41 +0900
Subject: [PATCH 3/3] =?UTF-8?q?ChatGPT=20=E3=81=AE=E7=BF=BB=E8=A8=B3?=
 =?UTF-8?q?=E5=86=85=E5=AE=B9=E3=81=AE=E7=A2=BA=E8=AA=8D=E3=81=A8=E4=BF=AE?=
 =?UTF-8?q?=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../alertdialog/alertdialog-pattern.html      | 24 ++++----
 .../alertdialog/examples/alertdialog.html     | 60 +++++++++----------
 2 files changed, 39 insertions(+), 45 deletions(-)

diff --git a/content/patterns/alertdialog/alertdialog-pattern.html b/content/patterns/alertdialog/alertdialog-pattern.html
index 5eb7ff84..6154069d 100644
--- a/content/patterns/alertdialog/alertdialog-pattern.html
+++ b/content/patterns/alertdialog/alertdialog-pattern.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8">
     <meta content="width=device-width, initial-scale=1.0" name="viewport">
-    <title>アラートとメッセージダイアログ パターン</title>
+    <title>アラート及びメッセージダイアログ パターン</title>
 
     <!-- Core JS and CSS shared by all patterns -->
     <link rel="stylesheet" href="https://www.w3.org/StyleSheets/TR/2016/base.css">
@@ -14,47 +14,45 @@
   </head>
   <body>
     <main>
-      <h1>アラートとメッセージダイアログ パターン</h1>
+      <h1>アラート及びメッセージダイアログ パターン</h1>
       <!-- 翻訳元リビジョン: https://github.com/w3c/aria-practices/tree/d6cf9d8db772603a456e7d7ef52e409d39124301 -->
 
       <section id="about">
         <h2>このパターンについて</h2>
         <p>
-          アラートダイアログは、重要なメッセージを伝え、応答を取得するためにユーザーのワークフローを中断する<a href="../dialog-modal/dialog-modal-pattern.html">モーダルダイアログ</a>です。
-          アクションの確認プロンプトやエラーメッセージの確認などが例として挙げられます。
-          <a href="#alertdialog" class="role-reference">alertdialog</a>ロールは、支援技術やブラウザがアラートダイアログを他のダイアログと区別できるようにするためのもので、システムアラート音を再生するなど、アラートダイアログに特別な処理を施すオプションを持っています。
+          アラートダイアログは、重要なメッセージを伝えて応答を取得するため、利用者のワークフローを中断する<a href="../dialog-modal/dialog-modal-pattern.html">モーダルダイアログ</a>です。アクションの確認プロンプトやエラーメッセージの確認などが例として挙げられます。<a href="#alertdialog" class="role-reference">alertdialog</a> ロールは、支援技術やブラウザがアラートダイアログを他のダイアログと区別できるようにするためのもので、システムアラート音を再生するなど、アラートダイアログに特別な処理を施すオプションを持っています。
         </p>
       </section>
 
       <section id="examples">
         <h2>例</h2>
-        <p><a href="../alertdialog/examples/alertdialog.html">アラートダイアログの例</a>：アラートダイアログを示す確認プロンプト。</p>
+        <p><a href="../alertdialog/examples/alertdialog.html">アラートダイアログの例</a>：アラートダイアログのデモンストレーションである確認プロンプト。</p>
       </section>
 
       <section id="keyboard_interaction">
         <h2>キーボードの操作</h2>
-        <p><a href="../dialog-modal/dialog-modal-pattern.html">モーダルダイアログのパターン</a>のキーボード操作セクションを参照してください。</p>
+        <p><a href="../dialog-modal/dialog-modal-pattern.html">モーダルダイアログのパターン</a>のキーボード操作のセクションを参照してください。</p>
       </section>
 
       <section id="roles_states_properties">
-        <h2>WAI-ARIAのロール、ステート、およびプロパティ</h2>
+        <h2>WAI-ARIA のロール、ステート、及びプロパティ</h2>
         <ul>
           <li>
-            ダイアログのすべての要素、アラートメッセージやダイアログボタンを含む要素を含む要素には、<a class="role-reference" href="#alertdialog">alertdialog</a>ロールがあります。
+            アラートメッセージやダイアログボタンといった、ダイアログのすべての要素を包含する要素には、<a class="role-reference" href="#alertdialog">alertdialog</a> ロールがあります。
           </li>
           <li>
-            <code>alertdialog</code>ロールを持つ要素は、以下のいずれかを持っています：
+            <code>alertdialog</code> ロールを持つ要素は、以下のいずれかを持っています：
             <ul>
               <li>
-                ダイアログに可視ラベルがある場合、ダイアログのタイトルを含む要素を参照する<a href="#aria-labelledby" class="property-reference">aria-labelledby</a>の値。
+                ダイアログに可視ラベルがある場合、ダイアログのタイトルを含む要素を参照する <a href="#aria-labelledby" class="property-reference">aria-labelledby</a> の値。
               </li>
               <li>
-                ダイアログに可視ラベルがない場合、<a href="#aria-label" class="property-reference">aria-label</a>の値。
+                ダイアログに可視ラベルがない場合、<a href="#aria-label" class="property-reference">aria-label</a> の値。
               </li>
             </ul>
           </li>
           <li>
-            <code>alertdialog</code>ロールを持つ要素には、アラートメッセージを含む要素を参照する<a href="#aria-describedby" class="property-reference">aria-describedby</a>の値が設定されています。
+            <code>alertdialog</code> ロールを持つ要素には、アラートメッセージを含む要素を参照する <a href="#aria-describedby" class="property-reference">aria-describedby</a> の値が設定されています。
           </li>
         </ul>
       </section>
diff --git a/content/patterns/alertdialog/examples/alertdialog.html b/content/patterns/alertdialog/examples/alertdialog.html
index 061331e9..92a328e8 100644
--- a/content/patterns/alertdialog/examples/alertdialog.html
+++ b/content/patterns/alertdialog/examples/alertdialog.html
@@ -32,32 +32,31 @@ <h1>アラートダイアログの例</h1>
       <section>
         <h2>この例について</h2>
         <p>
-          下の確認プロンプトの例は、<a href="../alertdialog-pattern.html">アラートダイアログのパターン</a>を示しています。
-          また、2つのパターンによって提供される経験を簡単に比較するための<a href="../../alert/alert-pattern.html">アラートのパターン</a>の例も含まれています。
+          以下にある確認プロンプトの例は、<a href="../alertdialog-pattern.html">アラートダイアログのパターン</a>のデモンストレーションです。また、<a href="../../alert/alert-pattern.html">アラートのパターン</a>の例も含まれており、2 つのパターンによって提供されるユーザー体験を簡単に比較することができます。
         </p>
         <p>この例の使用方法：</p>
         <ul>
           <li>
-            "discard"ボタンを作動すると、<code>alertdialog</code>ロールを持つ確認ダイアログがトリガーされます。
+            「破棄」ボタンを作動すると、<code>alertdialog</code> ロールを持つ確認ダイアログがトリガーされます。
             <ul>
-              <li>確認ダイアログの"yes"ボタンを作動すると、"Notes"テキストエリアの内容とノートのローカルストレージの両方が削除されます。</li>
-              <li data-test-id="save-button">"no"ボタンを作動するか、<kbd>escape</kbd>を押すと、ダイアログが閉じます。</li>
-              <li>ノートのテキストエリアにテキストが含まれていない場合、"discard"ボタンは無効になります。</li>
+              <li>確認ダイアログの「はい」ボタンを作動すると、「ノート」のテキストエリアの内容及びノートのローカルストレージの両方が削除されます。</li>
+              <li data-test-id="save-button">「いいえ」ボタンを作動するか、<kbd>escape</kbd> キーを押すと、ダイアログが閉じます。</li>
+              <li>ノートのテキストエリアにテキストが含まれていない場合、「破棄」ボタンは無効になります。</li>
             </ul>
           </li>
           <li>
-            "Notes"テキストエリアの内容が<a href="https://html.spec.whatwg.org/multipage/webstorage.html#the-localstorage-attribute">ローカルストレージ</a>に保存されるときにアラートをトリガーするために"save"ボタンを作動します。
+          「保存」ボタンを作動すると、「ノート」のテキストエリアの内容が<a href="https://html.spec.whatwg.org/multipage/webstorage.html#the-localstorage-attribute">ローカルストレージ</a>に保存されると同時にアラートがトリガーされます。
             <ul>
-              <li>成功した保存は、ノートが保存されたことをユーザーに通知する短いアラートをトリガーします。</li>
-              <li>ユーザーのローカルストレージの値が"Notes"フィールドと同じ場合、"save"ボタンは無効になります。</li>
+              <li>保存が成功することで、ノートが保存されたことを利用者に通知する短いアラートをトリガーします。</li>
+              <li>利用者のローカルストレージの値が「ノート」フィールドと同じ場合、「保存」ボタンは無効になります。</li>
             </ul>
           </li>
-          <li>必要に応じて"notes"テキストエリアを変更して、discardとsaveの機能を有効/無効にします。</li>
+          <li>必要に応じて「ノート」のテキストエリアを変更して、破棄及び保存の機能を有効、無効にします。</li>
         </ul>
         <p>類似の例には以下があります：</p>
         <ul>
           <li><a href="../../alert/examples/alert.html">アラート</a>：基本的なアラート。</li>
-          <li><a href="../../dialog-modal/examples/dialog.html">モーダルダイアログの例</a>：少ない量と多い量のコンテンツの両方を持つモーダルダイアログの複数のレイヤーを示す例。</li>
+          <li><a href="../../dialog-modal/examples/dialog.html">モーダルダイアログの例</a>：コンテンツの量が少ないものと多いもの、両方のモーダルダイアログを複数のレイヤーで示す例です。</li>
           <li><a href="../../dialog-modal/examples/datepicker-dialog.html">日付選択ダイアログの例</a>：日付を選択するためのカレンダーグリッドを含むダイアログを示します。</li>
         </ul>
       </section>
@@ -69,7 +68,7 @@ <h2 id="ex_label">例</h2>
         <div role="separator" id="ex_start_sep" aria-labelledby="ex_label ex_start_sep" aria-label="の開始"></div>
         <div id="ex_alertdialog">
           <label for="notes">ノート</label>
-          <textarea class="notes" name="notes" id="notes" rows="7">これは例のテキストボックスで、予想通りテキストが含まれています。ユーザーはこのテキストを保存するオプションを持っています - これは基本的なアラートをトリガーします - またはテキストを破棄するオプションを持っています - これはユーザーに確認を求めるアラートダイアログをトリガーします。</textarea>
+          <textarea class="notes" name="notes" id="notes" rows="7">これはテキストボックスの例で、その通りテキストが含まれています。利用者はこのテキストを保存するオプションを持っており、これは基本的なアラートをトリガーします。またはテキストを破棄するオプションを持っており、これは利用者に確認を求めるアラートダイアログをトリガーします。</textarea>
           <div class="visually-hidden" id="notes_save_status" role="alert"></div>
           <button type="button" id="notes_save">
             保存
@@ -100,15 +99,13 @@ <h2 id="dialog_label" class="dialog_label">確認</h2>
       <section>
         <h2>アクセシビリティの特徴</h2>
         <ul>
-          <li>アラートダイアログのアクセシブルな名前は、その見出し（"確認"）に設定されています。</li>
-          <li>ダイアログのプロンプト（"本当に...?"）は、<code>aria-describedby</code>を使用して参照されているため、ユーザーはプロンプトをすぐに認識できます。</li>
+          <li>アラートダイアログのアクセシブルな名前は、その見出し (「確認」) に設定されています。</li>
+          <li>ダイアログのプロンプト (「すべてのノートを破棄してもよろしいですか？」) は、<code>aria-describedby</code> を使用して参照されているため、利用者はプロンプトをすぐに認識できます。</li>
           <li>
-            フォーカスは、ダイアログ内の最初のフォーカス可能な要素、つまり"No" <code>button</code>に自動的に設定されます。
-            これは最も破壊的でないアクションですので、"No"にフォーカスを合わせることで、ユーザーが破壊的な"Discard"アクションを誤って確認するのを防ぐのに役立ちます。
-          </li>
+            フォーカスは、ダイアログ内の最初のフォーカス可能な要素、つまり「いいえ」の <code>button</code> に自動的に設定されます。これは最も破壊的でないアクションであり、「いいえ」にフォーカスが当たることで、破壊的でやり直しができない「破棄」のアクションを、利用者が誤って確定してしまうのを防ぐのに役立ちます。
+      </li>
           <li>
-            ボタンが無効の場合、HTMLの<code>disabled</code>属性の代わりに<code>aria-disabled</code>が使用されるため、ボタンはページの<kbd>Tab</kbd>シーケンスに残ります。
-            これにより、スクリーンリーダーのユーザーがボタンを発見し、インターフェースの動作を判断するのが容易になります。
+            ボタンが無効の場合、HTML の <code>disabled</code> 属性の代わりに <code>aria-disabled</code> が使用されるため、ボタンはページの <kbd>Tab</kbd> シーケンスに残ります。これにより、スクリーンリーダーの利用者がボタンを発見し、インターフェースの動作を判断するのが容易になります。
           </li>
         </ul>
       </section>
@@ -147,18 +144,18 @@ <h2 id="kbd_label">キーボードのサポート</h2>
             </tr>
             <tr>
               <th><kbd>Command + S</kbd></th>
-              <td>(Macのみ) フォーカスがあるときにノートの<code>textarea</code>の内容を保存します。</td>
+              <td>(Mac のみ) フォーカスがあるときにノートの <code>textarea</code> の内容を保存します。</td>
             </tr>
             <tr data-test-id="key-control-s">
               <th><kbd>Control + S</kbd></th>
-              <td>(Windowsのみ) フォーカスがあるときにノートの<code>textarea</code>の内容を保存します。</td>
+              <td>(Windows のみ) フォーカスがあるときにノートの <code>textarea</code> の内容を保存します。</td>
             </tr>
           </tbody>
         </table>
       </section>
 
       <section>
-        <h2 id="rps_label">ロール、プロパティ、ステート、およびtabindex属性</h2>
+        <h2 id="rps_label">ロール、プロパティ、ステート、及び tabindex 属性</h2>
         <table aria-labelledby="rps_label" class="data attributes">
           <thead>
             <tr>
@@ -203,29 +200,28 @@ <h2 id="rps_label">ロール、プロパティ、ステート、およびtabinde
               <td></td>
               <th scope="row"><code>aria-disabled="true"</code></th>
               <td><code>button</code></td>
-              <td>ボタンが活性化できないことを支援技術のユーザーに伝えます。</td>
+              <td>ボタンが作動できないことを支援技術の利用者に伝えます。</td>
             </tr>
           </tbody>
         </table>
-        <h3><code>aria-modal</code>と<code>aria-hidden</code>に関する注意</h3>
+        <h3><code>aria-modal</code> 及び <code>aria-hidden</code> に関する注意</h3>
         <ul>
           <li>
-            <code>aria-modal</code>プロパティはARIA 1.1で導入されました。
-            比較的新しいプロパティであるため、スクリーンリーダーのユーザーはそれに対するサポートの度合いが異なる場合があります。
+            <code>aria-modal</code> プロパティは ARIA 1.1 で導入されました。比較的新しいプロパティであるため、スクリーンリーダーの利用者はそれに対する異なるサポート度合いを体験するかもしれません。
           </li>
-          <li><code>aria-modal</code>プロパティを<code>dialog</code>要素に適用することで、ダイアログの背景に<code>aria-hidden</code>を使用してコンテンツが非アクティブであることを支援技術に伝える技術を置き換えます。</li>
+          <li><code>aria-modal</code> プロパティを <code>dialog</code> 要素に適用することで、ダイアログの背景に <code>aria-hidden</code> を使用してコンテンツが非アクティブであることを支援技術に伝えるテクニックを、置き換えます。</li>
           <li>
-            <code>aria-hidden</code>を使用してダイアログの外のコンテンツを支援技術のユーザーに対して非アクティブにするレガシーダイアログの実装では、以下が重要です：
+            <code>aria-hidden</code> を使用してダイアログの外のコンテンツを支援技術の利用者に対して非アクティブにするレガシーなダイアログの実装では、以下が重要です：
             <ul>
-              <li>非アクティブなレイヤーの一部を含む各要素に<code>aria-hidden</code>が<code>true</code>に設定されていること。</li>
-              <li>ダイアログ要素が<code>aria-hidden</code>が<code>true</code>に設定されている要素の子孫でないこと。</li>
+              <li>非アクティブなレイヤーの各部分を含む要素で、<code>aria-hidden</code> が <code>true</code> に設定されていること。</li>
+              <li>ダイアログ要素は、<code>aria-hidden</code> が <code>true</code> に設定されている要素の子孫でないこと。</li>
             </ul>
           </li>
         </ul>
       </section>
 
       <section>
-        <h2 id="src_label">JavascriptとCSSのソースコード</h2>
+        <h2 id="src_label">Javascript 及び CSS のソースコード</h2>
         <ul id="css_js_files">
           <li>CSS: <a href="css/alertdialog.css" type="text/css">alertdialog.css</a></li>
           <li>Javascript: <a href="js/alertdialog.js" type="text/javascript">alertdialog.js</a>, <a href="../../../shared/js/utils.js">utils.js</a></li>
@@ -233,7 +229,7 @@ <h2 id="src_label">JavascriptとCSSのソースコード</h2>
       </section>
 
       <section>
-        <h2 id="sc1_label">HTMLのソースコード</h2>
+        <h2 id="sc1_label">HTML のソースコード</h2>
         <div role="separator" id="sc1_start_sep" aria-labelledby="sc1_start_sep sc1_label" aria-label="の開始"></div>
         <pre><code id="sc1"></code></pre>
         <div role="separator" id="sc1_end_sep" aria-labelledby="sc1_end_sep sc1_label" aria-label="の終了"></div>