Webアクセシビリティの対応を行うにあたって、よくある問題点を次の６つを例にご説明いたします。

  1. 代替テキストがない、もしくはテキストが重複している。
  2. 文字色と背景色のコントラスト比の不足
  3. メニューをキーボード操作で開けない。
  4. 操作している箇所を見失う可能性がある
  5. 広告などのスライダーの内容をしっかりと読むことができない
  6. 表示されている情報が視覚障害のある方に伝わらない
  7. 新しく開いたブラウザから元に戻れない
  8. 見出しがないため、目的の箇所になかなか到達できない
  9. 外国の方への配慮が欠けている

1. 代替テキストがない、もしくはテキストが重複している。

Webアクセシビリティ対応の中で一番多い問題です。

視覚障害者の方は、音声読み上げソフトを利用してホームページにある画像の内容を理解しています。そのため、画像には代替テキストを付与することが求められています。ただし、画像の代替テキストとは別に画像を説明するために代替テキストと同一のテキストを記載すると２度同じ内容が読み上げられ、視覚障害者の方は混乱してしまいます。

そのため、画像の代替テキスト、もしくは画像を説明するテキストのどちらか１つだけにする必要があります。

2. 文字色と背景色のコントラスト比の不足

文字色と背景色のコントラスト比が不足すると、白内障や高齢の方が視覚認知能力の低下により、文字がぼやけるなど文字を読み取ることが出来ない、あるいは困難になる可能性があります。その問題を防ぐために、コントラスト比は4.5:1以上にする必要があります。

なお、コントラスト比への配慮は文字だけに限りません。WCAG 2.1や2.2 では、グラフィックやシンボル、入力欄やボタンの境界など、利用者が内容や状態を見分けるために必要な部分についても、十分なコントラスト （3:1以上）が求められます。

3. メニューをキーボード操作で開けない。

全盲の方や手指に麻痺のある方は、マウスを使わずキーボードだけで操作します。

しかしながら、Webアクセシビリティの対応ができていないWebページでは、メニューをマウスで選択できてもキーボードのTabキーで選択できず開くことができないものがあり、全盲の方や手指に麻痺のある方は困ってしまいます。この問題を防ぐためには、ホームページはキーボードで操作できるように作成されることが必要です。

4. 操作している箇所を見失う可能性がある

弱視や麻痺などによりマウス操作が難しくキーボードだけで操作される方の場合、キーボードのTabキーを押して、順次移動する枠線(フォーカス)を目で追い、クリックしたい箇所に来た時にエンターキーを押します。

Tabキーでの移動は、ページの上から下へ、左から右への移動が基本ですので、移動を予測し視線を移動しますが、実際には予測できない場所に移動してしまうページがあります。そのようなページでは、障害をお持ちの方が枠線(フォーカス)を見失う恐れがあります。

この問題を防ぐためには、予測される順序で枠線（フォーカス）が移動するように修正する必要があります。

5. 広告などのスライダーの内容をしっかりと読むことができない

トップページにスライダーを設置して広告等が順番に次々と表示が変わっていくホームページがあります。

そのようなホームページでは、弱視の方や、文字を読んで理解するのに時間がかかる方は、スライダーを読み終える前に次のスライドへ切り替わってしまい、内容を十分に把握できない恐れがあります。

JIS X 8341-3:2016では、動きのあるコンテンツに対し、次のような要件を求めています。

  • スライドは5秒以内に停止させる
  • 一時停止、停止、再開などの制御機能を設ける

そのため、停止ボタン等を置いて、止めるようにすることが求められます。

6. 表示されている情報が視覚障害のある方に伝わらない

全盲の方は、音声読み上げソフトを利用してウェブサイトの内容を理解しています。

しかし、特別な表示方法や複雑な作り方によって、画面に表示された内容が音声読み上げソフトには伝わらない場合があります。そのようなホームページでは、何も読み上げられなかったり、必要な情報だけが抜け落ちたりして、全盲の方が内容を把握できなくなります。

そのため、同じ内容が重複して伝わらないように、代替テキストと周囲の説明文の関係を整理する必要があります。

7. 新しく開いたブラウザから元に戻れない

全盲の方が音声読み上げソフトを利用している場合、リンクを選択したときに新しいウィンドウやタブが開く場合は、そのことが利用者に分かるようにしておく必要があります。しかしながら、別ウィンドウが開くことを読上げないホームページでは、全盲の方は元のウィンドウに戻ることが難しくなります。

別ウィンドウが開く際は、「別ウィンドウで開きます」と通知するように修正します。

8. 見出しがないため、目的の箇所になかなか到達できない

雑誌に目次があるように、ウェブページにも似たような仕掛けがあり、これを見出しといいます。

見出しがついていると、音声読み上げソフトの利用者は、ページ全体の構成を把握するのも容易で、また移動も楽になります。しかしながら、ウェブアクセシビリティ対応がされていないウェブページでは、見出しだと思われる箇所に見出しの設定がないため、ウェブサイト利用者は探したい目的の箇所に移動するのに苦労することになります。

そのため、ウェブページを作成する時は見出しに配慮する必要があります。

9. 外国の方への配慮が欠けている

音声読み上げソフトがウェブページを読み上げるとき、日本語環境でお使いの場合は日本語が基準になります。例えば、その中に英文があると日本語読みになってしまい、おかしな読みになります。

日本語以外の言語の読みにするためには、言語を指定するHTML属性を追加する必要があります。