ATAG（Authoring Tool Accessibility Guidelines）は、Webコンテンツを作るためのツールを、よりアクセシブルにするための指針です。対象になるのは、CMS、HTMLエディタ、ノーコードのサイト作成ツール、学習管理システム、ブログやSNSの投稿画面など、制作者がWeb上の情報を作成・編集・公開するために使うツールです。
ポイントは二つあります。ひとつは、ツールそのものを障害のある制作者にも使いやすくすることです。もうひとつは、ツールを使う人が、アクセシブルなWebコンテンツを作りやすくなるよう支援することです。つまりATAGは、完成したページだけでなく、そのページを生み出す制作環境にも目を向けるためのガイドラインです。
ATAGが重要な理由
Webアクセシビリティは、公開後のページを検査して直すだけでは十分とはいえません。編集画面の時点で見出し、代替テキスト、リンク文言、フォーム、動画の代替手段などを正しく扱えるようになっていれば、後工程での修正負担を減らしやすくなります。
たとえば、画像を挿入するときに代替テキストの入力欄が見つけにくいツールでは、制作者が入力を忘れやすくなります。反対に、入力欄が分かりやすく、説明文も適切で、空欄のまま公開しようとしたときに気づける設計であれば、アクセシブルなコンテンツを作る流れを自然に組み込めます。
オーサリングツールとは何か
オーサリングツールとは、Webコンテンツを作成・編集・管理するためのソフトウェアやサービスのことです。専門的なコードエディタだけでなく、WordPressのようなCMS、WYSIWYGエディタ、文書をHTMLやEPUBに変換するツール、動画や教材を作るツール、ユーザーが投稿するブログやフォーラムの編集画面も含まれます。
この考え方を踏まえると、オーサリングツールの役割は、単に文章や画像を保存することではありません。制作者が迷わず、誤りに気づき、必要なアクセシビリティ情報を残せるようにすることも、重要な役割です。
ATAG 2.0の基本構造
ATAG 2.0は、W3C Recommendationとして公開されている技術標準です。大きく分けると、Part AとPart Bの二つで構成されています。
| 区分 | 主な対象 | 実務で見るポイント |
|---|---|---|
| Part A | オーサリングツールのユーザーインターフェース | キーボード操作、スクリーンリーダー対応、分かりやすいエラー表示、編集画面の構造など |
| Part B | アクセシブルなコンテンツ制作の支援 | 代替テキスト入力、アクセシブルなテンプレート、チェック機能、修正ガイド、アクセシビリティ情報の保持など |
Part A：ツールそのものをアクセシブルにする
Part Aは、制作者が使う編集画面や管理画面をアクセシブルにするための指針です。たとえば、マウスを使わなくても主要な機能に到達できるか、フォーカス位置が分かるか、スクリーンリーダーでボタンや入力欄の意味が伝わるか、といった点が関係します。
ここで重要なのは、アクセシビリティ対応を完成ページだけの問題として扱わないことです。編集画面が使いにくければ、障害のある制作者が制作に参加しにくくなります。ATAGは、制作する人のアクセシビリティも含めて考えるための枠組みです。
Part B：アクセシブルなコンテンツ制作を支援する
Part Bは、ツールが制作者を支援し、アクセシブルなコンテンツを作りやすくするための指針です。画像に代替テキストを付ける、見出し構造を正しく使う、リンク文言を具体的にする、動画に字幕や代替手段を用意する、といった作業を、ツール側が分かりやすく促せるかが問われます。
たとえば、アクセシブルなテンプレートを最初から用意する、問題のある入力を警告する、修正方法を短く説明する、といった支援が考えられます。制作者に専門知識をすべて求めるのではなく、ツールが正しい判断を助ける設計にすることが大切です。
WCAGとの関係
ATAGは、Webコンテンツそのものの基準であるWCAGと密接に関係します。WCAGが完成したWebページやアプリケーションのアクセシビリティを扱うのに対し、ATAGはそのコンテンツを作るツールと制作プロセスに焦点を当てます。
実務では、ATAGだけを単独で読むよりも、WCAG 2.2の基本と合わせて確認すると理解しやすくなります。ATAG 2.0はWCAG 2.0を参照していますが、現在のプロジェクトでは、対象サイトや組織の要件に合わせて、より新しいWCAG 2の考え方も併せて確認するのが現実的です。
実装時に確認したいこと
ATAGを実務に取り入れるときは、標準文書を最初から細部まで読むより、制作フローに沿って確認するほうが進めやすくなります。まずは次の観点で、現在使っているツールや運用を見直します。
- 編集画面をキーボードだけで操作できるか：投稿作成、保存、公開、メディア挿入、設定変更まで、主要な操作に到達できるかを確認します。
- 支援技術で意味が伝わるか：ボタン、入力欄、エラー、状態変化がスクリーンリーダーなどで理解できるかを確認します。
- アクセシビリティ情報を入力しやすいか：画像の代替テキスト、動画の字幕、見出し、リンク文言などを自然に整えられる設計かを見ます。
- アクセシブルな初期状態を用意できるか：テンプレート、部品、テーマ、ブロックが最初から使いやすい構造になっているかを確認します。
- 問題を検知し、修正につなげられるか：チェック機能だけで終わらず、何をどう直せばよいかを制作者に示せるかが重要です。
導入を進める手順
- 制作フローを棚卸しする：誰が、どのツールで、どの種類のコンテンツを作っているかを整理します。
- Part Aの観点で編集画面を確認する：キーボード操作、フォーカス、読み上げ、エラー表示、ヘルプ文言を確認します。
- Part Bの観点で出力と支援機能を確認する：生成されるHTML、テンプレート、代替テキスト入力、チェック機能を見直します。
- 制作者向けのルールを短く整える：見出し、画像、リンク、表、動画など、日常的に迷う項目からガイド化します。
- 定期的に検証する：ツールのアップデートや運用変更でアクセシビリティが変わるため、一度の確認で終わらせないようにします。
まとめ
ATAGは、アクセシブルなWebコンテンツを増やすために、制作ツールと制作プロセスを改善する指針です。完成ページの検査だけでなく、編集画面、テンプレート、入力支援、チェック機能、修正ガイドまで含めて考えることで、アクセシビリティ対応を日常の制作に組み込みやすくなります。
すでにCMSや投稿ツールを使っている場合でも、ATAGの観点で見直すと、制作者が迷いやすい箇所や、アクセシビリティ情報が抜け落ちやすい箇所を見つけやすくなります。小さな改善を積み重ねることが、より多くの人に届くWebづくりにつながります。
当社では、Webアクセシビリティの導入を支援するUUU ウェブアクセシビリティウィジェットツールを提供しています。アクセシビリティ向上に関心がある方は、詳細をご覧ください。
購読してアクセス
会員向けの補足コンテンツを読むには、購読またはログインしてください。