調整中

第4章 Lesson 4-5 / 読了 約11分

アクセシビリティの最低限 — 「すべての人が使える」を、担当者は alt から始める

この記事でわかること

  • アクセシビリティが「障がい者のため」ではなく「すべての人が使える」設計だということ
  • 担当者がまず押さえるべき最小ライン(alt 属性)はどこか
  • 2024 改正(障害者差別解消法)と WCAG 2.2 — 法的要請の現在地
  • 現実的な 3 段階ライン(基本セット / ツール活用 / 規定準拠)とは何か
  • ターゲットに応じてどの段階を選べばよいか

アクセシビリティの話になると、「うちはそこまで対応するつもりはない」という反応が多いです。 でも、本書は別の切り口で扱います。 アクセシビリティは 「すべての人が使える」設計 であって、特殊な対応ではない、というスタンスです。 そして担当者の責任範囲を最小ラインから 3 段階で整理します。

1. アクセシビリティ = 「すべての人が使える」設計

1-1. 「障がい者向け」ではなく「すべての人」のため

アクセシビリティの誤解の一つは、「障がいのある人のための対応」と思われていることです。 本書は別の捉え方をします。 すべての人が使える設計 を実現する取り組み、それがアクセシビリティです。

1-2. 含まれる人の例

すべての人と言ったときに、具体的に誰が含まれるかを並べます。

  • 高齢者(老眼で小さい文字が読みにくい)
  • メガネ使用者
  • 色覚多様性(特定の色の組み合わせが見分けにくい)
  • 一時的障がい(腕骨折で片手しか使えない)
  • 騒音環境(電車内、工事現場)
  • 明るい屋外(画面が見にくい)
  • 片手作業中(片手で電話、片手でスマホ)
  • デバイス制約あり(古いスマホ、通信が遅い)

こうやって並べると、健常者・障がい者の二項対立ではなく、誰もが何らかの状況で「使いにくい」を経験する ことが見えます。

1-3. Lesson 4-4「利用シーン」と完全連動

Lesson 4-4 で扱った「利用シーン」と、ここでの「すべての人」は実は同じ話です。 シーン × 状態の組み合わせで「使えない人」が増えるという構造です。

1-4. 結果的に SEO・離脱防止・ブランド信頼に効く

アクセシビリティ対応は、結果的に SEO、離脱防止、ブランド信頼にも効きます。 Google は alt や見出し構造を読んでいますし、使いやすいサイトは離脱が減りますし、誰もが使えるという姿勢は信頼を作ります。 「正しいことをするとビジネスにも良い」というのが、アクセシビリティの良いところです。

2. 担当者の責任範囲 — 「alt だけ」から始める

2-1. 担当者レベルなら、まず alt 属性だけでよい

担当者がアクセシビリティの全領域を完璧にやるのは不可能です。 だから本書は、担当者の最小ラインは alt 属性だけ と割り切ります。 それ以上は専門領域として業者・専門家に任せます。

2-2. alt の付け方

alt は画像の「代替テキスト」で、HTML の img タグに「alt="..."」の形で書きます。 現場で使うときの基本ルールを並べます。

  • 内容を伝える画像 → 内容を簡潔に(例:「赤いリンゴが 3 つ並ぶ写真」)
  • 装飾画像 → 空 alt(「alt=""」)
  • リンク画像 → リンク先を伝える(例:「お問い合わせフォームへ」)
  • グラフ・図解 → データの要約(例:「2025 年売上推移グラフ、前年比 20% 増」)

2-3. alt は SEO にも効く

Google は alt から画像の内容を理解します。 アクセシビリティ的に正しい alt は、そのまま SEO 的にも価値を持ちます。 「やる動機が複数ある」のが、alt の魅力です。

2-4. 担当者が一番やるべきは、CMS 更新時に毎回 alt を書く習慣化

Lesson 4-3「CMS 更新時の統一感」と連動します。 CMS で画像を追加するときに alt を必ず書く、というのを習慣にしておくと安心です。 これが、担当者が日常的にできる最大のアクセシビリティ貢献です。

2-5. alt は「担当者の入り口」、アクセシビリティ全体ではない

