EVN アクセシビリティ

管理ダッシュボードの使い方

EVN accessibility では、1 つの会社で複数のサイトのウィジェットを管理ダッシュボードからまとめて設定できます。各サイトのウィジェットはリモートで構成され、サイトのコードを書き換える必要はありません。

このページでは、ダッシュボードへのサインインから、各サイトのウィジェットの設定方法までを説明します。

サインインする

ブラウザで /login を開き、アカウントのメールアドレスとパスワードでサインインします。ダッシュボードはセルフホスト型で、すべて同一のオリジンで動作します。

サインインすると、最初にサイト一覧が表示されます。

サイト一覧

サイト一覧には、あなたの会社が管理しているサイトが並びます。各サイトには固有のサイト ID(例: st_xxxxxxxx)が割り当てられており、これがインストール用スニペットに埋め込まれます。

<script src="https://cdn.evn-a11y.com/a11y@2/a11y.js" data-site-id="st_xxxxxxxx" defer></script>

設定したいサイトをクリックすると、そのサイトの設定画面が開きます。

メモ: 無料プランで管理できるサイトは 1 つです。スニペットの設置方法は はじめに を参照してください。

サイトを設定する

サイトを開くと、ウィジェットの表示内容と見た目を細かく調整できます。設定できる項目は次の 4 つです。

1. パネルに表示する機能

ウィジェットのパネルには「カスタマイズ」エリアがあり、メイン タブと サブ タブの 2 つに分かれています。メインタブには「文字サイズの変更」と 6 つの色モード、サブタブにはそれ以外の 9 つの機能が並びます。管理者は、機能ごとに表示・非表示をダッシュボードから設定できます。タブ内の機能をすべて非表示にすると、そのタブ自体が自動的に隠れます。

機能の全 16 種類の内容については 機能一覧 を参照してください。サイトの利用者に合わせて、必要な機能だけを表示すると分かりやすくなります。

2. プリセットの有効化

ワンタップで設定一式をまとめて適用できる 7 種類のプリセット(パネルの「ワンタップ設定」セクション)を、サイトごとに有効・無効にできます。

プリセット 主な対象
老眼 文字を大きく見やすく
認知と学習 気が散る要素を減らす
弱視 視力の弱い方向け
色弱 色の見分けが難しい方向け
光覚 まぶしさ・色の刺激を抑える
てんかん 動きのある要素を止める
失読症 読みやすいフォントに切り替え

各プリセットの詳しい組み合わせは プリセット を参照してください。

3. ウィジェットの位置(左/右・上/下)

ウィジェットを開く丸いトリガーボタンの表示位置を、横方向と縦方向の 2 つの軸で指定できます。

  • 横の位置(左/右): トリガーボタンを画面の または から選べます。
  • 縦の位置(上/下): トリガーボタンを画面の または から選べます(既定は )。スライドして開くパネルは画面の高さいっぱいのサイドドロワーのため、この縦の位置はおもにトリガーボタンが上端・下端のどちらに付くかを切り替えます。

サイトのデザインやほかの固定ボタンと重ならない位置を選んでください。

4. テーマ(ライト/ダーク)

ウィジェットのパネル自体の見た目を ライト または ダーク から選べます。これはパネルの配色であり、サイト本体の表示は変わりません。

変更の反映タイミング

ダッシュボードで保存した変更は、利用者が次にページを読み込んだときにライブのウィジェットへ反映されます。すでに開いているページは、再読み込みすると新しい設定になります。

なお、利用者がウィジェットで選んだ設定はその人のブラウザ(localStorage)に保存されます。ダッシュボード側の設定変更は表示する機能やプリセットの選択肢を変えるもので、利用者個々の保存内容を消すものではありません。

管理ダッシュボードの使い方 — EVN accessibility