Webアクセシビリティは公開後に崩れる 更新担当者が守る6つの実務ルール

更新作業にアクセシビリティ確認を組み込む流れを、文書やキーボードなどで表したイメージ

Webアクセシビリティとは、障害の有無や利用環境にかかわらず、必要な情報と機能を受け取り、操作できるようにすることです。

サイト公開時に基準を満たしていても、記事、画像、PDF、動画を追加するたびに新しい障壁は生まれます。

デジタル庁が2026年6月1日に公開した「DS-672.1 ウェブアクセシビリティ広報向けガイドブック」も、サイト構築後に作成、追加されるコンテンツへ焦点を当てています。

制作会社だけに任せる課題ではなく、CMSで情報を更新する広報、編集、採用、営業の担当者まで共通ルールを持つ必要があります。

公開後の更新で生まれる四つの壁

WCAG 2.2は、Webコンテンツを知覚可能、操作可能、理解可能、堅牢にするための検証可能な達成基準を示しています。

この四原則を更新作業に置き換えると、失敗しやすい箇所が見えます。

更新作業 生まれやすい障壁 予防の要点
記事の入稿 太字や文字サイズだけで階層を表す 見出し要素で構造を示す
バナーの追加 日時や条件が画像の中にしかない 同じ情報をHTML本文にも置く
資料の掲載 画像化されたPDFだけを公開する HTMLの要約と適切な文書構造を用意する
動画の公開 音声または映像だけに意味を依存する 字幕、書き起こし、必要な音声解説を用意する

テンプレートが正しくても、入力するコンテンツが意味を伝えられなければ、ページ全体の利用しやすさは保てません。

更新担当者が守る6つの実務ルール

1.見出しは文章の階層として付ける

見出しは文字を大きくする装飾ではなく、ページ内の話題を区切る標識です。

記事タイトルの下ではH2から始め、H2の内容を細分するときだけH3を使います。

見出しだけを順番に読んでも、記事の構成が把握できる言葉を選びます。

2.リンク文だけで行き先を判断できるようにする

「こちら」「詳しく見る」だけでは、リンクを一覧で読む利用者が移動先を判断できません。

「申込フォーム」「調査結果のPDF」のように、リンク先の内容や行動をアンカーテキストへ含めます。

新しいタブで開く、PDFを取得するなど、通常と異なる挙動もリンクの近くで伝えます。

3.代替テキストは画像の役割から決める

情報を持つ画像には、その文脈で画像が伝える内容または機能を代替テキストとして付けます。

同じ写真でも、会社紹介なら写っている場所が意味を持ち、装飾なら読み上げの対象から外す判断が適切です。

デジタル庁の広報向けガイドブックは代替テキストを80字程度までの目安とし、複雑な図表は本文で十分に説明する方法も示しています。

判断例は画像と代替テキストのアクセシビリティガイドでも確認できます。

4.画像内の文字を唯一の情報源にしない

キャンペーン名、開催日時、料金、問い合わせ先をバナーだけに入れると、画像を見られない利用者へ情報が届きません。

拡大、コピー、翻訳もしにくくなるため、判断に必要な文字情報はHTML本文にも記載します。

画像は注意を引く役割に絞り、申込条件や変更点は検索できる文章として残します。

5.PDFを掲載するときはHTMLで入口を作る

デジタル庁の同ガイドは、見出しや箇条書きが正しく記されたHTMLページを優先し、PDFやスライドを掲載する前にHTMLで公開できないか確認するよう勧めています。

PDFが必要なら、ページ上に文書名、概要、発行日、ファイル形式、容量、問い合わせ先を示し、主要な結論もHTMLで読めるようにします。

文書側にはタグ、見出し、読み上げ順、画像の代替テキストを設定します。

具体的な確認項目はPDFアクセシビリティの公開運用ガイドに整理しています。

6.動画は音と映像の代替手段を企画時に決める

収録後に字幕や書き起こしを追加すると、固有名詞の確認や編集の工数が膨らみます。

企画時に字幕、全文の書き起こし、映像だけで示す情報の説明方法を決め、制作費と納期へ含めます。

自動字幕を使う場合も、名称、数字、否定表現を人が確認します。

誤認識した一語が日時や申込条件の意味を変える可能性があるためです。

自動検査で終わらせない三段階の確認

