A11yWorkFlowの使い方と出力

アクセシビリティ試験の記録と報告書の作り方

A11yWorkFlowでは、人が確認した結果・確認方法・判断の理由をページごとに記録し、試験結果報告書や不適合一覧を作成できます。資料請求ボタンの確認例を使って、記録から報告、修正後の再確認までを説明します。

確認対象:1.1.1 / 更新日:

記録と報告に使う版を選ぶ

A11yWorkFlowは、ましじめ株式会社が開発した無料のウェブアクセシビリティ試験記録・報告書作成ツールです。試験全体の記録と報告書作成には、Web版かa-blog cms版を使います。

制作会社でCMSの異なるサイトを確認するときや、ブラウザーとファイルで作業を進めるときはWeb版を選べます。a-blog cmsのサイトで、記事の編集画面に確認結果を保存したい場合はCMS版が向いています。CMS本体やサーバーの費用は別途必要です。

Chrome拡張の「アクセシビリティ検査員」は、開いているページの指摘箇所を調べたり、見出し・画像・フォームを確認したりするときに使えます。入力した確認結果やメモはJSONで取り出し、Web版・CMS版で候補を確認して取り込めます。

対象ページ・目標・確認環境を決める

試験を始める前に、今回確認する範囲と目標を決め、対象ページを登録します。相談内容や下見の結果から作業範囲を整理したい場合は「調査」を使えます。対象が決まっていれば「試験」から始められます。

  • サイト名と、今回の試験で確認する範囲
  • 試験するページの名前とURL
  • 目標とする規格・適合レベル、確認方法、担当者と日程
  • 実際に使うOS・ブラウザーなどの確認環境とバージョン

目標レベルは試験前の設定です。確認を終えた後の結果とは分けて扱います。JIS X 8341-3:2016の達成基準に沿って記録・集計でき、WCAG 2.1・2.2で追加された達成基準はJISの試験結果と分けて出力できます。

どこで、どう確認し、何が起きたかを残す

たとえば、資料請求ボタンへTabキーで移動したとき、フォーカス位置が見えなかったとします。結果を「問題あり」と記録し、確認方法と判断の理由も入力します。

対象ページ
製品紹介トップページ
達成基準
2.4.7 フォーカスの可視化(AA)
結果
問題あり
確認方法
キーボード操作
判断の理由
資料請求ボタンにTabキーで移動すると、フォーカス位置が見えない。

「ボタンに問題あり」だけでは、別の担当者がどの操作で確認すればよいか分かりません。要素の名前、行った操作、起きたことを残すと、修正担当者が同じ状態を確認できます。判断に迷う項目は「未確定」にして、確認できていないことや迷っている理由を記録します。

目視やキーボード操作などによる確認と、達成基準を満たすかどうかの判断は人が行います。自動チェックの指摘も参考にできますが、指摘がないことだけで適合は判断できません。

この例は架空のデータです。未確認の項目を残した作業途中の記録で、実在サイトの試験結果やサイト全体の適合を示しません。

集計して報告書と不適合一覧を作る

入力した試験記録を集計し、対象ページや確認環境、達成基準ごとの結果を確認します。その結果から、Web版・CMS版では次の4つの文書を作成できます。

試験結果報告書(HTML)
試験の概要、結果の要約、対象ページ、達成基準別の結果や課題の詳細をまとめます。ブラウザーで開いて内容を読めます。
試験結果(Markdown)
試験の概要や確認環境、達成基準ごとの結果をまとめます。JISの主結果とWCAG 2.1・2.2の追加項目を分けて確認できます。
不適合一覧(Markdown)
課題番号、ページ名、記録した判断の理由、該当する達成基準を一覧にします。修正する項目を担当者へ伝える資料に使えます。
試験実施ページリスト(Markdown)
試験対象として記録したページ名とURLを一覧にします。今回どのページを対象にしたかを共有できます。

先ほどの例では「資料請求ボタンにTabキーで移動すると、フォーカス位置が見えない。」という理由が、ページ名・達成基準と一緒に不適合一覧へ出力されます。この一覧をもとに、修正担当者へ対象ページと確認する操作を伝えられます。

HTML報告書は、集計した結果から公開用スナップショットを更新してダウンロードします。入力を変更した場合は再集計し、文書とスナップショットも更新します。未入力・未確定の項目を見直し、今回確認した範囲と残っている項目が分かる状態で報告してください。

報告する文書と、作業を続けるデータを保管する

報告先には試験結果報告書、修正担当者には不適合一覧と対象ページの情報を渡すなど、用途に合わせて文書を選びます。修正依頼の管理に別のツールを使っている場合も、一覧の課題番号や判断理由を転記して利用できます。

Web版で入力の続きを再開するときは、作業JSONを使います。作業の区切りに「作業JSONをダウンロード」で保管し、再開するときに「作業を開く」から読み込みます。HTML報告書やMarkdownだけを残すのではなく、再開用のJSONも保管してください。ブラウザーへの保存は一時保存です。

CMS版ではCMSに作業を保存します。各ページの入力後は保存し、記録を集計してから文書を作成します。過去の作業を別の記録として残す場合は、履歴保存先の設定と履歴へ追加する操作を確認してください。

修正後は、同じ箇所を再確認する

資料請求ボタンの表示を修正したら、対象ページを開き、Tabキーで同じボタンへ移動してフォーカス位置を確認します。修正したことと、修正後に確認した結果をそれぞれ残します。

  1. 「対応・再確認」で該当する項目と対応内容を確認します。
  2. 「選んだ項目を再確認する」から確認を進め、選んだ項目すべてに新しい結果と確認日を入力します。
  3. 「再確認の結果を対応一覧に反映」を押します。Web版は作業JSONを保管し、CMS版は「改善を保存」で保存します。

再確認前の試験記録は履歴に残ります。前回の結果を参考にしながら今回の状態を確認し、問題が残っていれば引き続き対応します。一部のページ・達成基準を再確認した結果は、その範囲の記録として扱います。

Web版で記録と出力を試す

まずは対象ページと目標を設定し、確認した項目の結果・確認方法・理由を入力してみてください。入力途中でも、集計や文書の作成を試せます。その際は未確認の項目が残るため、試験完了やサイト全体の適合として扱わないでください。実際の試験では、決めた範囲の確認を進め、結果を見直してから報告します。

操作マニュアル一覧出力見本製品紹介へ戻る