要約

アニメーション グラフィックが発作のリスクをもたらさないこと、およびユーザーがそれを無効にできることを確認します。

注記

このページでは、アニメーション グラフィック形式によって発生する固有の問題のみを取り上げます。これらのグラフィックには、WCAG 要件を満たすために、必要に応じて代替テキストと拡張説明も必要です。

テクニック

例

例 — 置き換え可能なグラフィック

JavaScript を使用してアニメーション GIF を静的な代替画像に置き換えるためのボタンが用意されています。

<img id="rocket"
    src="rocket-launch.gif"
    alt="Rocket blasting off" />
<button
   onclick="replaceImage('rocket', 'static-rocket-launch.jpg')"
   >Stop animation</button>

解説

アニメーション GIF などのアニメーション グラフィックは、出版物ではあまり使用されませんが、その使用には、基本的な説明を超えたアクセシビリティに関する特有の課題があります。アニメーション グラフィックは非常に短いビデオクリップに似ているため、ビデオに影響するいくつかの問題も考慮する必要があります。

主な懸念事項は、画像が発作の危険をもたらさないことです。画像はアニメーション化されているため、フラッシュは 1 秒あたり 3 回を超えてはなりません。アニメーションが 1 秒未満で、アニメーションが無限ループで再生される場合は、アニメーション内のフラッシュの数と 1 秒間のアニメーションのループ回数を掛けて、1 秒あたりのフラッシュを計算する必要があります。

アニメーションが 5 秒後に自動的に終了する場合は、ユーザーが動画コンテンツの再生を停止できるという WCAG の要件を満たしています。電子出版物のページ付けにより、通常、ユーザーはアニメーションが完了しないと画像にたどりつけません。この問題を回避するには、ドキュメント内のアニメーション グラフィックをアニメーション化されていないグラフィックに置き換えるコントロール（通常はボタン）を追加します。その後、ユーザーはアニメーションを再生するかどうかを決定できます。

注記

canvas要素を使用して作成されたアニメーションでは、点滅やユーザーによるオフ設定の必要性という同じ問題が発生しますが、このセクションでは説明されていない追加の問題も発生します。ナレッジ ベースの今後の更新では、アニメーション化されたキャンバスについても取り扱う予定です。

関連リンク