From 3275519789f1cbd602dd8c128092a7a07f795691 Mon Sep 17 00:00:00 2001 From: MDN Date: Wed, 22 Dec 2021 00:54:05 +0000 Subject: [CRON] sync translated content --- .../using_the_alert_role/index.html | 138 --------------------- 1 file changed, 138 deletions(-) delete mode 100644 files/ja/web/accessibility/aria/aria_techniques/using_the_alert_role/index.html (limited to 'files/ja/web') 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 deleted file mode 100644 index 367640803c..0000000000 --- a/files/ja/web/accessibility/aria/aria_techniques/using_the_alert_role/index.html +++ /dev/null @@ -1,138 +0,0 @@ ---- -title: alert ロールの使用 -slug: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role -tags: - - ARIA - - Accessibility - - Advanced - - CSS - - Example - - HTML - - NeedsContent - - alert - - alert role - - alertrole - - alerts - - assitive technology - - role configuration - - wcag1.2.1 - - wcag3.3.1 -translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role ---- -

説明

- -
-

alert ロールの使用方法についての技術デモとブラウザおよび支援技術に及ぼす影響の説明。

-
- -

alert ロールは重要かつ一般に時間的制約のあるメッセージをユーザーへ伝えるために使用されます。このロールが要素へ追加されたとき、ブラウザはアクセシブルなアラートイベントをユーザーに向けて通知可能な支援技術製品へ送信します。 アラートロールはユーザの注意を即座に必要とする場合において最も便利です、例えば:

- - - -

その押し付けがましい性質から、アラートロールはユーザーの注意を直ちに引く必要があるときにだけかつ控えめに使用されるべきです。 緊急度の低い動的な変更は、aria-live="polite" や他のライブリージョンロールなどのあまり積極的ではない方法を使うべきです。

- -

ユーザーエージェントと支援技術への影響

- -

アラートロールが要素へ追加されたとき、もしくはそのような要素が可視になったときにユーザーエージェントは以下のことを実行する必要があります:

- - - -

支援技術製品はそのようなイベントを監視し、それに応じてユーザへ通知すべきです:

- - - -
注釈: 支援技術がこの技術をどのように処理すべきかについては意見が異なる場合があります。上記の情報は意見の一つで、したがって標準ではありません。
- -

例

- -

例1: HTMLコードへのロールの追加

- -

下のスニペットは html ソースコードへどうのようにアラートロールが直接追加されるかを示しています。要素が読み込み完了した瞬間にスクリーンリーダーはアラートの通知をするはずです。ページが読み込み終わったとき、もし要素がすでにオリジナルのソースコードにあったら、スクリーンリーダーはページタイトルをアナウンスした後にすぐにエラーを知らせるでしょう。

- -
<h2 role="alert">Your form could not be submitted because of 3 validation errors.</h2>
- -

例2: 動的にアラートロールをもつ要素を追加

- -

このスニペットはアラートロールを持つ要素を動的に生成し、ドキュメント構造へ追加します。

- -
var myAlert = document.createElement("p");
-myAlert.setAttribute("role", "alert");
-var myAlertText = document.createTextNode("You must agree with our terms of service to create an account.");
-myAlert.appendChild(myAlertText);
-document.body.appendChild(myAlert);
-
- -

注: jQuery のようなスクリプトライブラリを使ったときはより少ないコードで同じ結果を実現することができます:

- -
$("<p role='alert'>You must agree with our terms of service to create an account.</p>").appendTo(document.body);
-
- -

例3: 存在する要素へのアラートロールの追加

- -

時々新しい要素を作るよりもすでにページに見えている要素にアラートロールを追加するほうが便利なことがあります。これにより開発者はユーザーへより関連度や緊急性の高い情報を繰り返し表示することができます。例えば、フォームコントロールは期待値についての指示を持っているかもしれません。違う値が入力されたら、スクリーンリーダーがそれを警告としてアナウンスするために role="alert を指示文へ追加される場合があります。以下の疑似スニペットコードはこのアプローチを示しています:

- -
<p id="formInstruction">You must select at least 3 options</p>
-
- -
// When the user tries to submit the form with less than 3 checkboxes selected:
-document.getElementById("formInstruction").setAttribute("role", "alert");
- -

例4: アラートロールをもつ要素を表示する

- -

要素が既に role="alert" を持ち、CSS を使用して最初に非表示になっている場合、それを表示することはページにちょうど追加されたかのようにアラートをが発せられます。存在するアラートを何回も "再利用" できるということを意味しています。

- -

注: ほとんどのケースではこのアプローチは推奨されません、なぜなら現在適応できないエラーやアラート文を隠すことは理想的ではないからです。古い支援技術のユーザーは現在アラートが適応されてないときにもかかわらずアラート文を認識して、ユーザへ問題があると間違って信じこませてしまうかもしれません。

- -
.hidden {
-  display:none;
-}
-
- -
<p id="expirationWarning" role="alert" class="hidden">Your log in session will expire in 2 minutes</p>
-
- -
// removing the 'hidden' class makes the element visible, which will make the screen reader announce the alert:
-document.getElementById("expirationWarning").className = "";
- -

注記 

- - - -

使用される ARIA 属性

- - - -

関連 ARIA 技術

- - - -

互換性

- -

TBD: Add support information for common UA and AT product combinations

- -

その他のリソース

- - - -

 

-- cgit v1.2.3-54-g00ecf