主軸は「担当者が CMS 更新で必ず書く最小限 = alt」です。 でも、alt はあくまで「担当者の入り口」。 アクセシビリティ全体ではありません。 「alt だけやれば OK」と読み替えると、アクセシビリティを画像説明の問題として狭く捉えるリスクがあります。

アクセシビリティの全体像は、もっと広いです。 担当者が「全部やる」必要はありませんが、視野として持っておくと役に立ちます。

  • 画像説明(alt、担当者の入り口、CMS 更新時の習慣化) ← ここが担当者の最小ライン
  • 構造的マークアップ(見出し階層・リスト・テーブル等)
  • キーボード操作(マウス無しで使えるか、フォーカス順序)
  • 色とコントラスト(色覚多様性、コントラスト比)
  • 動的要素のアクセシビリティ(モーダル・アコーディオン・スライダー等、ARIA 属性)
  • 動画・音声の代替手段(字幕・トランスクリプト)
  • フォームのアクセシビリティ(label、エラーメッセージ、フォーカス管理)
  • 読み上げ対応(スクリーンリーダーの動作確認)

これらの実装は 業者・デザイナーの専門領域 です(Lesson 1-1 H2-4-4 の判断レイヤー 2〜3)。 担当者の役割分担はこうなります。

  • alt は自分で書く(レイヤー 1、毎回の CMS 更新の習慣)
  • その他は業者に依頼(レイヤー 2、契約段階で対応水準を合意 — Lesson 3-5 H2-5-9)
  • 専門レベル(WCAG 2.2 AA 準拠など)は専門業者・コンサル(レイヤー 3、H2-7 参照)

「alt だけやれば OK」ではなく、「alt は担当者の入り口、全体は業者・専門家との連携で実現する」 が本書のスタンスです。

3. 法的要請の現在地 — 2024 年改正と WCAG 2.2

3-1. 障害者差別解消法 2024-04-01 改正で「事業者にも義務化」

これまで事業者は「努力義務」だった 合理的配慮の提供 が、2024-04-01 から 法的義務 に変わりました。 「アクセシビリティ対応は努力次第」だった時代は終わっています。 自社の対応水準を企画段階で決める前提に立っておきたいところです。

個別の対応は「過重な負担にならない範囲」ですが、Web サイトは事前に設計できるので「対応していない」が許容されにくい領域です。 公式情報は内閣府(障害者政策担当)の情報を参照すると確実です。

3-2. WCAG は 2.2 が現行最新

WCAG 2.2 が W3C Recommendation(2023-10-05 公開)として最新版です。 2.0 → 2.1(2018)→ 2.2(2023)と段階的に進化してきました。 2.1 を引き続き使う案件もありますが、新規案件は 2.2 を前提に進めるのが妥当です。 2.2 で新規追加された達成基準(フォーカス表示の最小限、ドラッグ操作の代替、認証時の認知負荷軽減など)を業者と確認しておくと安心です。

JIS X 8341-3 は WCAG と整合しています(国内規格、調達基準で使われる)。

3-3. 業種・公共性・規模で「必要水準」が変わる

  • 高水準(WCAG 2.2 AA 準拠)が必須に近い:公的機関、教育機関、医療、金融、上場企業、公共インフラ、自治体関連
  • 中水準(WCAG 2.2 A + alt + コントラスト + キーボード)が現実解:一般 BtoB・BtoC コーポレート、サービスサイト、EC
  • 基本水準(alt + コントラスト + 見出し順)で始められる:小規模サイト、検証用 LP、社内向け

対象ユーザーに高齢者・障害のある人が含まれる比率が高いほど、水準を上げます。 Lesson 2-1 H2-7-4 で決めた水準を、Lesson 3-5 H2-5-9 で業者と合意し、ここ Lesson 4-5 で実装ルールに落とす流れです。

3-4. 「過重な負担」の判断は担当者単独でしない

合理的配慮の提供義務は「事業者に過重な負担を強いない範囲」と定められています。 ただし「うちは中小だから対応しない」を担当者単独で決めてしまうのは避けたいところです。 経営層・社内法務・顧問専門家と擦り合わせ、対応範囲と例外を文書化しておくと安心です。 法務不在の組織は、行政書士・弁護士の単発相談でも十分です。

4. ここが現実的 — 3 段階ライン

