EVN accessibility とは
EVN accessibility は、ウェブサイトに 1 行のタグを貼るだけで使えるアクセシビリティウィジェットです。サイトを訪れた人が、自分の見やすさ・使いやすさに合わせて表示を調整できるようになります。
サイト側で必要なのは、次の 1 行を追加するだけです。
<script src="https://cdn.evn-a11y.com/a11y@2/a11y.js" data-site-id="st_xxxxxxxx" defer></script>
だれの役に立つのか
EVN accessibility は、さまざまな理由でウェブが見づらい・使いづらいと感じる人をサポートします。
- 高齢の方 — 文字が小さい、リンクが分かりにくい
- 弱視・ロービジョンの方 — 色の鮮やかさや明るさを調整したい
- 色覚に特性のある方 — 色だけでは区別しにくい
- ディスレクシア（読み書きの困難）のある方 — 読みやすいフォントや行間がほしい
- 光に敏感な方 — まぶしさや自動再生の動画を避けたい
- 手や指の操作が難しい方 — カーソルを大きくしたい
主な特長
| 特長 | 内容 |
|---|---|
| 1 行で導入 | <script> タグを 1 つ貼るだけ。サイトの改修は不要です。 |
| 軽量 | 表示の負担になりません。 |
| 遠隔から設定 | 管理ダッシュボードから、各サイトのウィジェットを後から設定できます。 |
| CSS が衝突しない | 独自の分離技術により、サイト本来のデザインを壊しません。 |
EVN accessibility は、見た目の表示効果を変えるだけで、サイトのコードや本文を恒久的に書き換えることはありません。訪問者が選んだ設定は、その人のブラウザ（localStorage）に保存されます。
パネルの使い方
画面の右下に丸いボタンが表示されます。これを押すとパネルが開きます。
ワンタップ設定（プリセット）
パネルの「ワンタップ設定」セクションには、利用シーンに合わせた 7 つのプリセットがあります。1 つ選ぶと現在の設定がいったんリセットされ、そのプリセットに含まれる機能がまとめてオンになります（同時にオンにできるプリセットは 1 つだけです）。
| プリセット | 内容 |
|---|---|
| 老眼 | 文字サイズ 114%、行間を広げ、読みやすいフォント、動画の停止、カーソルの拡大、高彩度、リンクに下線 |
| 認知と学習 | 画像の非表示、動画の停止、リンクに下線、カーソルの拡大 |
| 弱視 | 文字サイズ 121%、高彩度、動画の停止、リンクに下線、フォントの変更、カーソルの拡大 |
| 色弱 | 高彩度 |
| 光覚 | モノクロ、画像の非表示、動画の停止 |
| てんかん | 低彩度、動画の停止 |
| 失読症 | フォントの変更、動画の停止 |
カスタマイズ（メイン / サブタブ）
ワンタップ設定の下には「カスタマイズ」エリアがあり、メイン と サブ の 2 つのタブに分かれています。1 つずつ機能を選んで、自分好みに細かく調整できます。各機能の詳しい説明は 機能一覧 をご覧ください。
- メインタブ — 文字サイズの変更、ライトモード、ダークモード、色の反転、モノクロ、低彩度、高彩度
- サブタブ — 文字の間隔（縦）、文字の間隔（横）、画像の非表示、リンクに下線、カーソルの拡大、部分読み上げ、フォントの変更、ページ構造の表示、動画の停止
ボタンサイズ・言語の切り替えとリセット
パネルの上部には、フローティングボタンの大きさを変えられる「アクセシビリティボタンのサイズ」ピッカー（大 / 標準 / 小 の 3 段階）と、表示を切り替える言語スイッチャー（日本語 / ベトナム語 / 英語）があります。パネル最下部のリセットボタンを押すと、それまでに変更した設定がすべて元に戻ります。