日本企業のアクセシビリティ導入状況
ホームページを開設する企業のうち、JIS X 8341-3の適合レベルを満たす企業は4.6%。対応中・関連する取組を含めても27.3%です。
4.6%JIS適合レベルを
満たしている
満たしている
- JIS適合4.6%
- 適合へ対応中14.2%
- 関連する取組あり8.5%
- 認知・未対応18.5%
- 知らなかった51.2%
- 無回答3.0%
NANAiRO ACCESSIBILITY
ナナイロアクセシビリティとは？
Webサイトの表示を
誰もが見やすくなるように
サポートします。
WHY ACCESSIBILITY
ウェブの接点を創る
情報インフラとしてのウェブサイトやオンラインサービスを、障害の有無や年齢に関わらず、誰もが自由に利用できるようにしたいと思っています。より多くの企業や行政、サービスがウェブアクセシビリティへの理解を深め、取り組めるように貢献したいと思います。
- 01読みやすさを自分で選べる
文字サイズ、間隔、コントラスト、フォント、読み上げなどを、その人に合った状態へ調整できます。
- 02Web情報をより多くの人へ
見え方や利用環境の違いによる負担を減らし、必要な情報へたどり着きやすくします。
- 03アクセシビリティへの意識を広げる
ツールの導入をきっかけに、コンテンツやサイト設計そのものの改善にもつなげていきます。
日本のデータから、必要性を考える。
Accessibility Researchウェブアクセシビリティは、一部の人だけのための対応ではありません。国内の導入状況と、情報へアクセスするうえで配慮を必要とする人の規模を、公的資料から整理しました。
日本だけで、少なくとも415.9万人以上
令和4年時点の身体障害者手帳所持者は415.9万人。ウェブを見やすく、操作しやすく、読み上げても意味が伝わるようにすることは、多くの人が情報やサービスへ到達するための基盤になります。
415.9万人身体障害者手帳
所持者数
所持者数
障害のある人に加え、高齢者、色覚特性のある人、一時的・状況的に操作や閲覧が難しい人にも、ウェブアクセシビリティは役立ちます。
厚生労働省「令和4年生活のしづらさなどに関する調査」↗必要な配慮は、一つではない
身体障害者手帳所持者415.9万人の内訳。見え方、聞こえ方、操作方法など、利用時に必要な支援は人によって異なります。
対象となる人は、さらに広い
療育手帳・精神障害者保健福祉手帳の所持者を含めると610万人（重複を除く）。障害者の総数は推計1,164.6万人とされています。
610万人3種の手帳所持者
重複を除く
重複を除く
1,164.6万人障害者総数
推計値
推計値
数字だけで利用者をひとくくりにせず、文字・色・音声・キーボードなど複数の方法で情報へ届く設計が必要です。
デジタル庁「ウェブアクセシビリティ導入ガイドブック」↗企業データ：総務省「令和7年通信利用動向調査」（ホームページ開設企業2,354社、2025年調査）。利用者データ：デジタル庁「ウェブアクセシビリティ導入ガイドブック」（2025年10月版）および厚生労働省「令和4年生活のしづらさなどに関する調査」。手帳所持者数はウェブ利用者数そのものではなく、アクセシビリティの恩恵を受けうる人の規模を考えるための基礎データです。NANAiROの表示サポートは補助ツールであり、サイト自体の設計・実装・検証と組み合わせてご利用ください。
導入方法
DownloadWordPressプラグイン版、npm版、CDN／セルフホスト版から選べます。
npm版
React、Vue、Next.jsなどを使い、開発者がプログラムとして管理しているWebサイト向けです。サイトの部品として組み込めるため、更新や複数ページへの反映をまとめて管理できます。
簡単にいうと制作会社やエンジニアにサイトを作ってもらっている場合はこちらです。担当者へダウンロードファイルを渡してください。
npm版をダウンロードCDN埋め込み版
ダウンロードしたJavaScriptファイルをWebサーバーへ置き、HTMLへ短いコードを1つ貼り付ける方法です。新しい開発環境を用意する必要はありません。
簡単にいうとHTMLの共通部分を直接編集できる場合はこちらです。ZIPにはファイル、貼り付け例、日本語の手順書が入っています。
CDN版をダウンロードWordPress版
WordPressの管理画面からZIPをアップロードして有効化するだけで、全ページへ表示サポートを追加できます。HTMLやテーマファイルを直接編集する必要はありません。
簡単にいうとWordPressをご利用の場合はこちらです。設定画面から表示言語とボタンの左右位置を選べます。
WordPress.orgで確認インストール方法
InstallationWordPressなら専用プラグイン版を選べます。「ReactやVueを使っている」と言われたらnpm版、通常のHTMLを直接編集できる場合はCDN版です。
npm版
この作業は制作会社または開発担当者へ依頼できます
コードを表示コードを閉じる
npm install ./nanairo-accessibility-0.1.0.tgz
import { init } from '@nanairo/accessibility';
init({
locale: 'ja',
position: 'right'
});1. 担当者へ渡すダウンロードした.tgzファイルを、サイトを管理する制作会社や開発者へ渡します。
2. 組み込んでもらう担当者が上記のコマンドを実行し、サイトのプログラムへ追加します。
3. 全ページで確認右端に「表示サポート」が表示され、各機能が動くことを確認します。
CDN／セルフホスト版
HTMLの共通部分を編集できる方向け
コードを表示コードを閉じる
<script
src="/assets/nanairo-accessibility.iife.js"
data-nanairo-auto
data-locale="ja"
data-position="right"
defer
></script>1. ZIPを開く中にあるJavaScriptファイルを、画像などを置くサイトのフォルダへアップロードします。
2. コードを貼る全ページで共通するHTMLの</body>直前へ、上のコードをコピーして貼ります。
3. 表示を確認srcをアップロード先のURLへ合わせ、右端に「表示サポート」が出れば完了です。
WordPress版
管理画面だけで導入したい方向け
手順を表示手順を閉じる
管理画面 → プラグイン → 新規プラグインを追加
→ プラグインのアップロード → ZIPを選択1. ZIPを選ぶWordPress版のZIPを解凍せず、そのまま管理画面からアップロードします。
2. 有効化する「今すぐインストール」の後に「プラグインを有効化」を押します。
3. 表示を設定「設定 → NANAiRO Accessibility」で、日本語／英語とボタン位置を選びます。
コンテンツを邪魔しない、読みやすさのためのデザイン。
Our Approachシンプルなデザインで、見やすさを目指しました。
必要な機能だけ
文字サイズ、ダーク・ライトなどのカラーモード、読みやすいフォント、音声読み上げ、メディア停止、読書ガイド。利用者が自分で選べます。
既存の操作を尊重
ブラウザや支援技術の操作を奪わず、OSの「透明度を下げる」「動きを減らす」といった設定も自動的に尊重します。
データを外へ送らない
閲覧内容や個人情報を収集せず、表示設定はブラウザ内だけで管理。外部アカウントを作らず利用できます。
ナナイロの表示サポートを導入しませんか？
文字サイズやコントラストを変えて、実際の見え方と操作を確認できます。
