WCAG 2.0 達成方法集

Skip to Content (Press Enter)

-

FLASH11: オブジェクトについて長いテキストの説明を提供する

達成方法に関する重要な情報

これらの達成方法(参考)の使用法及び、それらがWCAG 2.0 達成基準(規定)とどのように関係するかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用(対象)セクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法があるからといって、WCAG 2.0 を満たすコンテンツを作成する際に、常にその技術が使用可能であるわけではない。

適用(対象)

これは、次の達成基準に関連する達成方法である:

ユーザエージェント及び支援技術によるサポート

FLASH11 に関するユーザエージェントサポートノート (英語)を参照のこと。Flash テクノロジーノートも参照。

解説

この実装方法の目的は、画像のアクセシブルな名前として適切な、画像についての長くて詳細なテキスト情報を提供することである。画像の隣にアクセシブルなボタンを配置し、そのボタンによって画像の長いテキストの説明を含む新しいパネルを表示するようにする。

事例

事例 1: 非表示の説明を利用者の要求に応じて表示する

この事例では、統計データを含む画像が用いられている。画像には、短い代替テキストが提供されている(「グラフ:一つ以上の障害があることを申告した米国の施設に入っていない16~64歳の人口比率」)。画像の下にあるボタンを押すことによって、利用者は統計情報自体の長いテキストの説明を表示することができる。ボタンを押すと、次のように動作する。

画像と説明テキストは、既に WebAIM.org に公開されていた HTML example for long image descriptions から引用した。

この実装方法の実例は、非表示の説明を利用者の要求に応じて表示する」のサンプル(英語)で確認できる。また、非表示の説明を利用者の要求に応じて表示するのソース(英語) をダウンロードすることもできる。

コード例:

import flash.accessibility. *;
import fl.accessibility.ButtonAccImpl;
import flash.system.Capabilities;

ButtonAccImpl.enableAccessibility();

//set accessibility properties
graph_mc.accessibilityProperties = new AccessibilityProperties();
graph_mc.accessibilityProperties.name = "Graph of percentage of total U.S. \ 
  noninsitutionalized population age 16-64 declaring one or more disabilities";
longDescBtn.accessibilityProperties = new AccessibilityProperties();
longDesc_mc.accessibilityProperties = new AccessibilityProperties();
longDesc_mc.accessibilityProperties.forceSimple = false;
hideLongDesc();

//set click handlers for button
longDescBtn.addEventListener("click", function () {
  showLongDesc()
});
longDesc_mc.longDescCloseBtn.addEventListener("click", function () {
  hideLongDesc()
});

function showLongDesc() {
  // hide the original content from screen readers
  graph_mc.accessibilityProperties.silent = true;
  graph_mc.tabEnabled = false;
  graph_mc.alpha = 0.2;
  longDescBtn.enabled = false;
  longDescBtn.accessibilityProperties.silent = true;
  longDesc_mc.accessibilityProperties.silent = false;
  // make the long description panel visible, both visually and to screen readers
  longDesc_mc.visible = true;
  longDesc_mc.tabEnabled = true;
  longDesc_mc.longDescTitle.stage.focus = longDesc_mc.longDescTitle;
  if (Capabilities.hasAccessibility)
  Accessibility.updateProperties();
}

function hideLongDesc() {
  //do the opposite to what showLongDesc does
  graph_mc.accessibilityProperties.silent = false;
  graph_mc.tabEnabled = true;
  graph_mc.alpha = 1;
  longDescBtn.enabled = true;
  longDescBtn.accessibilityProperties.silent = false;
  longDesc_mc.visible = false;
  longDesc_mc.accessibilityProperties.silent = true;
  longDesc_mc.tabEnabled = false;
  longDescBtn.stage.focus = longDescBtn;
  if (Capabilities.hasAccessibility)
  Accessibility.updateProperties();
}

検証

チェックポイント

Flash ムービーに長い説明を要する画像が含まれている場合、近くにあるボタンを押すことによって長い説明が表示される。

判定基準

この達成方法が「十分な達成方法」の一つである場合、このチェックポイントや判定基準を満たしていなければ、それはこの達成方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の達成方法によってその達成基準が満たされていることもありうる。