Webアクセシビリティ：チェック（検証）方法とレポート記載（報告）について、ガイドラインと実例集

2019年12月7日2020年2月21日

Webアクセシビリティという言葉を知っている方、実際に取り組もうとされている方でも、そのチェック（検証）方法やチェック（検証）した結果の報告方法については「知らない」「よくわかっていない」ことが多いかと思います。この記事では「JIS X 8341-3:2016規格」や「ウエブアクセシビリティ基盤委員会のサイト」を参照しながら、一般的なチェック（検証）作業から、その結果報告の仕方までを紹介していきます。
　個人レベルのサイト（ブログ）での作業としてはこのようなチェック（検証）は必ずしも必要ではないかもしれませんが、Webアクセシビリティに取り組もうとしているのであれば、一読いただきその概要を認識（知っておくだけでも）していただければ嬉しいです。
この記事があなたのサイトのバリアフリー化の助けになれば幸いです。

Webアクセシビリティチェック（検証）とは

Webアクセシビリティチェック（検証）とはサイト（ブログ）がWebアクセシビリティなサイトであるかのチェックです。言葉通り取れば、「アクセシビリティ確保の基本の「キ」10項目」を満たしているかをチェックすることでもありますが、ここでは「JIS X 8341-3:2016規格」やその達成基準を満たしているかのチェック（検証）方法や、その結果の報告事例を「ウエブアクセシビリティ基盤委員会のサイト」を参照しながら紹介していきます。

なのでチェク（検証）とは「JIS X 8341-3:2016」のレベルを満たしてるか、つまり設定されたレベルの各項目がクリアーできているか否か（具体的にはその項目が「◯」となるか「×」となるか）を判定することです。

＊「JIS X 8341-3:2016規格」や「ウエブアクセシビリティ基盤委員会のサイト」については以下の記事を参照ください
↓↓↓↓↓↓↓
■Webアクセシビリティのガイドライン「JIS X 8341-3:2016」って何？「ウェブアクセシビリティ基盤委員会」とは

では、実際のチェック（検証）を始める前にその元となるチェック表について解説します、これら「JIS X 8341-3:2016」の構成や「レベル」については読み飛ばしていただいても構いませんが、チェック表の元となる情報と意味について理解いただくために記載しています。

「JIS X 8341-3:2016」の構成

＊以下の内容はウェブアクセシビリティ基盤委員会 のサイトより転記しています。
＊JIS X 8341-3:2016には項目番号が振られています、この番号はチェク表のみならず今後の達成基準チェックを表記する時にも使われる項目番号になります。

『JIS X 8341-3:2016』の規格票は、次のような構成になっています。このうち、冒頭の「序文」と「0A 適用範囲」は、対応国際規格の『ISO/IEC 40500:2012』や『WCAG 2.0」には記載されていませんが、この規格の理解を促進するために箇条0Aとして追加したものです。また、「イントロダクション」については、対応国際規格では箇条番号が付与されていないが、分かりやすくするために箇条0Bとして箇条番号を付与してます。

• 序文
• 0A 適用範囲
• 0B イントロダクション
  • 0B.1 WCAG 2.0 ガイダンスのレイヤー
  • 0B.2 WCAG 2.0 関連文書
  • 0B.3 WCAG 2.0 における重要な用語
• 1 知覚可能の原則
  • 1.1 代替テキストのガイドライン
  • 1.2 時間依存メディアのガイドライン
  • 1.3 適応可能のガイドライン
  • 1.4 判別可能のガイドライン
• 2 操作可能の原則
  • 2.1 キーボード操作可能のガイドライン
  • 2.2 十分な時間のガイドライン
  • 2.3 発作の防止のガイドライン
  • 2.4 ナビゲーション可能のガイドライン
• 3 理解可能の原則
  • 3.1 読みやすさのガイドライン
  • 3.2 予測可能のガイドライン
  • 3.3 入力支援のガイドライン
• 4 堅ろう（牢）（Robust）の原則
  • 4.1 互換性のガイドライン
• 5 適合
  • 5.1 適合要件
  • 5.2 適合表明（任意）
  • 5.3 部分適合に関する記述－第三者によるコンテンツ
  • 5.4 部分適合に関する記述－言語
