先日Twitterを眺めていたら、このようなエントリーが流れてきた。
とても共感と興味を抱かせる記事である。それとともに、日常的にWebから情報を得ている視覚障害者として、画像の代替テキストにどう向き合っているのかを、いっちょ考えてみようかと思ったりもしたのであった。
Webアクセシビリティで重要な要素と言われている「代替テキスト（Altテキスト）」。
HTMLタグでいうところの「<IMG SRC=‘画像ファイル名’ ALT=‘代替テキスト’>」ってやつである。代替テキストの機能や意味などについては調べていただくとして（例えば
ここや
ここなどが参考になるかも）、ほぼ全盲、スクリーンリーダー使いの筆者の立場で代替テキストについて、つらつら書いて見タイと思う。
なおここではスクリーンリーダー使いの一人としての個人的な見解を示すもので、一般的なセオリーとは外れているかもしれないが、その辺りは適当に流していただきたい。
現状と視覚障害者にとって代替テキストの持つ意味
正直なところ、Webを読んでいて代替テキストで画像の情報がしっかり伝割ってくると感じるケースは、かなり少ない。まず第一に、
・代替テキストが省略され、画像ファイル名を聞かされる
・代替テキストが空やブランクで「イメージ」としか読まない
・記事タイトルなど画像の説明になっていない内容で埋められている
……といったページが今だに、圧倒的に多い。
そもそもスクリーンリーダー使いにとって、代替テキストはどのような意味を持つのか。それは、晴眼者がWebを読むとき、イメージがコンテンツに与える影響と原則的には変わりない。
美しい風景写真が掲載された旅行記なら、そのようなイメージを思い浮かべて記事を読み癒されたりするし、クールなガジェットの紹介記事も、スタイリッシュな新製品を手にしている自分を思い浮かべながら記事を読みたいのである。
それはイメージを目で見るのと、説明文を音声を通じて聞き、脳内にイメージを展開させるだけの差でしかない。
すべてのイメージが失われたWeb記事を想像してみて欲しい。それはとても味気ないものだ。スクリーンリーダー使いにとって、代替テキストが用意されていない記事は、とても退屈だ。
もちろんテキストだけで心を動かされる記事もたくさんあるのはいうまでもない。あ、筆者のブログのことでは決して無い。
大前提として勘違いして欲しくないのは、視覚障害者は、そのイメージの「正解」を求めているのではない。そもそもそのようなことは無理だし、正解を確認する手段は皆無だ。
知りたいのは、その記事が何を伝えようとしているか。そのメッセージを余すことなく受け取りたい。他の読者と体験を共有したいのだ。
説明すべきイメージを乱暴に分類してみる
代替テキストについて考えるにあたり、Webで扱われるイメージを、乱暴ではあるが３種類に分類してみた。もちろん、あくまでも筆者の独断と偏見によるものであることをお断りしておく。
1.意味を持たないイメージ
2.見れば意味が伝わるイメージ
3.みただけでは説明不足なイメージ
以下、それぞれのイメージについて、どのような代替テキストがベターなのかをぼんやり考えてみたい。
1.意味を持たないイメージ
罫線や飾りボタンなど、情報を持たないイメージ。これはセオリーとしてALTを空にするよう推奨されている。
個人的には、そもそもこのようなイメージはあまり入れて欲しくないのだが。
また、主に記事の冒頭にアイキャッチ的に使われるイメージで、ストックフォトからの写真やロゴマークなどの本文とは直接的に関連性が低いものも、意味を持たないイメージと考えている。
正直スクリーンリーダー使いには混乱の元になる。「これはイメージ画像です」みたいな代替テキストを入れておいてほしい。
2.見れば意味が伝わるイメージ
人物や風景など、見た目一発で情報が伝わるイメージ。
メニューや共有ボタンのイメージなどもこれに含まれるだろう。
ボタン類は別として、記事中にあるイメージで、本文やキャプションで説明すると「くどい」感じになるもの、要するに晴眼者にしてみれば「見ればわかるし。」的な説明は、代替テキストでの説明が効果的だしアクセシブルと言える。
例えばインタビューの記事では、たいていインタビュー対象者の写真やインタビュー中の様子が掲載されている。このような場合、どのような代替テキストが入っているとわかりやすいか。もちろん筆者の個人的な印象であるが。
これが「男性の写真」や、セオリーとも言える「肩書きと名前」だと、あまりイメージはわかない。特に肩書きは記事本文で記載されることが多いため、代替テキストとしては余分な情報に感じてしまう。
ではイメージが膨らむ情報とは？
それはその人物の佇まいの説明ではないかと思う。例えば「スーツ姿でチェックのネクタイ、黒縁の眼鏡」や「デニムに黒のニット、明るいカラーのロングヘアー」など、その人物の写真から得られる特徴を説明してくれると、以後のインタビュー記事で、どのような人物が話しているかを想像することができ、記事の内容に膨らみが生まれてくる。ちょっとした情報でも、有るのとないのとでは、記事の印象は大きく変化する。
もちろんこのような説明は最初の写真だけに含まれればよく、以降は名前に加え表情など記事の流れに即した説明がされていれば良い。
この手法は、ラジオ番組ではよく用いられる。ゲストを呼ぶコーナーでプロフィール紹介をした後に、その人物の服装や特徴をふんわりと説明すれば、リスナーは、以後その人物を思い浮かべながら放送を楽しめる。テレビならみればわかる情報も、ラジオではあえて説明することでイメージが膨らむのである。ましてやWebは「声」という手がかりも無い訳で、画像の説明はより重要となってくる。
もちろん、何でもかんでも説明すれば良いというわけではない。背景の壁紙の模様やテーブルに乗っている飲み物の種類、窓から見える風景など、記事と関連性の無いものの説明はむしろノイズにもなりうる。繰り返すが、視覚障害者は写真の正解は求めていない。
もう一つ付け加えるなら、イメージを脳内再生するにあたり、それがどのような種類のイメージなのかを説明することも重要ではないかと思う。
「写真」なのか「イラスト」なのか、それとも「スクリーンショット」？ 「表」や「グラフ」など。
同じ猫のイメージでも、写真とイラストでは、印象は大きく変わってくるからだ。
3.みただけでは説明不足なイメージ
被写体そのものを説明するのではなく、ある状況を切り取ったイメージは、一見しただけでは意味が伝わりにくい。たとえばイベントのステージ写真や、PCやスマホのスクリーンショット、ガジェットのギミックを説明する写真などは、イメージだけでは意味が伝わりにくい。写真のどこに注目すべきなのか判別しにくいためだ。
Web記事ではこのようなイメージの説明を本文中に入れ込む場合が多いが、その内容をイメージの代替テキストに入れてしまうと、本文と代替テキストで同じ文章が繰り返し読まれ、非常にわかりにくくなる。
解決策の一つとして考えられるのは、本文での説明を簡略化して、イメージの意味伝達をキャプションで行う手法だろう。イメージにキャプションが添えられていれば、視覚障害者、晴眼者にかかわらず意味が的確に伝わりやすくなる。
もちろん先述のように本文と代替テキストが被るといった現象も軽減するだろう。本文とキャプションが被っていたら、一般読者にもくどい記事になるからだ。
キャプションを使う場合のイメージの代替テキストは、可能であれば前項（2.）に即していれるのが望ましいが、「○○イベントのステージ写真」「設定画面のスクリーンショット」「○○ガジェットの製品写真」のようなシンプルな表記の方が、場合によっては理解しやす苦なるかもしれない。
要するに、代替テキストで「何が写っているのか」を、キャプションで「写っているものの状況」を説明する感じだ。
今の所、Web記事を読んでいて、イメージの情報が的確に伝わってくるのは、やはりキャプションを使用したものが多い印象を持っている。
まとまらなかったが、まとめ。
どうも、思いつくまま代替テキストについて書いたが、まとまらなくなってしまった。もう眠い。
スクリーンリーダー使いの一人として、どのようなコンテンツが理想的なのだろう。考えれば考えるほどわからなくなってくる。
どこまで細かく説明すべきか、表やグラフなどの説明はどうあるべきか、抽象的なイメージは？ など、イメージをテキストで説明するのは非常に難しい問題だ。
スクリーンリーダーのユーザーでも年齢層や、視覚障害を持った時期によっても代替テキストから受け取る情報は異なるはずだ。
一つ言えるとしたら、代替テキストは、ただ「ALT=」に何かを入れればアクセ渋るになるものではなく、むしろ情報をいかに伝えるかといったコンテンツ制作側のセンスによって、その効果が大きく左右されるもののような気がする。
そう考えると、一筋縄ではいかないジャンルであることだけはわかった。
冒頭でも述べたが、現状では、的確な（もしくは情報を伝える意思を感じる）代替テキストは、まだまだ少ない。
より良い代替テキストとは何か？ コンテンツ提供サイドに頼るだけでなく、スクリーンリーダー使いの立場からも、常に考えながらWebと接していく必要があるのかもしれない。
今後は機械学習による自動テキスト付与などの技術も普及しつつあり、そちらとの兼ね合いも注目だ。
視覚障害者の脳内に、Webの豊かな世界が少しでも多く注ぎ込まれますように。
