連載記事ウェブアクセシビリティを知ろう

連載22:ウェブアクセシビリティとADAに関する手引き(その5)

山田 肇
2022年3月25日

「その4」に戻る

(手引き本文)

ウェブアクセシビリティに対応する具体的方法

企業、州政府および地方自治体はウェブアクセシビリティに対応する際に、さまざまなウェブサイト機能を検討する必要がある。

参考資料には、ウェブアクセシビリティを実現する方法を説明する組織へのリンクがあるので参照して欲しい。ウェブサイトにアクセスできるようにするために企業が行うべき対応例には、次のような実践が含まれる(ただし、これらに限定されない)。

テキストの色のコントラスト

テキストと背景の間に十分な色のコントラストがあれば、視力が限られている人や色覚異常の人も、色を使用したテキストを読める。

テキストで色を使用する場合のテキストキュー

テキストの色を使用して情報(入力フォームの必須項目を示す赤いテキストなど)を提供する場合、色を認識できない人にとっては、テキストの手がかりを含めるのが重要である。たとえば、項目を赤いテキストで表示するのに加え、「必須」というテキストキューを含める。

画像内の代替テキスト

代替テキストは写真、イラスト、チャートなど、画像の目的を伝える。代替テキストは、目の見えない人がスクリーンリーダを使用して代替テキストが読み上げられるのを聞くなど、画像が理解できない人が使用する。有用であるために、テキストは短く、かつ説明的でなければならない。

ビデオキャプション(字幕表示)

正確で、かつ、ビデオ内の誰が話しているかが識別できるように話者と同期する字幕を付ければ、ビデオはアクセシビリティに対応できる。

オンラインフォーム

フォームにアクセスするには、項目名、キーボードアクセス、および明確な指示が重要である。項目名があると、目の不自由でスクリーンリーダを使用しているユーザは、たとえば、求人応募フォームの各項目にどのような情報を入力するかなど、各入力項目の処理方法を理解できるようになる。また、スクリーンリーダを使用しているユーザが、入力項目に誤って入力したときに、自動的に通知されるようにするのも重要である。これには、エラーの内容と解決方法を明確に特定することが含まれる(日付が間違った形式で入力されたとユーザに通知する自動アラートなど)。

テキストサイズとズーム機能

視覚障害のある人は、ブラウザのズーム機能を使用してフォントのサイズを大きくし、内容がよりはっきりと見えるようにする場合がある。

見出し

ウェブサイトのセクションが視覚的な見出しで区切られている場合、ページをデザインするときに見出しをウェブサイトのレイアウトに組み込めば、目の不自由な人がページのレイアウトをナビゲートして理解するために、見出しを使用できるようになる。

キーボードとマウスのナビゲーション

キーボードアクセスとは、障害を持つユーザがマウスではなく、キーストロークを使用してウェブコンテンツをナビゲートできることを意味する。

アクセシビリティチェック

ウェブサイトの問題を特定または修正する自動アクセシビリティチェッカーとオーバーレイは便利なツールであるが、スペルチェックや文法チェッカーなどの他の自動ツールと同様に、注意して使用するのがよい。「問題なし」とのチェッカーからのレポートは、必ずしもすべてにアクセスできると意味するわけではない。逆に、レポートがいくつかのエラーを指摘しても、必ずしもアクセシビリティ上の障壁があると意味するわけではない。ウェブサイトの手動チェックと自動チェッカーの使用を組み合わせると、ウェブサイトのアクセシビリティがよりよく理解できる。

アクセシビリティ問題の報告

一般の人々がアクセシビリティの問題を報告する手段を提供すれば、ウェブサイトの提供者は指摘に沿ってアクセシビリティの問題を修正できる。

以上に説明したポイントは考慮すべき事項の完全なリストではない。障害を持つ人々がウェブサイトにアクセスできるようにするために、企業や州政府および地方自治体を支援する多くの既存のリソースがあり、一部は参考資料に含まれている。

(解説)

WCAGはこの手引きで指摘された以上の対応を求めているが、本章で説明された各ポイントはウェブアクセシビリティ対応にもっとも重要な、基本的な事項を含んでいる。

自動アクセシビリティチェッカーを使用すると共に、手動チェックも実施し、また、サイト利用者からの問題指摘を受け付ける仕組みを導入するなど、施策の組み合わせでアクセシビリティは改善されていく。

「その6」に進む

ページの先頭に戻る