XHTMLのマークアップは、人間的な判断に負うところが大きい。その最たる例が画像の代替テキスト（img要素のalt属性値）だ。代替テキストの構文上の注意点や、どのように工夫すればユーザーにとって理解しやすくなるかを考えてみよう。
画像（img要素）のalt属性は必須か？
画像（img要素）のalt属性値は、「代替テキスト」（alternartive textまたはalternate text）としてよく知られている。制作現場では、属性名のつづりから「オルト」と呼ばれるのが一般的だ。
Webをさまざまな環境で利用してもらうためにも、「代替テキストをつけるのは当たり前」という認識が広がっているのは望ましい傾向だ。Webページはビジュアルブラウザだけでなく、音声ブラウザやテキストブラウザなど、グラフィカルな表示・表現ができないソフトウェアでも閲覧され、またビジュアルブラウザであっても、画像読み込みをオフにして設定してブラウジングしているユーザーがいることを考えれば、画像の代わりとなるテキストを指定する意味は大きいからだ。
だが、ここで立ち止まって考えてみよう。そもそも、すべての画像にalt属性を指定しなければならないのだろうか？ 状況によっては、指定しなくてもよいのではないか？
答えは、どのような場合であっても、img要素には必ずalt属性をつけなければならない。HTMLでもXHTMLでも、img要素ではsrc属性とalt属性が構文的に必須（required）とされており、もし指定されていなければ構文エラーとなる。
混乱しないように気をつけなければならないのは、「属性」と「属性値」という言葉の違いである。alt属性は必須、alt属性値は任意のテキストでよい（空でもよい）ということだ。
音声読み上げの必要がない装飾目的の画像であっても、alt属性を指定したうえで、値を空にする（alt=""）のが一般的なマークアップ実務だ。ユーザーエージェントの挙動を考えても、alt属性が指定されていない場合は、ファイル名（たとえば「graph_001_005.jpg」）などユーザーにとって理解困難な内容が表示・表現されてしまうことが多いことも覚えておこう。
まとめると、画像にはalt属性をきちんと指定しつつ、適切な内容を値として指定する（装飾目的画像など不要であれば空にしておく）ことが大切だ。W3C仕様でも、alt属性値はきちんと意味のある内容にすること、必要がなければ空にすることを要請している。
代替テキストのベタープラクティス
代替テキストにはどのような内容を指定するのが望ましいのだろうか。W3C仕様では、alt属性は「short description」（短い説明）と定義されている。何をもって短い（あるいは長い）とするのだろうか。この判断はかなり感覚的なものにならざるをえないし、むしろ人間の感覚的な判断こそが適切な代替テキストの基本になるといってよい。「感覚的」を「常識的」と言い換えてもよいが、とにかく一定の基準はない。端的で、ユーザーにできる限り理解しやすいテキストにする、ということである。
では、ユーザーに理解しやすいテキストにするには、どのようなコツがあるだろうか。まず「short description」という定義のとおり、短い説明にすることである。これは、多くの人が心がけているだろうし、画像によっては少し長くなってしまうかもしれないが、すでに述べたとおり、常識的な範囲であれば大丈夫である。
大切なのは、どのような画像かをまず示し、内容の説明に入ることである。たとえば、写真、ロゴ、イラスト、円グラフ、棒グラフ、フローチャートといったように、ひとくちに画像といってもさまざまな種類がある。まずそれを示し、内容の説明を含める。
「2007年夏、沖縄旅行で撮った海」の写真に代替テキストを指定すると考え、「まあまあの内容」と「よい方法」を比較してみよう。
|
画像の種類を最初に示すメリットとして、音声読み上げを考えた場合、「まあまあの方法」は最後まで読み上げられないとその画像が何を目的として掲載されているのかが分からないのに対し、「よい方法」は最初に「写真」と読み上げられるため、「風景を伝えたい」「人物を伝えたい」といった意図がまず伝わり、後の説明の助けとなることがあげられる。
グラフを考えてみると、このメリットはいっそう顕著になる。
|
読み上げ途中で「その画像が何を示したいのか」とユーザーを戸惑わせてしまうよりも、はじめに意図を伝えたほうがユーザーの迷いは少ないといえる。
ここで、どちらの代替テキストでも大差はないと思った人もいるだろう。しかし、視覚障がい者にも先天性と後天性が存在することを意識してほしい。先天性の場合は、もしかしたら画像の意図がうまく伝わらない可能性もあるが、後天性の場合（つまり、事故や病気などで視力を失ったが、それまでは視覚的に情報を得ることができたため、さまざまな画像の種類を頭のなかでイメージし区別することができる場合）、意図がうまく伝わる可能性が高い。
それでも、代替テキストでは「完璧」ではない
以上、代替テキストとその工夫の大切さを説明したが、代替テキストそれ自体が「完璧」ではない点を忘れてはならない。img要素では、alt属性とともにtitle属性（補足情報）やlongdesc属性（詳細説明へのURL）が指定できるが、ブラウザがどのように表示・表現するか（ビジュアルブラウザでのツールチップ表示、音声ブラウザの読み上げ対応など）は一様ではなく、過度な期待はできないと考えてよい。では、alt属性や他の属性の不完全さを乗り越える方法はないのだろうか。
実は、まったくないわけではない。その方法は次回に説明しよう。
|
