アクセシビリティ対応の現実的な進め方 — 「すべての人が使える」へ、まずは alt から
この記事でわかること
アクセシビリティの話になると、「うちはそこまで対応するつもりはない」という反応が多いです。 でも、ここでは別の切り口で扱います。 アクセシビリティは 「すべての人が使える」設計 であって、特殊な対応ではない、というスタンスです。 そして担当者の責任範囲を、最小ラインから 3 段階で整理します。
1. アクセシビリティ = 「すべての人が使える」設計
「障がい者向け」ではなく「すべての人」のため
アクセシビリティの誤解の一つは、「障がいのある人のための対応」と思われていることです。 ここでは、もっと実務寄りに考えます。すべての人が使える設計 を実現する取り組み、それがアクセシビリティです。
含まれる人の例
「すべての人」と言ったときに、具体的に誰が含まれるかを並べます。
- 高齢者(老眼で小さい文字が読みにくい)
- メガネ使用者
- 色覚多様性(特定の色の組み合わせが見分けにくい)
- 一時的な不自由(腕の骨折で片手しか使えない)
- 騒音環境(電車内、工事現場)
- 明るい屋外(画面が見にくい)
- 片手作業中(片手で電話、片手でスマホ)
- デバイス制約あり(古いスマホ、通信が遅い)
こうやって並べると、健常者・障がい者の二項対立ではなく、誰もが何らかの状況で「使いにくい」を経験する ことが見えます。
「利用シーン」の話と、根っこは同じ
第4章 Lesson 4 で扱った「利用シーン」と、ここでの「すべての人」は、実は同じ話です。 シーンと状態の組み合わせ次第で、誰でも「使えない人」になり得る — その範囲を広げて捉えたものがアクセシビリティです。
結果的に SEO・離脱防止・ブランド信頼に効く
アクセシビリティ対応は、結果的に SEO、離脱防止、ブランド信頼にも効きます。 Google は alt や見出し構造を読んでいますし、使いやすいサイトは離脱が減り、誰もが使えるという姿勢は信頼を作ります。 「正しいことをするとビジネスにも良い」というのが、アクセシビリティの良いところです。
2. 担当者の入り口は「alt」、全体は業者と分担
今日から担当者がやるのは alt、全体は制作会社と分担
担当者がアクセシビリティの全領域を完璧にやるのは不可能です。だから役割を分けます。 今日から担当者が自分でやるのは alt 属性。サイト全体の対応は、制作会社・専門家と分担する — これが本書のスタンスです。 「alt だけやれば OK」という意味ではありません。alt は担当者の入り口で、全体は業者との連携で実現します。
alt の付け方
alt は画像の「代替テキスト」で、HTML の img タグに「alt="..."」の形で書きます。基本ルールはこうです。
- 内容を伝える画像 → 内容を簡潔に(例:「赤いリンゴが 3 つ並ぶ写真」)
- 装飾画像 → 空 alt(「alt=""」)
- リンク画像 → リンク先を伝える(例:「お問い合わせフォームへ」)
- グラフ・図解 → データの要約(例:「2025 年売上推移グラフ、前年比 20% 増」)
NG は「画像1」「写真」「(ファイル名)」のような、中身の伝わらない alt です。文字が入ったバナー画像は、その文字内容を alt に書きます。
勝負どころは「CMS 更新のたびに書く」習慣
第4章 Lesson 3 で「CMS 更新のときこそ統一感が崩れる」とお伝えしましたが、alt も同じで、勝負どころは日々の更新です。 CMS で画像を追加するたびに alt を書く — この習慣が、担当者が日常的にできる最大の貢献です。 alt は Google が画像内容を理解する手がかりにもなるので、アクセシビリティにも SEO にも効きます。更新時の習慣にしやすい項目です。
アクセシビリティ全体像 — 視野として持っておく
アクセシビリティの全体像は、alt よりずっと広いです。担当者が全部やる必要はありませんが、業者と話すときの視野として持っておくと役立ちます(実装はいずれも業者・デザイナーの専門領域)。
- 画像説明(alt) ← 担当者の入り口
- 構造的マークアップ(見出し階層・リスト・テーブル)
- キーボード操作(マウス無しで使えるか)
- 色とコントラスト(色の見分けやすさ)
- 動的要素(モーダル・スライダー等。ARIA=読み上げソフトにも正しく伝えるための HTML 上の補助情報 を使う)
- 動画・音声の代替(字幕・書き起こし)
- フォーム(label=項目名と入力欄を結ぶ設定、エラー表示)
- 読み上げ対応(スクリーンリーダー=画面を読み上げるソフト での動作確認)
3. 法的要請と、目安になる規格
2024 年 4 月改正で「事業者にも義務化」
これまで事業者には「努力義務」だった 合理的配慮の提供 が、2024 年 4 月 1 日から 法的義務 になりました。「対応は努力次第」だった時代は終わっています。 個別の対応は「過重な負担にならない範囲」ですが、Web サイトは事前に設計できるぶん「対応していない」が許容されにくい領域です。公式情報は内閣府(障害者政策担当)を参照すると確実です。
目安となる規格 — WCAG 2.2 と JIS X 8341-3
Web アクセシビリティの国際ガイドラインが WCAG です。現行の主要版は 2.2(2023 年 10 月公開、2024 年 12 月に更新)。適合レベルは A → AA → AAA の 3 段階で、厳しくなるほど対応項目が増えます。通常は AA を目標にし、公共性が高いほど AA が必須に近づきます(AAA は全項目達成が難しく、一部達成が現実的)。
国内規格の JIS X 8341-3 は WCAG と整合しており、国の調達基準などで使われます。新規案件は 2.2 を前提に、目指す適合レベルを業者と確認しておきましょう。
「過重な負担」の線引きは、一人で決めない
「うちは中小だから対応しない」を担当者単独で決めるのは避けたいところです。経営層・社内法務・顧問専門家と擦り合わせ、対応範囲と例外を文書化しておきましょう。法務不在の組織は、行政書士・弁護士の単発相談でも十分です。
4. 現実的な進め方 — 3 段階の早見表
完璧を目指す必要はありません。対象サイト・利用者・法的リスク で目指す段階を決め、企画段階(第2章 Lesson 1)で方針、契約段階(第3章 Lesson 5)で業者と合意、この段階で実装、という流れで進めます。まず全体像を早見表で。
| 段階 | 主な対象サイト | 担当者がやること | 業者に頼むこと |
|---|---|---|---|
| 段階 1 基本セット | 小規模・検証用 LP・社内向け | alt を書く/色と見出しの基本を確認 | コントラスト・見出し構造の実装 |
| 段階 2 ツール活用(現実的な線) | 一般 BtoB / BtoC・EC | ツールでスキャン/レポートを受け取り確認 | WCAG 2.2 A 達成+不適合の修正、再チェックレポート提出 |
| 段階 3 規格準拠 | 公的機関・上場企業・規制業種(医療・金融・教育)・高齢/障害者向け | 方針を経営層・法務と合意/進捗を管理 | WCAG 2.2 AA / JIS 準拠、専門業者の監査・改修伴走 |
対象ユーザーに高齢者・障害のある人が多いほど、段階を上げます。一般サイトは 段階 1 から始めて 2 へ、という歩みが現実的です。
段階 1 の中身 — alt / 色コントラスト / 見出し順
alt(担当者が CMS で必ず書く)、色コントラスト(文字と背景の明暗差。目安は 4.5 : 1 以上で、ツールで測れる)、見出し順序(h1 → h2 → h3 と飛ばさない、装飾目的で見出しタグを使わない)。この 3 点で「使えるサイト」のラインを超えます。
段階 2 の中身 — チェックツールで自動確認
自動スキャンで不適合箇所を洗い出します。代表的なツールは、liking.jp(国内)、Lighthouse(Google Chrome 標準・無料)、WAVE(ブラウザ拡張)、axe(開発者向け)。 業者にはチェック結果のレポート提出を依頼します(公開前と半年ごと。第3章 Lesson 5 のとおり契約に書くと確実)。ツールで分かるのは技術的な指摘までで、内容の妥当性は人が判断します。
段階 3 の中身 — 規格準拠と専門監査
WCAG 2.2 AA / JIS X 8341-3 準拠を、専門業者の監査と改修ロードマップの伴走で進めます。公的機関・上場企業・規制業種で期待される水準で、2024 年改正への対応は経営層と合意しておきます。
5. 担当者の運用ルール
- CMS で画像を追加するときは、alt を必ず書く
- 色を CMS で勝手に変えない(第4章 Lesson 3)
- 見出しタグは文書の構造として使い、装飾目的では使わない
- 半年ごとに Lighthouse でスキャンするだけでも価値がある
- 法改正・規格更新の情報は、業者との定例で拾う(第9章 Lesson 6)
- 不明な点はディレクターに聞き、判断に迷ったら経営層・法務へ上申する
アクセシビリティは「完璧にやらなければ」と身構えると重く感じますが、担当者の最初の一歩は alt を丁寧に書くこと、ただそれだけです。 その小さな習慣が、結果的にすべての人にとって使いやすいサイトへとつながっていきます。 全体像は業者・専門家と分担しながら、まずは自分の手の届く範囲から、無理なく始めていきましょう。