2021年6月4日から義務化されたウェブアクセシビリティ。
ウェブアクセシビリティとは、一言でいえば「どんな人でも見やすいサイトにする」ということです。
弱視の方や手の不自由な方、年配の方などはもちろん、グローバル化が叫ばれる時代。外国人のサイト閲覧も多くあります。
このように様々な環境からもアクセスできるようにすることも、どんな人でも見やすいサイトに当てはまります。
でも、ウェブアクセシビリティを行いサイトを新しくしても、これで正しいの？って不安に思うこともあるのではないでしょうか？
有料のものもありますが、無料のものもあるんですよ。
今回は、無料、有料合わせて10件ご紹介させて頂きます！ご参考になれば幸いです。
お好きなところからお読みください
ウェブアクセシビリティ無料ツール
無料ツールにも様々なチェック機能がありますので、まずは無料から試してみるのも全然OK！
※あくまでも機械での自動ツールなので、実際に当事者が使いやすくなるかどうかは当てはまらないケースもございます。
機能的な部分だけでなく、実際の使い勝手も重視していきたい場合は、当事者の目視やテストをするのをオススメします。
miChecker
正式名称は、みんなのアクセシビリティ評価ツールmiCheckerというのですが、このツールは総務省が提供しています。
もちろん無料！
残念ながらMacには対応しておらず、Windowsのみ対応になるようです。iPadOSには対応しています。
多機能で、最もよく使われているアクセシビリティ評価ツールです。
「JIS X 8341-3:2016」に準拠したサイトになっているかどうかが検証できます。
実行環境は以下です。
- OS：Windows 8.1,Windows 10
- ブラウザ：Internet Explorer 11
- メモリ：1GB以上（2GB以上を推奨）
- ハードディスク空き容量：250MB以上(導入先フォルダにユーザーの書き込み権限が必要です)
- Java実行環境：Java 32bit版 Version 8
音声読み上げソフトを使用した際のユーザビリティをチェックしたり、色覚に障害がある方がどのよう見えているかをシミュレーションすることができますので、けっこう便利です。
miCheckerは、圧縮ファイルをダウンロードして使うことが出来ます。
▼ダウンロードページこちら▼
みんなのアクセシビリティ評価ツール：miChecker (エムアイチェッカー)Ver.2.0
Lighthouse
Lighthouse（ライトハウス）とは、Googleが無料で提供しているWEBサイトの品質チェックツールです。
Google Chromeの拡張機能から利用することができます。
特にPWA（プログレッシブウェブアプリ）を中心としたサイトの評価を簡単に確認することができ、PWAに必要な品質項目を満たしているかどうかが確認できます。
Lighthouseで確認可能なチェック項目は、
- Performance
- Accessibility
- Best Practices
- SEO
- Progressive Web App
の５項目。
Performance
Performanceでは、ページの読み込みや、レスポンスの速さなど主にサイト内のスピードに関する評価が表示されます。改善するために必要なCSSやJavaScriptの最適化についての解説もあるので、スコアが低いものがあった場合は改善チャンスですね。
Accessibility
Accessibilityは、審査対象はテキストや背景の色が見やすいか、HTMLの構造が正しく設定されているかなどが確認できます。
Best Practices
Best Practicesでは、モバイル対応したサイトの品質向上に向けたアドバイスや、パフォーマンス低下に繋がる内容を避けるための手法が確認可能です。
SEO
SEOは検索結果のランキングに影響する項目や、canonicalが正しく設定されているか、robots.txtによってページがブロックされていないかなど、基本的な内容が確認できます。
Progressive Web App
Progressive Web AppはPWAの仕様に沿ったWebページがどうかを分析・評価してくれます。指標に適していないWebページはfailedと表示されます。
Service Workerの登録有無や、HTTPS化されているか、読み込みスピードに関するチェック等も出来ます。
▼拡張機能ダウンロードページこちら▼
Alt & Meta viewer
Alt & Meta viewerは、Google Chromeの拡張機能でALTのチェックツールです。
ALT（属性）とは、画像の内容を表すテキストのことで、視覚障害のある方が画像の内容を把握する際に、あらかじめ入力されたテキストを音声ソフトが読みあげてくれます。
ALTを入れておくとGoogleのクローラーが画像の内容を把握する手助けにもなるので、SEO対策にも有効になります。
▼拡張機能ダウンロードページこちら▼
CSS無効化くん
またまたchromeの拡張機能になりますが、CSS無効化くんはHTMLとして正しく構造化されているか確認したい時に便利な拡張機能です。
HTMLを作成したときに、クローラーからどう見えるか検証をしたい時にCSSを無効化してくれます。
また、アクセシビリティチェックを行う上で、CSSを無効化した状態での確認が必要になる場合がありますので、その際はCSS無効化くんを試してみてくださいね。
▼拡張機能ダウンロードページこちら▼
NVDA日本語版
このソフトは、20カ国以上の言語に対応している音声読み上げソフトになります。
いわゆる、スクリーンリーダーですね。
NVDAが提供しているショートカットキーを使いながら、実際に操作してみて使用感を確かめていくことができます。
最新はWindows11にも対応。以前のバージョンはWindows７まで対応しています。幅広いですね。
タッチ操作でもNVDAを操作できます。※Windows 8以降
▼NVDAダウンロードサイトこちら▼
ダウンロード
Website Explorer
ウェブページのチェック＆リンクに関するチェッカーでおすすめなのが、Website Explorerです。
ですが、リンク切れが発生していると閲覧上の支障を与えてしまいますよね。
なので、Website Explorerを使ってチェックしておくとユーザーに優しいです。
音声ブラウザは最初にページタイトルを読み上げると思いますが、この時タイトルが適切に設定されていないと音声ブラウザを利用する方は、そのウェブページの主題や内容を把握することができません。
また、ページタイトルはブラウザのブックマークを使用する際に利用されることがあるため、ウェブページ毎に値を設定する必要があります。
Website Explorerは、2020年4月で公式サイトを終了しましたが、ご利用いただいているユーザーの方々のお役に立つように追加情報を発信していくそうですので、ぜひ試してみてください。
▼公式サイト▼
※こちらからは現在ダウンロードできないようです。
▼窓の社からもダウンロード可能▼
ColorTester
JIS X 8341-3:2016では、色覚障害者への配慮として背景色と文字色のコントラストにおいて基準が設けられています。
- 1.4.3 コントラスト（最低限レベル）の達成基準（レベルAA）
- テキスト及び文字画像の視覚的提示には，少なくとも4.5:1 のコントラスト比があること。
- サイズの大きなテキスト及びサイズの大きな文字画像には、少なくとも3:1のコントラスト比があること。
コントラスト比といわれても、現在自分のホームページのコントラストが何：何なのかなんて判らないですよね。
そういう時は、コントラスト比チェックColorTesterを使ってみましょう。
ColorTesterはJIS規格に基づき、2色のコントラスト比を計測してくれます。
公式サイトから、「ColorTester」をダウンロードし、計測したい画像をドラッグ＆ドロップすると文字と背景のコントラスト比を計測してくれます。
▼ColorTesterダウンロードサイトこちら▼
ダウンロード
色のコントラストチェッカー
こちらもコントラスト比をチェックできるクラウド上のツール。
SYNCERが提供しており、こちらはダウンロードやアカウント登録の必要もなく使うことができます。
背景色と文字色の色コードを入力するだけで、
- コントラスト比
- 通常文字 (22px未満)
- 巨大文字 (22px以上)
- 太文字 (14px以上)
が達成基準になっているかどうかを確認することができます。
▼ページはこちら▼
ウェブアクセシビリティ有料ツール
世界からも認められているソフト３つをご紹介しますね。まずは、こちら！
Siteimprove
リンク切れや表記の統一などで力を発揮するのが、Siteimprove。
世界では7,000社を超える企業に利用されています。
海外のソフトウェアサービスレビューサイトG2 CrowdでもWeb担当者から高評価を獲得しているんですよ。
Siteimproveは自動化されたクローラーにより、常にサイトの状況をデータとして検出します。
なんと、200項目以上の検証項目を全ページに渡って自動検証してくれます。
- リンク切れ
- 表示速度
- アクセシビリティ
- 表記揺れ
など、サイト品質に関わるあらゆる問題を即座に発見してくれ、対応優先順位も提案までしてくれます。便利♪
※料金は要問合せ
▼ページはこちら▼
WAIV
WAIVは、サイトのWEBアクセシビリティを総合的に評価してくれます。
JIS X 8341-3:2016にどの程度対応しているか項目ごとに点数確認できます。
また、通常のWEBサイトだけでなく、PDFを含むWEBサイトも評価が可能です。
他のソフトとはココが違う！ ~WAIVの特長～
- 最新のJIS規格 JIS X 8341-3:2016に対応
- 抽出された問題点と修正ポイントを具体的に解説
- PDFが含まれるサイトのアクセシビリティチェックもお任せ！
- 現状のサイトや開発中のファイルなど、好きなタイミングで評価が可能
- MicrosoftEdge, GoogleChrome等のブラウザー向けのウェブサイトの評価に対応
- 対象サイトを外部サーバー等へアップロードすることなく評価可能
- 最初に評価したページからリンクされているページも自動的に評価可能
※↑上記WAIVウェブサイトより引用
| プラン | 料金 |
| WAIV １年利用版 | ¥93,000（税別）／1ライセンス |
| WAIV 90日利用版 | ¥49,000（税別）／1ライセンス |
| WAIV 無期限利用版 | ¥188,000（税別）／１ライセンス |
▼ページはこちら▼
axe Monitor
axe MonitorはWebアクセシビリティのチェックツールでは古くから定評のあるアメリカのDeque Systems社と協力し、同社製品である「axe Monitor（旧名称：WorldSpace Comply）」のインターフェースを日本語化し、提供しています。
指定したWebサイトやページを自動巡回して情報を収集し、アクセシビリティの問題がないかデータを解析して報告をしてくれます。
ページ単位でのチェックツールとは違い、Webサイト一括での検証が可能です。
複数ドメインのサイトや、スクリプトによるリンクにも対応。運用の手間が抑えられますね。
世界展開したい方には嬉しい機能ですね。
もちろん、JIS X 8341-3:2016にも対応しています。
※2016年に改正された日本国内のアクセシビリティ規格である「JIS X 8341-3」が「WCAG 2.0」と一致規格であるため。
axe Monitorの導入・設定から運用まで、スタッフがサポートしてくれるので、使い方がわからないといった不安がある人におすすめです。
※料金は要問合せ
▼ページはこちら▼
ウェブアクセシビリティのチェックツールまとめ
いかがでしたでしょうか？
無料では、個別に出来るツールが異なるという印象で、有料ではフルでやってくれるという印象を私は持っているのですが、無料でも組み合わせして行けば全然フルで使えてしまうと思います。
ただ、有料の方がサポートは充実しているし、手間もかからないというメリットもありますね。
やっぱりそこは、まだ当事者の目視やテストでやるのが一番です。
全然アクシビリティのことが分からないという方は、有料をおすすめしますが、無料でやってみて「あっ、全然できるじゃん」ということもあると思うので、まずは気軽に無料拡張などでお試しください。
それでは、また～♪
ウェルサーチ 障害者・編集チーム
最新記事 by ウェルサーチ 障害者・編集チーム (全て見る)
- 【相談会】障害者の在宅ワーク支援者が答える！在宅IT仕事のイロハ - 2024年2月16日
- 【無料の説明会】Microsoftツールを使い工賃アップ・就職に繋げよう｜障害者の就労向け - 2023年4月12日
- 盲目の格闘家がプロレスラーに挑戦！日本の大人たちを元気にする共生プロジェクトをスタート！ - 2023年4月11日
この記事へのコメントはありません。