4-1. 段階 1:基本セット(小規模・検証用サイトはここから)

alt + 色コントラスト + 見出し順序の 3 点セット。 まずはここから始められます。

4-2. 段階 2:ツール活用 + WCAG 2.2 A 達成(一般 BtoB / BtoC の現実解)

liking.jp 等のアクセシビリティチェックツール、Lighthouse(Google 提供無料)、業者にレポート提出依頼、WCAG 2.2 Level A 達成を目指す段階です。

4-3. 段階 3:規定準拠 + 専門業者(公共性・規制業種は必須)

WCAG 2.2 AA 準拠 / JIS X 8341-3 / 専門業者によるコンサルを使う段階です。

4-4. どの段階を目指すかの判断軸

Lesson 2-1 H2-7-4 で固めた前提と H2-3 の法的要請を組み合わせて判定します。

  • 公的機関・上場企業・規制業種(医療・金融・教育) → 段階 3
  • 高齢者・障害のある人がターゲット → 段階 2 以上
  • 一般 BtoB / BtoC → 段階 2(段階 1 から始めて 2 へ進む現実的な歩み)
  • 小規模サイト・検証用 → 段階 1(将来 2 へ移行する想定で始める)

5. 段階 1:基本セット — alt / 色コントラスト / 見出し順

  • alt 属性:担当者が CMS で画像追加時に必ず書く
  • 色コントラスト:文字と背景のコントラスト比 4.5 : 1 以上(WCAG 2.2 AA)、ツールで確認可能
  • 見出し順序:h1 → h2 → h3 の順で飛ばさない(装飾目的で h タグを使わない)
  • これだけで「使えるサイト」のラインを超えます

6. 段階 2:ツール活用 — liking.jp 等で自動チェック

自動スキャンで不適合箇所を発見します。 代表的なツールは次のとおりです。

  • liking.jp(国内、Lab-ry Works も推奨)
  • Lighthouse(Google Chrome に標準搭載、無料)
  • WAVE(海外、ブラウザ拡張)
  • axe(開発者向け、業者と共有しやすい)

業者にレポート提出を依頼しておくと安心です(公開前 + 半年ごと、Lesson 3-5 H2-5-9 で契約に明記)。 ツールで分かるのは技術的指摘で、内容の妥当性は人が判断します。

7. 段階 3:規定準拠 — WCAG 2.2 / JIS X 8341-3

  • WCAG 2.2:W3C Recommendation(2023-10-05)、国際標準の現行最新版
  • A / AA / AAA の 3 段階:通常は AA を目指す、公共性が高いほど AA 必須
  • JIS X 8341-3:日本の規格、WCAG と整合(国の調達基準で使用)
  • 公的機関・上場企業・規制業種は AA 準拠が期待される
  • AAA は限定的、全項目達成は困難、一部達成が現実的
  • 第三者監査の活用:専門業者のコンサル、改修ロードマップの伴走

8. ターゲット別の判断

  • BtoC コーポレート(若い世代中心) → 段階 2 推奨(段階 1 から開始可)
  • BtoB(企業相手) → 段階 2
  • 高齢者向けサービス → 段階 2〜3
  • 公的機関 → 段階 3(必須)
  • 規制業種(医療・金融・教育) → 段階 3(2024 改正への対応を経営層と合意)
  • 障害のある人がターゲット → 段階 3 + 専門業者監査

9. 担当者の運用ルール

  • CMS で画像追加時に alt を必ず書く
  • 色を CMS で勝手に変えない(Lesson 4-3 連動)
  • 見出しは段組みで使う、装飾目的で使わない
  • 半年ごとに Lighthouse でスキャンするだけでも価値あり
  • 法改正・規格更新のキャッチアップは Lesson 9-6「業者のトレンド共有会」と連動
  • 不明な点はディレクターに聞く、判断に迷ったら経営層・法務へ上申

アクセシビリティは「完璧にやらなければ」と身構えると重く感じますが、担当者の最初の一歩は alt を丁寧に書くこと、ただそれだけです。 その小さな習慣が、結果的にすべての人にとって使いやすいサイトへとつながっていきます。 全体像は業者・専門家と分担しながら、まずは自分の手の届く範囲から、無理なく始めていきましょう。