• 附属書A（規定）用語集
• 附属書B（参考）謝辞
• 附属書C（参考）参考文献

「JIS X 8341-3:2016」には達成レベルが設けられている

「JIS X 8341-3:2016規格」には達成基準に応じたレベルがもうけられています。

レベルの決め方は、上記の構成を元に　「全部で61項目の達成基準」を作成し、その項目をレベルで分けています。レベルは「A」「AA」「AAA」と表記され、各レベルの基準は以下のようになっています。

■レベルA
25の達成基準
＊アクセシビリティ確保に最低限必要なレベル
■レベルAA
13の達成基準
＊諸外国で公的機関に求められるレベル
■レベルAAA
23の達成基準
＊レベルAAAを目標とすることは推奨しない

＊総務省では公的機関に対してレベルAA対応を推奨

なお、達成レベルの表記については全ての項目をクリアーしなくとも「一部準拠」といった記載で一部については達成していることを示すことができます。
＊達成レベルの表記について→JIS X 8341-3対応度表記ガイドライン

チェックのための「JIS X 8341-3:2016」の項目

では、実際にチェクするべき項目をみてみましょう。
＊達成基準の内容については解る範囲で省略して記載してあります
＊適合レベルはその項目がどのレベルに属する項目かを示しています
＊この表はウェブアクセシビリティ基盤委員会 のサイトより転記しています

作成者：ウェブアクセシビリティ基盤委員会

上記チェック表を元に、対象サイトをチェックしてレベル「A」の項目が全て満たされれば（チェックが◯になれば）そのサイトは「レベルAに準拠している」という結果になります。

＊この記事には、チェックをするための項目解釈の情報や判定するための各項目に対する考え方は記載していません、なぜならそれを記載すると１項目だけで１記事が書けるくらいの量になるからです。実際に上記のチェク表を埋めるにはそれなりの知識と経験が必要になります。（各項目の内容はこちらを参照： 情報バリアフリーポータルサイト）

実際のチェック（検証）方法

では、いよいよ、実際のチェック（検証）方法についてご紹介します。
＊以下の内容はJIS X 8341-3試験実施ガイドラインを参照しています。

チェックするウェブページについて

運営するサイトの全てのページをチェク（検証）するか否かは、ページ数によります。概ね100ページを超えるようなサイトについては以下のような方法が推奨されています（100ページ以下でも参考になります）

また全てをランダムに抽出（選ぶ）というよりは、以下のように組み合わせての抽出が推奨されています。

組み合わせの例：

