Webアクセシビリティの閃光チェックを支援する新ツール「Area Flash Checker」をリリース

[リベロジック株式会社](https://www.liberogic.jp/)（本社：東京都港区、以下リベロジック）は、Google Chrome拡張機能ウェブアクセシビリティツール第4弾として、Webコンテンツの閃光を表示中のページ上でそのまま計測する[「Area Flash Checker（エリア・フラッシュ・チェッカー）」](https://chromewebstore.google.com/detail/plpikclbekblfmmjeompaggpmghninnj)をリリースしました。

本ツールはW3Cが策定するWebアクセシビリティの国際的なガイドラインWCAG（Web Content Accessibility Guidelines）の達成基準 2.3.1「3回の閃光、又は閾値以下」（レベルA）と 2.3.2「3回の閃光」（レベルAAA）に基づき、ページ上で実際に描画されたピクセルをフレームごとに解析します。

画面収録や動画ファイルのアップロードは不要で、CSSアニメーション / 動画 / Canvas / カルーセル / 広告枠などページ上で動いているものをその場でチェックできます。

## **開発の背景：見落とされやすく確かめにくい「閃光」**

激しい明滅や赤色の点滅は、光過敏性発作を引き起こすおそれがあります。

日本でも1997年にテレビアニメ放送をきっかけに多くの視聴者が体調不良を訴えた事例が広く知られています。

WCAGでは閃光に関する達成基準をレベルAという最も基本的な要件として定めています。

Webサイトでこの基準に抵触するほどの閃光が生じることはそれほど多くありませんが、ひとたび起きれば利用者の健康に直接関わります。

また閃光は動画に限らず、CSSアニメーション・Canvasによる演出・広告枠などでも起こりえます。

「これは大丈夫だろうか」

と気になる動きに出会ったときにその場で確実に確かめられることが重要です。

これまで閃光のチェックには、PEATに代表される動画ファイル解析型のツールが使われてきました。こうしたツールは、主に動画素材を制作段階でチェックするためのものです。Webサイトに組み込んだ後の状態を検証するには、ページを画面収録し、動画ファイルを変換してツールに読み込ませ、修正のたびにその手順を繰り返す必要がありました。

CSSアニメーションや広告枠のように素材としての動画ファイルが存在しない動きはこの方法でしか確かめられません。

**「気になる動きを見つけたらその場ですぐに確かめたい。」**

そうした現場の声から本ツールの開発がスタートしました。

## 録画いらずでページ上で「動いているまま」を計測

[Area Flash Checker](https://chromewebstore.google.com/detail/plpikclbekblfmmjeompaggpmghninnj)は、範囲をドラッグで選び（または表示全体を対象にし）、5〜60秒キャプチャするだけで閃光をチェックできます。描画フレームを直接解析するため、ユーザーが実際に目にしているままの一般閃光・赤色閃光を数えられます。

| 　| 動画ファイル解析型ツール | Area Flash Checker |

| :--- | :--- | :--- |

| **準備** | 画面収録・動画ファイルの保存・読み込み | 拡張機能を起動して範囲を選ぶだけ |

| **対象** | 動画ファイル | ページ上で動いているもの全般（CSSアニメーション、動画、Canvas、GIF、カルーセル、広告枠など） |

| **範囲** | 動画のフレーム全体 | 気になる要素だけに絞り込み可能 |

| **修正後の再確認** | 収録からやり直し | その場で再計測 |

**なお、完成した動画ファイルそのものを監査する場合は動画ファイル解析型のツールが適していますのでご注意ください。**

本ツールは制作・診断の過程で手早く確認するための選択肢として位置づけています。

## 主な機能

### 1. WCAG 達成基準 2.3.1 / 2.3.2 の判定

「3回の閃光、又は閾値以下」（レベルA）と「3回の閃光」（レベルAAA）について、一般閃光と赤色閃光それぞれを適合 / 不適合で表示します。

- **一般閃光**　相対輝度が0.1以上明るくなってから暗くなる（またはその逆の）一往復の変化。暗い側の相対輝度が0.80未満のものを1回と数えます

- **赤色閃光**　WCAG 2.1以降の定義に基づく、飽和赤（R/(R+G+B) ≥ 0.8）との間の遷移で、CIE 1976 UCS上の色度差が0.2を超えるもの

- **面積閾値**　WCAGが推奨する21,824 CSS px²（341×256pxの25%）

結果カードには1秒あたりの最大閃光数・違反面積と閾値の比較・基準を超えた時間帯（ピークの1秒間）もあわせて表示します。

### 2. タイムラインと閃光マップ

輝度変化率・閃光面積・違反面積の推移をタイムラインで表示します。

ホバーや矢印キーでタイムラインをなぞると、その時刻に選択範囲のどこが光っていたかをフレームプレビューに重ねて表示します。