diff options
Diffstat (limited to 'files/ja/web/accessibility')
10 files changed, 5 insertions, 62 deletions
diff --git a/files/ja/web/accessibility/an_overview_of_accessible_web_applications_and_widgets/index.html b/files/ja/web/accessibility/an_overview_of_accessible_web_applications_and_widgets/index.html index 8e3ab5e104..b9a5e54406 100644 --- a/files/ja/web/accessibility/an_overview_of_accessible_web_applications_and_widgets/index.html +++ b/files/ja/web/accessibility/an_overview_of_accessible_web_applications_and_widgets/index.html @@ -91,23 +91,15 @@ translation_of: Web/Accessibility/An_overview_of_accessible_web_applications_and <p>開発者は UI ウィジェット要素の状態を示すために ARIA のステートを使用して、ステートの変化に基づく視覚的外見の変更に (スクリプトを使用して要素のクラス名を変更するのではなく) CSS の属性セレクタを使用しましょう。</p> -<p><em>注意: この例(</em><s><em><a class="external external-icon" href="http://www.oaa-accessibility.org/example/25/" rel="freelink">http://www.oaa-accessibility.org/example/25/</a></em></s><em>) はもう利用できません。状況が変わったので、W3C ARIA オーサリングプラクティスガイドの例</em> <em>(<a class="external external-icon" href="http://www.w3.org/TR/wai-aria-practices-1.1/examples/checkbox/checkbox-1/checkbox-1.html">www.w3.org/TR/wai-aria-practices-1.1/examples/checkbox/checkbox-1/checkbox-1.html</a>) を見てください。</em></p> - -<p><s>Open Ajax Alliance の Web サイトに、<a href="http://www.oaa-accessibility.org/example/25/">ARIA のステートに基づく CSS 属性セレクタの例</a>があります。この例では、動的なメニューシステムによる WYSIWYG エディタのインターフェイスを示しています。フォントフェイススなどのメニューで現在選択されている項目は、他のアイテムと視覚的に区別されます。例の中で関係する部分を、以下で説明します。</s></p> - -<p><s>この例でメニュー用の HTML は、例 1a で示す形式になっています。7 行目と 13 行目で、メニュー項目の選択状態を表すために <strong><code>aria-checked</code></strong> プロパティを使用していることに注意してください。</s></p> - -<p><s><em>例 1a: 選択可能なメニュー用の HTML (<a href="http://www.oaa-accessibility.org/example/25/" rel="freelink">http://www.oaa-accessibility.org/example/25/</a> をもとに改作)。</em></s></p> - <h4 id="Visibility_changes" name="Visibility_changes">可視性の変化</h4> <p>コンテンツの可視性を変えるとき (例えば要素を隠したり表示したりする)、開発者は <strong><code>aria-hidden</code></strong> プロパティの値を変更するとよいでしょう。先に説明した手法を、<code>display:none</code> を使用して要素を視覚的に隠すという CSS を示すために使用しましょう。</p> -<p>Open Ajax Alliance の Web サイトに、<a href="http://www.oaa-accessibility.org/example/39/">可視性の制御に <strong><code>aria-hidden</code></strong> を使用するツールチップの例</a>があります。この例では、入力フィールドに関する指示を収めたツールチップを持つシンプルな Web フォームの例を示しています。例の中で関係する部分を、以下で説明します。</p> +<p>これは、可視性の制御に <strong><code>aria-hidden</code></strong> を使用するツールチップの例です。この例では、入力フィールドに関する指示を収めたツールチップを持つシンプルな Web フォームの例を示しています。例の中で関係する部分を、以下で説明します。</p> <p>この例でツールチップ用の HTML は、例 2a で示す形式になっています。9 行目で <strong><code>aria-hidden</code></strong> を <code>true</code> に設定しています。</p> -<p><em>例 2a: ツールチップ用の HTML (<a href="http://www.oaa-accessibility.org/example/39/" rel="freelink">http://www.oaa-accessibility.org/example/39/</a> をもとに改作)。</em></p> +<p><em>例 2a: ツールチップ用の HTML</em></p> <pre class="brush: html"><div class="text"> <label id="tp1-label" for="first">First Name:</label> @@ -123,7 +115,7 @@ translation_of: Web/Accessibility/An_overview_of_accessible_web_applications_and <p>このマークアップ用の CSS を例 2b で示します。ここでは独自のクラス名を使用せず、1 行目で <strong><code>aria-hidden</code></strong> 属性の状態のみを使用していることに注意してください。</p> -<p><em>例 2b: 状態を示すための、属性セレクタ (<a href="http://www.oaa-accessibility.org/example/39/" rel="freelink">http://www.oaa-accessibility.org/example/39/</a> より)。</em></p> +<p><em>例 2b: 状態を示すための、属性セレクタ</em></p> <pre class="brush: css">div.tooltip[aria-hidden="true"] { display: none; @@ -132,7 +124,7 @@ translation_of: Web/Accessibility/An_overview_of_accessible_web_applications_and <p><strong>><code>aria-hidden</code></strong> プロパティを更新するための JavaScript は、例 2c で示す形式になっています。このスクリプトは <strong>><code>aria-hidden</code></strong> 属性しか更新しないことに注意してください (2 行目)。独自のクラス名の追加や削除は不要です。</p> -<p><em>例 2c: aria-hidden 属性を更新する JavaScript (<a href="http://www.oaa-accessibility.org/example/39/" rel="freelink">http://www.oaa-accessibility.org/example/39/</a> に基づく)。</em></p> +<p><em>例 2c: aria-hidden 属性を更新する JavaScript</em></p> <pre class="brush: js">var showTip = function(el) { el.setAttribute('aria-hidden', 'false'); diff --git a/files/ja/web/accessibility/aria/aria_techniques/using_the_alert_role/index.html b/files/ja/web/accessibility/aria/aria_techniques/using_the_alert_role/index.html index 82207358d0..192b9a498b 100644 --- a/files/ja/web/accessibility/aria/aria_techniques/using_the_alert_role/index.html +++ b/files/ja/web/accessibility/aria/aria_techniques/using_the_alert_role/index.html @@ -104,13 +104,6 @@ document.getElementById("formInstruction").setAttribute("role", "alert");</pre> <pre class="brush: js">// removing the 'hidden' class makes the element visible, which will make the screen reader announce the alert: document.getElementById("expirationWarning").className = ""; </pre> -<h4 id="実施例">実施例:</h4> - -<ul> - <li><a class="external" href="http://www.oaa-accessibility.org/example/1/">Alert role example using an ARIA alert box</a></li> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/alertdialog1/">Alert example using a modal ARIA dialog box</a></li> -</ul> - <h3 id="注記">注記 </h3> <ul> diff --git a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-orientation_attribute/index.html b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-orientation_attribute/index.html index 03c6496c1f..3730efb1f7 100644 --- a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-orientation_attribute/index.html +++ b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-orientation_attribute/index.html @@ -52,12 +52,6 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-orientatio </a> </pre> -<h4 id="Working_Examples" name="Working_Examples">動作する例</h4> - -<ul> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/slider1/">スライダーの例</a></li> -</ul> - <h3 id="Notes" name="Notes">注</h3> <h3 id="Used_With_ARIA_Roles" name="Used_With_ARIA_Roles">ARIA ロールで使用</h3> diff --git a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.html b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.html index 1f69f16e2f..55b961e20d 100644 --- a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.html +++ b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.html @@ -42,10 +42,6 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-required_a </form> </pre> -<h4 id="Working_Examples" name="Working_Examples">動作する例</h4> - -<p><a class="external" href="http://www.oaa-accessibility.org/examplep/tooltip1/">ツールチップの例</a>（<code>aria-required</code> 属性の使用を含む）</p> - <h3 id="Notes" name="Notes">注</h3> <h3 id="Used_in_ARIA_roles" name="Used_in_ARIA_roles">ARIA ロールで使用</h3> diff --git a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuemax_attribute/index.html b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuemax_attribute/index.html index 131a8b50cd..18cff00666 100644 --- a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuemax_attribute/index.html +++ b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuemax_attribute/index.html @@ -33,14 +33,6 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemax_a <pre class="deki-transform"><span class="tag"><div role=<span class="str">"slider"</span> aria-valuenow=<span class="str">"4"</span> aria-valuemin=<span class="str">"1"</span> aria-valuemax=<span class="str">"10"</span>></span> </pre> -<h4 id="Working_Examples" name="Working_Examples">動作する例</h4> - -<ul> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/progressbar1/">プログレスバーの例</a></li> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/slider1/">スライダーの例</a></li> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/spinbutton1/">スピンボタンの例</a></li> -</ul> - <h3 id="Notes" name="Notes">注 </h3> <h3 id="Used_With_ARIA_Roles" name="Used_With_ARIA_Roles">ARIA ロールで使用</h3> diff --git a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuemin_attribute/index.html b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuemin_attribute/index.html index 96a4857b74..b73802eb9c 100644 --- a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuemin_attribute/index.html +++ b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuemin_attribute/index.html @@ -29,14 +29,6 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuemin_a <pre class="brush: html"><span class="tag"><div role=<span class="str">"slider"</span> aria-valuenow=<span class="str">"4"</span> aria-valuemin=<span class="str">"1"</span> aria-valuemax=<span class="str">"10"</span>></span> </pre> -<h4 id="Working_Examples.3A" name="Working_Examples.3A">動作する例</h4> - -<ul> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/progressbar1/">プログレスバーの例</a></li> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/slider1/">スライダーの例</a></li> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/spinbutton1/">スピンボタンの例</a></li> -</ul> - <h3 id="Notes" name="Notes">注</h3> <h3 id="Used_With_ARIA_Roles" name="Used_With_ARIA_Roles">ARIA ロールで使用</h3> diff --git a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuenow_attribute/index.html b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuenow_attribute/index.html index 94ec9f7f50..e53607131c 100644 --- a/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuenow_attribute/index.html +++ b/files/ja/web/accessibility/aria/aria_techniques/using_the_aria-valuenow_attribute/index.html @@ -33,14 +33,6 @@ translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-valuenow_a <pre class="brush: html"><span class="tag"><div role=<span class="str">"slider"</span> aria-valuenow=<span class="str">"4"</span> aria-valuemin=<span class="str">"1"</span> aria-valuemax=<span class="str">"10"</span>></span> </pre> -<h4 id="Working_Examples.3A" name="Working_Examples.3A">動作する例</h4> - -<ul> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/progressbar1/">プログレスバーの例</a></li> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/slider1/">スライダーの例</a></li> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/spinbutton1/">スピンボタンの例</a></li> -</ul> - <h3 id="Notes" name="Notes">注 </h3> <h3 id="Used_With_ARIA_Roles" name="Used_With_ARIA_Roles">ARIA ロールで使用</h3> diff --git a/files/ja/web/accessibility/aria/aria_techniques/using_the_slider_role/index.html b/files/ja/web/accessibility/aria/aria_techniques/using_the_slider_role/index.html index dbe13c701e..1ab569de6c 100644 --- a/files/ja/web/accessibility/aria/aria_techniques/using_the_slider_role/index.html +++ b/files/ja/web/accessibility/aria/aria_techniques/using_the_slider_role/index.html @@ -98,12 +98,6 @@ var updateSlider = function (newValue) { }; </pre> -<h3 id="Working_Examples" name="Working_Examples">動作する例</h3> - -<ul> - <li><a class="external" href="http://www.oaa-accessibility.org/examplep/slider1/">スライダーの例</a></li> -</ul> - <h2 id="Notes" name="Notes">注</h2> <p> </p> diff --git a/files/ja/web/accessibility/aria/forms/basic_form_hints/index.html b/files/ja/web/accessibility/aria/forms/basic_form_hints/index.html index f1a4dc9646..65ce604cd9 100644 --- a/files/ja/web/accessibility/aria/forms/basic_form_hints/index.html +++ b/files/ja/web/accessibility/aria/forms/basic_form_hints/index.html @@ -43,8 +43,6 @@ translation_of: Web/Accessibility/ARIA/forms/Basic_form_hints <p>以下の例では、順不同リストを使用して実装したラジオボタングループを示しています。3 行目で {{HTMLElement("li")}} 要素の <strong>aria-labelledby</strong> 属性に、1 行目の {{HTMLElement("h3")}} 要素の <strong>id</strong> である "rg1_label" を設定しており、h3 要素がラジオボタングループのラベルです。</p> -<p><em>例 2. 順不同リストを使用して実装したラジオボタングループ (<a href="http://www.oaa-accessibility.org/examplep/radio1/">http://www.oaa-accessibility.org/examplep/radio1/</a> をもとに改作)</em></p> - <pre class="brush: html"><h3 id="rg1_label">Lunch Options</h3> <ul class="radiogroup" id="rg1" role="radiogroup" aria-labelledby="rg1_label"> diff --git a/files/ja/web/accessibility/keyboard-navigable_javascript_widgets/index.html b/files/ja/web/accessibility/keyboard-navigable_javascript_widgets/index.html index 72a23044f3..d6c3556643 100644 --- a/files/ja/web/accessibility/keyboard-navigable_javascript_widgets/index.html +++ b/files/ja/web/accessibility/keyboard-navigable_javascript_widgets/index.html @@ -136,7 +136,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets <p>このテクニックでは、単一のイベントハンドラをコンテナウィジェットにバインドし、<code>aria-activedescendant</code> を使用して「仮想」フォーカスを追跡します。 （ARIA に関する詳細は、<a href="/ja/docs/Web/Accessibility/An_Overview_of_Accessible_Web_Applications_and_Widgets">アクセス可能なウェブアプリケーションとウィジェットの概要</a>を参照してください。）</p> -<p><code>aria-activedescendant</code> プロパティは、現在仮想フォーカスを持っている子孫要素の ID を識別します。 コンテナのイベントハンドラーは、<code>aria-activedescendant</code> の値を更新し、（例えば、境界線や背景色で）現在の項目が適切にスタイル設定されていることを確実にすることで、キーイベントおよびマウスイベントに応答する必要があります。 これがどのように機能するかの直接的な説明については、この <a href="http://www.oaa-accessibility.org/example/28/">ARIA ラジオグループの例</a>のソースコードを参照してください。</p> +<p><code>aria-activedescendant</code> プロパティは、現在仮想フォーカスを持っている子孫要素の ID を識別します。 コンテナのイベントハンドラーは、<code>aria-activedescendant</code> の値を更新し、（例えば、境界線や背景色で）現在の項目が適切にスタイル設定されていることを確実にすることで、キーイベントおよびマウスイベントに応答する必要があります。</p> <h3 id="General_Guidelines" name="General_Guidelines">一般的なガイドライン</h3> |