チェック(検証）の方法

いくらページ数が少なくとも全てのページを目視や手動でチェックするのは大変です。そこでチェック（検証）のためのツールを使用するのが一般的です。

よく使われるチェック（検証）ツール：無料のもののみ

■みんなのアクセシビリティ評価ツール：miChecker (エムアイチェッカー)Ver.2.0
総務省が開発し、提供するアクセシビリティ評価ツールです。

■スクリーンリーダ：NVDA
Windows専用の音声読み上げと点字出力で操作するためのソフトウェア（スクリーンリーダー）です。
（音声読み上げは、WindowsもMacも　OSのアクセシビリティ機能の中に装備されています）

＊その他コントラスト比等をチェックするツールなどがよく使われますが、現在ではパソコンやデバイスのアクセシビリティ機能の進歩により様々な支援機能が用意されています、なので実際に障害のある方が利用する環境にセッティング（設定）した状態で検証するサイトの再現状況をチェックすることができます。

以下のサイトで各チェックツールの使い方についてわかりやすく解説がされています

Webアクセシビリティチェックに役立つフリーツール（株式会社アーティス）

• コントラスト比チェック「ColorTester」
• alt属性チェック 「Alt & Meta viewer」（Chrome拡張機能）
• CSS無効化チェック 「CSS無効化くん」（Chrome拡張機能）
• ページタイトル・リンク切れチェック「Website Explorer」
• みんなのアクセシビリティ評価ツール「miChecker」
• スクリーンリーダー「NVDA日本語版」

検証ツールを使いつつ次の３パターンでチェックします。そのチェック結果を上記のチェック表に「◯」「×」で記載します。

1. チェックツールが発見した対象をチェックツールが判断する (AC: Automated Check)
2. チェックツールが発見した対象を人が判断する方法 (AF: Automated Find)
3. チェックツールが発見することが不可能な場合で、対象を人が判断する方法 (HC: Human Check)

ということで、最終的には人が判断することになります、つまりチェックする人が「JIS X 8341-3:2016」の項目の意味するところとどのような状況（状態）であれば「◯」になるのか、「×」なのかの判断に対する正確な知識が必要になります。

チェック（検証）結果の報告

チェック（検証）した結果はできるだけレポート化し、サイトのなかで公表することが望ましいです。せっかく労力と時間をかけて検証するのですから、その取り組み具合をアピールすることは大切です。たとへ現状で評価「レベルA」を満たしていなくても、意識して頑張っている状況を示すことでサイトの評価に繋がります。

報告結果の記載方法については、JIS X 8341-3試験実施ガイドラインにも解説がありますが、わかりにくいかと思うので実際の報告例を探してみて、気に入ったサイトを参照しながら真似てみるのがお勧めです（丸パクリは絶対ダメですよ！）。

報告の例

■ウェブアクセシビリティ検証結果-内閣府

いちばん綺麗なお手本かなと（個人的）に思います、まずはこれをみながら作成してよいのではないでしょうか。

そのほか、ググる（検索）すると色々な報告サイトがあります、まずはお住まいの地域の行政機関や身近な会社を調べてみると親近感がもてるかもしれません。

■ウェブアクセシビリティ試験結果（平成29年度実施） – 仙台市水道局

こちらも綺麗です、真似できそうです（^^）

■ウェブアクセシビリティ方針 | 埼玉県「働くシニア応援サイト」

こちらのように方針を示すだけでも記載する価値はありそうです（意気込みは感じます）

最後に

Webアクセシビリティのチェック（検証）方法やチェック（検証）した結果の報告方法について「JIS X 8341-3:2016規格」に基づき「ウエブアクセシビリティ基盤委員会のサイト」を参照しながら紹介しましたが、いかがですか？
おそらく、「難しい」「大変」「できそうにない」という感想になったのではと想像しています。

最後にこんなことをいうのは「それはない！」と批判されそうですが、とりあえず上記の規格や検証の話はわすれて、以下の項目をできるところから取り組むのがおすすめです（^^）

ちょっと読んで欲しいりんご推しのサイトです
↓↓↓↓↓↓↓
https://webtan.impress.co.jp/e/2018/04/20/28538

「アクセシビリティ確保の基本の「キ」10項目」

りんごからのお知らせ

こんにちは、Ringoです。岡山県真庭市というところで非常勤のデザイン講師をしながら、ブログやメルマガを利用したネットビジネスをご紹介しています。

このブログでは、老後の「ゆとり」を生む資金作りのノウハウを配信しています。
今だけ無料で『資金づくりの種類や手法をわかりやすくまとめたレポート』をお渡し、無料で受け取りたい！ということであれば、今すぐ「りんごのメルマガ」にご登録ください。
登録後、特典の受け取り方法をご案内するメールをお送りいたします。
＊特典を受け取った後にメルマガを解除いただいても構いません。
＊解除に対しての手数料もかかりません。

ただ、メールを読み続けていただくと、シニアライフに嬉しい「お小遣い」を獲得できるノウハウを紹介。無理なくコツコツと老後の資金を増やしていくためのお得な情報をお届けします。

SNSやネット活用の実践講座を交えた実りいっぱいの無料メルマガです。

お申し込みはこちらのボタンをクリック、是非この機会に(^o^)ﾉﾞ
↓↓↓↓↓↓↓↓↓↓ ＊クリックだけで登録はされません、表示された案内ページ内の申込フォームからご登録ください。

よろしければ、この記事やブログに関する　感想・聞いてみたいこと・要望などなどお聞かせください。内容と関係ない雑談も大歓迎です（^^）
↓↓↓↓↓↓↓お気軽にo(^-^)o♪
yoko_takano@appli.redまたは お問合せ

お願い記事内の不具合や間違い等をお知らせください。 （キャプチャーの違い、古くなった情報、誤字脱字等些細なことでもかまいません）
↓↓↓↓↓↓↓↓
＊お知らせいただいた方にはりんごからささやかなお礼を送らせていただきます。