スクリーンリーダーにできること・できないこと |
視覚に障害を持つ方がWebサイトを利用する場合をはじめ、パソコンを使う際に活躍するのが、「スクリーンリーダー」と呼ばれる画面の文字を読み上げるソフトです。とはいえ、ページに貼り付けてある絵に何が描かれているのか?ということまでは知ることができません。
もっとも、「何の画像なのか」ということだけであれば、後でご説明いたします「ALTタグ」などの方法で対応できます。
しかし、実はもうひとつ問題があるのです。通常、画像素材サイトで素材をダウンロードする場合、画像にマウスカーソルを合わせて、Windowsであれば右クリックで「名前をつけて画像を保存」…といった手順になる事が多いかと思います。視覚障害がある方の場合、パソコンの操作はキーボードによるショートカットを利用することになるので、この操作が難しいのです。
ですが、これもページにちょっとした細工をすることで、キーボード操作だけでも画像がダウンロードしやすくなるのです。
画像にALTタグを指定する |
Webサイトにある画像の上にマウスカーソルを置くと、テキストによる案内文が表示(ポップアップ)されることがあります。これを実現しているのが、IMGタグで画像ファイルを指定する際、一緒に設定するALTタグです。
試しに、画像▼の上にマウスカーソルを置いてみてください。「人形で遊んでいる女の子」というテキストが表示されたでしょうか。
これは、次のサンプルソースのようにALTタグで文字列を指定することで実現されています。
ALT="人形で遊んでいる女の子" |
解説ウインドウが開くようにする |
スクリーンリーダは、このALTで指定されているテキストを読み上げます。しかし、もうちょっと長い解説をALTタグで説明しようとすると、場合によってはテキストがページを覆ってしまい、今度は晴眼者にとって大変に見にくいサイトになってしまいます。
そこで、ALTタグとは別に、詳細な解説文を書いた小さいページが開く「解説ボタン」を用意してみましょう。解説文は、色や形、デザインなど、具体的に画像がイメージができるような内容がいいですね。▼のサンプルページを開いて、「解説」ボタンを押してみてください。
まず、以下の部分を、素材を置くページの
~
タグの中に書いてください。