前回「ウェブアクセシビリティの検査にたずさわって…」 においてウェブアクセシビリティについての概要や考え方をお知らせしましたが、今回は実践的な考え方について解説したいと思います。
ウェブサイトには画像を掲載することが多いと思います。ウェブサイトに画像を掲載する場合は下記のようにHTMLのimg要素を使います。
<img src="画像のURL" alt="画像の情報" >
画像をページに表示させるためのimg要素には、画像の内容を文字で説明するalt属性を必ず使用しなければなりません。alt属性を使用することで、画像を見ることができない人にも画像の説明をすることができます。ここで注意することは、風景や装飾の画像の場合にはalt属性はalt=""というように、属性値は空にしなければなりません。風景や装飾画像の場合は視覚障がい者にとっては説明されても、必要のない情報の可能性があります。視覚障がい者はPCで情報を得るためにはスクリーンリーダーというプログラムを使用しています。サイトにある情報を得るために、風景などの装飾的な画像をスクリーンリーダーで読み上げられるのは余計な情報であると考えるべきだと思います。
したがって、装飾的な意味の画像はスクリーンリーダーで読み上げ対象となるalt属性は空にすべきだと考えます。そうすればウェブサイトでデザイン上で挿入している風景などの画像は、視覚障がい者には意味をもたない情報（視覚障がい者には画像が見えていない可能性がある）と考えて、alt属性は空にします。
一方、例えば、見出しに使用したいフォントがなかったり、ロゴなど、特定のデザインを使いたいために文字を画像にする場合があり、画像にするケースがあります。画像に文字が入っている場合は、基本的に文字情報はすべてalt属性に入れなければなりません。
<img src="画像のURL" alt="Person with a disabiliy IT Support Okinawa 就労継続支援A型・B型事業所 障がい者ITサポートおきなわ">
ただし、見出しや前後のテキストに同じテキストがある場合はalt属性との重複を避けるため、その場合はalt属性を空にします。
画像には人物写真や風景画像の他にも地図、チャート、グラフなどがあります。そのような場合は画像に含まれる文字をすべてalt属性の中に入れる、ベージ内に前後にテキストとして画像がなくても伝わる同等な情報を入れる、または別ページへのリンクでもよいので、説明するページを用意してください。
基本的な考えかたとしては、もし画像がなかったとしても、同等な情報が伝わることが大切です。このように配慮してウェブページを制作すれば、障がい者に限らずすべての人に情報が伝わると私は考えています。
画像にはalt属性は必須です。alt属性がないとスクリーンリーダーはファイル名を読み上げてしまうので、「なんとか.jpg」とか「ほにゃらら.png」とファイル名を読み上げられてもユーザーにはなんのことかちんぷんかんぷんです。画像に意味が無い場合は「alt=""」のように空のalt属性を忘れずに付加してください。
（いしかわ）