W3CのWebアクセシビリティ入門は、単独の検査ツールだけではガイドライン適合を判断できず、知識を持つ人の評価が必要だと説明しています。

自動検査は欠落を探す入口として使い、意味と操作は人が確かめます。

  1. 自動検査:代替テキストの未設定、フォームラベルの不足、見出し階層、コントラストなど、規則で検出しやすい項目を調べます。
  2. 手動操作:マウスを使わず、Tabキー、Enterキー、Spaceキーで主要な導線を完了できるか確認します。
  3. 内容確認:見出し、リンク文、代替テキスト、字幕が文脈に合い、誤解なく行動できるか読み直します。

画面読み上げも主要ページで試すと、視覚上は気づきにくい読み順、ボタン名、更新通知の問題を見つけやすくなります。

発注から運用までの確認範囲は、既存記事のWebアクセシビリティを実務へ組み込むチェックポイントも参考になります。

10分で行う公開前チェック

毎回すべての達成基準を試験するのは現実的ではありません。

日常更新では、次の短いチェックで明らかな障壁を公開前に減らします。

  • ページタイトルが内容を具体的に示している
  • 見出しの順序がH2、H3の階層になっている
  • リンク文だけを読んでも移動先が分かる
  • 意味のある画像に文脈に合う代替テキストがある
  • 装飾画像を読み上げ対象から外している
  • 画像内の重要な文字をHTML本文にも記載している
  • PDFやスライドの要点をページ上で読める
  • 動画の字幕と書き起こしを確認している
  • キーボードだけでリンクと埋め込み機能を操作できる
  • 200%拡大と狭い画面でも内容が欠けない

確認で見つけた問題は、そのページだけで直すか、テンプレートや入稿ルールへ戻すかを分けます。

同じ問題が二度出たら、担当者の注意力ではなく、仕組みで防ぐ対象です。

品質を維持する役割分担

担当者全員が詳しい実装知識を持つ必要はありません。

判断する範囲と相談先を決めると、更新速度を落とさずに品質を保てます。

役割 担当する確認 引き継ぐ条件
執筆者 見出し、リンク文、画像の役割、平易な表現 複雑な図表、動画、フォームがある
編集者 チェックリスト、情報の欠落、代替手段の品質 基準への適合判断や修正方法が不明
制作者 テンプレート、キーボード操作、フォーム、支援技術との互換性 利用者への影響や優先順位を決める必要がある

月に一度、指摘件数だけでなく、同じ不備が再発した場所を振り返ります。

画像登録画面の説明文、記事テンプレート、発注書の納品条件へ修正を反映すれば、次の更新から予防できます。

最初の1週間で着手する順序

  1. 問い合わせ、予約、購入、採用など、利用者の行動に直結する3ページを選びます。
  2. 見出し、リンク、画像、PDF、動画、フォームの有無を一覧にします。
  3. 自動検査とキーボード操作で、利用を妨げる問題を先に直します。
  4. 更新担当者向けの公開前チェックを10項目以内で作ります。
  5. 1か月後の再確認日と、技術的な相談先を決めます。

一度の大規模改修より、更新のたびに障壁を増やさない仕組みが効きます。

対象ページを絞り、再発する問題からテンプレートへ戻して直すと、限られた体制でも改善を続けられます。

よくある質問

すべての画像に詳しい代替テキストが必要ですか

必要ありません。

情報や機能を持つ画像には適切な代替テキストが必要ですが、周囲の文章と意味が重複する装飾画像は読み上げ対象から外します。

画像の役割を先に決めると、過剰な説明を避けられます。

自動検査でエラーがゼロなら公開できますか

エラーがゼロでも、リンク文の分かりやすさ、画像説明の妥当性、キーボード操作の自然さまでは保証されません。

自動検査に手動操作と内容確認を組み合わせます。

予算が限られる場合はどこから直しますか

利用者が目的を完了する主要導線から始めます。

問い合わせや申込が完了できない問題を優先し、次に共通テンプレートを直すと、修正効果が複数ページへ広がります。

参考資料

この記事に関連する株式会社greedenの取り組み

公開後の更新で生じる障壁は、診断と運用ルールの両方で減らせます。株式会社greedenは、Webアクセシビリティの現状診断から改善提案、実装、社内チェックリスト整備まで支援しています。

投稿者 greeden Inc.

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)