視聴者A： altのユーザビリティというか、代替テキストの話なんですけど、たまに仕事をしていてやっぱりこうした方がいいんじゃないのかなと思うことがあって、今日も思ったことなんですけど、テーブルとかリストを画像で提供する場合があるじゃないですか。それはちょっと問題あるんじゃないかなと思うのは、その内容全てaltだけで処理するサイトが度々あるんです。まあaltが提供されているだけで優秀だとは思うんですけど。
でも自分の場合はやっぱりaltは空欄で提供して、その形にあったタグを使って、例えばリストを画像で処理するんだったら、リストだったり、テーブルだったりを実際にタグとして提供してそれをCSSで隠すみたいなやり方で提供した方がやっぱりスクリーンリーダーの使用者もユーザビリティが上がるんじゃないのかなと思うんですけどね。
伊原： 僕であればそれは画像化しない方向にしたいと思いますけどね。 そもそも、そのリストとテーブルをちゃんとスタイリングして見える形でおいて画像化しないっていうのがおそらく一番良いのかなと思いますね。
視聴者A： まあそれは当たり前なんですけどね。やっぱり自分は検収をしてる側なんですけど、制作者ではなくて。そういうサイトは本当に見ませんよね。すべて画像で処理して画像で処理した方が作りやすいですし、なんか1枚画像貼ればそんなに高度じゃなくてもいいみたいな認識があるのかもしれませんね。
齋木： あの代替テキストの関連の質問って他にも結構来てまして、いくつかちょっとまとめて読み上げます。
img 要素の alt 属性（代替テキスト）と figcaption 要素の使い分けってどうしてますか？ figcaption に書くなら、alt 属性に書かなくてもいいのかなと思ったりします伊原： これは長くなりそうですが、原則としての話と現場はそうはいかないんだよという話になります。
伊原： まず僕が考えている原則をお伝えします。
なるべく本文にちゃんと書く。さっきの例で言えば、ちゃんと文章でわかるようにするとか、テーブルとかリストはちゃんと見える形で、table 要素とか ul とか ol とかいう形でマークアップしておく。これが原則です。
**視聴者A：**画像でごまかさずちゃんとセマンティックタグで提供するということですよね。
伊原： そうですね。なので、原則ですよ？原則は、ウェブページとして出すということは、ウェブページの前提としてはHTMLでまず出すということがあるわけなので、画像として出すというよりもHTMLで出すということが最優先でそれで伝わるようにした上で、画像というのはさらに補足として視覚的にわかるとよりわかやすくなるっていう意味において挿入していく。そういう順番で考えた場合、おそらくその画像の alt っていうのはだいたい「図」とか「写真」だけで済むはずです。
視聴者A： もしくは背景とか装飾のための画像はやっぱり alt を空欄として提供するべきでしょうしね。
伊原： そうですね。ただ補足として意味を持つ画像であれば図とか写真っていう、そこに画像がありますと。その内容に関してのキャプションがついていたりとか、本文で説明していたりということで、つまり逆に言うと代替テキストというのは画像が見えてる人には見えないわけですよ。デベロッパーツールとか使えば見えますけど、普通に見てる分には見えないものなんですね。その情報っていうのをいっぱい書くぐらいだったらちゃんと全員が見えるところに置いた方がいいというのが私の考えです。原則としては僕はそう考えています。
伊原： ただほとんどの場合はデザイナーがデザインしてきて、その画像だけがポーンて置いてあるようなケースにおいてどうしたらいいのかとか 、あとはその写真に対しての代替テキストっていうのを本文にはあまり説明がない中でどこまで書くのかみたいな話にやっぱりなると思います。
写真の説明とかもその情景の描写とかをどのぐらいするのかっていうのもあるんですけども、やっぱり根本的にはその感覚としてのその視覚なのかテキストなのかっていうその情報の伝達の能力が違うメディアを使って伝えようとすることなので、完全に説明することは全然できないんですよね。その時にどうすべきかっていうのは、やっぱりその写真の意図をどう伝えるかということだと思うんです。 よく言われるのは電話で説明しようとした時に、どう説明しますかってことを考えましょうっていうことです。僕が思っているのは、その写真を電話でどう伝えるかっていうことではなくて、そのページの内容を電話でどう伝えるかという時に、その写真の時は何ていうふうに言うだろうって考えるべきだろうと思ってるんですよね。
というのは、その写真そのものを解説するっていうことではなくて、その写真や図はそのページの途中に挟まれてる意味っていうのがあって、その意味が伝わることが必要なことだと思うんですよ。なのでそこは客観的にこういう画像ですっていう説明というよりは、僕はそこの alt においてはそのページのコンテンツとして伝えたい意図っていうのは、その文脈の中で何なのかっていうのを考えた上でその代替テキストを書くっていうふうにした方がより伝わる可能性は高いんじゃないかなと思います。
そういうのを実装者が考えるんですかっていうとやっぱり原則としてはそれを実装者が考えるものじゃなくて、コンテンツを作る人が本当は考えるべきものだと思います。 その時に見えることだけを前提にしてコンテンツを作るっていう風にしてしまうと、それはウェブコンテンツを作るそのコンテンツの作り手としてはちょっと不足していて、やっぱりいろんな状況がある中であの伝わるようにコンテンツを書くっていう前提をやっぱり持つ必要があるだろうなというにふうは思っています。
ここまで、「いや現場そうはいかねぇんだよ」って話はあまり気にせずにしゃべるとそういうことです。 僕が前にいた会社ではお客さん原稿作る人にそういう説明を先にするっていうアプローチをとってました。 ので、先に作られてしまったらもう負けなんですよ。
村上： 負け…！
伊原： 負けですけど基本的には後手に回ったら負けで、ウェブサイトっていうのはこういうものなんですっていう話をしたりとか、お客さんの中では最初は PDFでプレスリリース出してたんだけども、あの前の会社で一緒に仕事をして最終的には ウェブページから先に作ってPDF化するっていう流れになったんです。逆になったんですよね。 だからまあそういう「現場はそうはいかねえんだよ」に対しては、先手を打つための闘争をするっていうことがあのアプローチになるんだろうなと思います。
視聴者A： あ〜検査する側としてはどうしようもありませんね。こっちはただ検査して問題点を指摘して報告書を出すだけなので。
伊原： そうですね、だからやはりそこはお立場のことを全然配慮せずに言うと、そこだけではカバーしきれないっていうのが事実としてあるとは思っています。 やっぱり頼む側の意識っていうところに最終的には行ってしまうと思いますね。