ウェブアクセシビリティ拡張機能第4弾として、Google Chrome拡張機能「Area Flash Checker（エリア・フラッシュ・チェッカー）」をリリースしました。
第1弾「Area Contrast Checker」で生まれた、ドラッグで範囲を選んで見えているままを解析する「エリア解析」のアプローチを今回は「動き」へと広げています。
WCAGの達成基準 2.3.1 / 2.3.2 に基づき、ページ上で動いているものの閃光を動いているその場でチェックできます。
開発の背景：見落とされやすく確かめにくい「閃光」
激しい明滅や赤色の点滅は光過敏性発作を引き起こすおそれがあります。
日本でも1997年テレビアニメの放送をきっかけに多くの視聴者が体調不良を訴えた事例が広く知られています。
WCAGでは閃光に関する達成基準をレベルAという最も基本的な要件として定めています。
Webサイトでこの基準に抵触するほどの閃光が生じることは多くありませんが、ひとたび起きれば利用者の健康に直接関わります。
また閃光は動画に限らず、CSSアニメーション・Canvasによる演出・広告枠などでも起こりえます。
これまで閃光のチェックにはPEATに代表される動画ファイル解析型のツールが使われてきました。
こうしたツールは主に動画素材を制作段階でチェックするためのものです。
Webサイトに組み込んだ後の状態を検証するにはページを画面収録し、動画ファイルを変換してツールに読み込ませ、修正のたびにその手順を繰り返す必要がありました。
「気になる動きを見つけたら、その場ですぐに確かめたい。」
そうした現場の思いから開発がスタートしました。
録画いらずでページ上の「動いているまま」を計測
調べたい範囲をドラッグで選び（または表示全体を対象にし）5〜60秒キャプチャするだけです。
描画フレームを直接解析するためユーザーが実際に目にしているままの一般閃光・赤色閃光を数えられます。
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. タイムラインと閃光マップ
輝度変化率・閃光面積・違反面積の推移をタイムラインで表示します。ホバーや矢印キーでタイムラインをなぞると、その時間に選択範囲のどこが光っていたかをフレームプレビューに重ねて表示します。
3. 実際のページで使うための配慮
- 60fpsでのキャプチャを要求し、実効フレームレートを表示。高速な明滅を取りこぼすおそれがある場合は警告
- Retina / 高DPIディスプレイやブラウザのズームに自動で対応
- 誤検知を防ぐため、細い線や文字の縁などの細い構造を面積計算から規定で除外（計測対象によって無効にして計測可）
- 計測中のオーバーレイがキャプチャに写り込まない設計
4. ツール自体のアクセシビリティ
スクリーンリーダーに対応し、計測の状態と結果を読み上げます。キーボードでのタイムライン操作や、どの段階でもEscapeキーで戻れる操作性など、アクセシビリティツールとしての使いやすさにも配慮しています。
※ データ収集や外部への送信は一切行いません。キャプチャしたフレームはブラウザのメモリ上で解析後すぐに破棄されるため、公開前のページや社内環境でも安心してご利用いただけます。
Area Flash Checkerのダウンロードはこちら
リベロジックでは、アクセシビリティを「特別な対応」ではなく「当たり前の品質」にすることを目指しています。
閃光はHTMLやCSSを解析する自動診断では判定しにくく、人による確認が必要となる領域の一つです。
自動診断ツール「Lente Scan」で全体像を把握し、拡張機能で個別の項目を確かめ、最終的な適合判断は専門家による手動診断「Lente Audit」で行う。
自動診断、現場のツール、専門家の手動診断を組み合わせることで継続的なアクセシビリティ改善を支援します。
アクセシビリティをより身近によりスムーズに。
これからも現場の声を形にしたツールとサービスをお届けしてまいります。
