Loading
誰でも出来る「ウェブアクセシビリティ診断」実際のチェックや検査業務での活用例

誰でも出来る「ウェブアクセシビリティ診断」実際のチェックや検査業務での活用例

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

どうもこんにちは。サキシマGT コンサル担当 Nです。
 

新サービス開始しました!

サキシマGTでは、この記事に登場するWEB検証ツールISSOの詳しい活用方法のご案内や、ISSOをフル活用したWEB改善提案を毎月定額で実施する「WEB改善コンサルティングサービス」を開始いたしました。
補助金の導入にて実質ゼロ円で企業様にご導入頂ける仕組みもご用意しております。

ご興味頂ける場合は下記よりお気軽にお問合せ下さい。


 
 
さてこの記事は、Webサイトの「ウェブアクセシビリティ診断(webアクセシビリティチェック)」に役立つ内容となっております。

ウェブアクセシビリティ(webアクセシビリティ)診断について
・社会的にニーズが高まっているがモヤモヤしてる方
・miCheckerでの作業に疲弊している方
・効率よくチェックできるツールがないか探している方

ウェブアクセシビリティ(webアクセシビリティ)とは?

Webサイト、ツール、およびテクノロジーが、身体的な障害の有無に関わらず万人が使用できるよう設計および開発されていることを意味しますが、下記のようなユーザーにもメリットがあります。

・端末の画面が小さく、入力モードが異なる機器を使用しているユーザー
・加齢により能力が変化しうる高齢者
・ケガや器具の紛失などで「一時的な障害」のユーザー
・明るい日差しや音声が聞こえない環境など「状況に制限のある」ユーザー
・低速のインターネット接続を使用しているユーザーなど

つまり、ウェブアクセシビリティ(webアクセシビリティ)とは、使用端末や言語、年齢・心身の条件によらず、すべての人が支障なくサイトを利用できるようにすることを指しています。WEBサイトのユニバーサルデザイン、またはWebサイトのバリアフリー化とも言えるでしょう。

気軽にウェブアクセシビリティ診断(webアクセシビリティチェック)できる環境を手に入れる

では、そんなウェブアクセシビリティ(webアクセシビリティ)に、気になるWebサイトがどの程度対応しているのか、一体どのようにWeb検証・アクセシビリティチェックできるのでしょうか。

手段としては2つ考えられます。

1)診断サービスを実施している企業に外注する
2)自社で調べる

前者の場合、費用は無料診断~数百万円と、サイトの規模にもよりますが様々です。
後者の場合はどうでしょう。ツールを使っての調査になりますが、できるだけ効率的に、且つ、簡単にウェブアクセシビリティ診断(webアクセシビリティチェック)ができて、どこの何を改善すべきか、これが誰でも簡単に抽出・把握・指示出しまで出来る環境を整えることが理想です。

そんなウェブアクセシビリティ診断(webアクセシビリティチェック)と具体的な改善に適した便利なツールが「ISSO」です。このツールでは下記の多角的なウェブアクセシビリティ診断(webアクセシビリティチェック)を実現します。

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

ISSOによる実際のウェブアクセシビリティ診断(webアクセシビリティチェック)

ISSOによるウェブアクセシビリティ診断(webアクセシビリティチェック)作業は「サイトのTOPページのURL入力のみ」と簡単です。

次に検証範囲と検証項目を選び、検証ボタンを押せばOK。

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

ウェブアクセシビリティ診断(webアクセシビリティチェック)については
■レベルをA・AA・AAAのいずれかから選びます。
■検証ツールを2つのうちいずれかから選びます。

片方はGoogleのLighthouse、もう一方を選ぶと、JIS X 8341-3:2016規格に準じたウェブアクセシビリティ診断(webアクセシビリティチェック)が可能です。

検証結果はネット環境とPC端末があればいつでもどこからでも確認可能。リモート環境にあるWeb分析・Web検証スタッフ間においても、抽出したデータや改善が必要な箇所の詳細まで簡単に共有できます。

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

検証データによる現場へのディレクション方法

ウェブアクセシビリティ診断(webアクセシビリティチェック)については、
■レベルAに達成するまでに必要な修正箇所
■レベルAAに達成するまでに必要な修正箇所
■レベルAAAに達成するまでに必要な修正箇所

がそれぞれ表示され、検証・チェックしたWebサイト全体または検証・チェックしたWebページ範囲でのトータルスコアが表示されます。

さらにウェブアクセシビリティのどんな項目でどれだけの指摘があるのか、次の画面でこのように確認できます。

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

こうして見ると、要改善点が項目ごとにどれだけあるかをまず把握できます。
さらに、ISSOの本領発揮はココからです。

たとえばこのサイト。

ウェブアクセシビリティ(webアクセシビリティ)の検証・チェック項目のうち「音声ユーザビリティー操作」関連の指摘がサイト全体で比較的多いことが一目瞭然です。(ロービジョン判定も全ページ指摘がありますがw)

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

さらに、
・どのページの何行目のソースが
・どの定義に抵触していて
・どのように改善すべきか

これらを簡単に画面上でソートしながら確認できるのです。

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

修正すべき箇所が多い場合は、検証項目ごとにエクスポートできるCSVデータを利用すれば、ボリュームや種別によってソート・仕分けしての指示出しも簡単です。

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

こちらは、重要なTOPページ内に見つかった「音声ユーザビリティの操作」関連での指摘箇所を確認してみたところです。

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

このページの411行目と517行目に
H3タグの1階層上がH1タグになっているとのことで、見出し(h1,h2…)の入れ子関係を適切なものにしてください。と指摘されていることがわかります。

もう1つは、
このページの547行目に読み上げ可能なテキストが存在しないため、優しくないです!と指摘されていることがわかります。

前者は入れ子関係を修正、後者は適切なテキストを挿入してあげることで、このページのウェブアクセシビリティ(webアクセシビリティ)について「音声ユーザビリティの操作」関連で問題です!と指摘されている箇所は簡単に改善が可能です。

このように、一見、膨大な要改善箇所の数に思わずのけぞってしまうような場合でも、中身を紐解くと、じつは簡単に修正できる、そんな内容も少なくありません。

要は、まずは分析して「どういった要改善箇所(=のびしろ)がどれだけあるか」を知ることが大切です。
その上で、コーダーなどの現場担当者などに対して
・すぐ改善できるもの
・工数を算出してもらってから検討したいもの

などと仕分けしながら改善ディレクションを進行すると良いでしょう。

ウェブアクセシビリティ JIS X 8341-3:2016に基づく診断結果事例 サキシマGTのウェブアクセシビリティコンサルサービス

まとめ

いかがでしたでしょうか。

ISSOなら、自社サイトやサービスサイトの改善はもちろん、ウェブアクセシビリティ診断(webアクセシビリティチェック)サービスやWeb検証チェックやテストを展開されている企業様や お客様のWebサイト改善業務をされている企業様の分析業務にもお役立ち可能です。
 

新サービス開始しました!

サキシマGTでは、このISSOの詳しい活用方法のご案内や、ISSOをフル活用したWEB改善提案を毎月定額で実施する「WEB改善コンサルティングサービス」を開始いたしました。
補助金の導入にて実質ゼロ円で企業様にご導入頂ける仕組みもご用意しております。

ご興味頂ける場合は下記よりお気軽にお問合せ下さい。

PAGE TOP