2021年4月23日 Webサイトが音声読み上げで理解できるということ

第六事業部 アクセシビリティ部 マネージャー
中村 精親

突然ですが、みなさんはWebサイトを音声読み上げで利用したことはありますでしょうか。

私は仕事柄、Webに関わる方々向けにセミナーを実施することがあるのですが、その際にこうした質問をすることがあります。すると、どのセミナーでも一定数以上、試してみたことがない、という方がいます。

そうした回答を受けて、セミナーではスクリーンリーダー(音声読み上げソフト)を利用している動画などを見てもらうことが多いのですが、そうするとどうしても目が見えない(もしくは見えづらい)利用者ばかりが意識されてしまいがちです。もちろん、重要であることは確かなので、このコラムではそれを踏まえた上で、読み上げられるコンテンツはさまざまな利用者にとって意味がある、ということをお伝えしたいと思います。

読み上げられないということはコンテンツがないも同然である

この見出しは多少誇張表現かもしれませんが、それくらい影響が大きい、と私は考えています。多くの利用者がほとんどの場合において、Webサイトを読み上げることはない、というのは現状確かだと思います。実際、私も業務以外で読み上げを使うことは多くありません。

では、どのような場合に影響が大きいのでしょうか。

当然、スクリーンリーダーを利用する目が見えない(見えづらい)利用者には読み上げられない内容は(ほとんど)伝わりません。読み上げたときに問題が大きいコンテンツにはいくつかの原因が考えられますが、やはり一般的な問題は画像の代替テキストではないかと思います。代替テキストとは読んで字のごとく、代わりになるテキストですが、画像が利用できない環境、すなわち出力が音声である読み上げの場合などに利用されます。また、画像がダウンロードできなかった場合などにはブラウザー上にもそのテキストが表示されます。

前者としての利用が多く扱われることもあり、代替テキストは音声読み上げのためのもの、と考えられがちなのですが、前述の通り、画像が表示されないような場合にも利用されます。

画像が表示されないときとはどのようなときか、これもさまざまな場合が考えられますが、特に気にかけていただきたいのが災害時です。大規模災害においては通信インフラへの影響も発生します。実際に東日本大震災でもさまざまな影響がありました。こうしたときにそもそも画像が表示されなかったり、回線を圧迫しないように画像を表示しないようにしたり、といった対応をする必要があるかもしれません。極端な例に思われる方もいるかもしれませんが、テキストベースの情報で助かった、というような話もありましたので、見た目が重視される昨今のWebサイト(といってもパフォーマンスも重視されているので状況は変わってきてはいますが)において、あらためてこのような側面から必要なテキストを正しく記載することの大切さを認識いただきたいと思います。

プログラム処理との関連性

次に、これもよく言われることではありますが、音声読み上げで利用した際に問題ない状態を目指すメリットのひとつとして、音声読み上げとプログラム処理、わかりやすい例ですと、検索エンジンなどのように特定の手順での情報処理、との関連性が挙げられます。つまり、スクリーンリーダーの利用者が理解しやすい状態になっている、ということは検索エンジンなどでも処理がしやすい、ということになるわけです。

こうした文脈では検索エンジンの話が出てくることが多いわけですが、その他にも例えば単語の間に見た目の空白があると読み上げに影響する(「東 京」とすると「ひがし きょう」などと読む)という問題は、ページ内検索において目的の単語を探し出せない、といった問題に繋がったりします。

また、こうした問題は今もっとも注目されているサービスのひとつであるRPAやDXといった分野においても影響を及ぼす可能性があります。個人的にも表が見た目だけのために調整されていて、データ的にはまったく表になっていない、というHTMLのtable要素を扱う必要がある、という状況に最近遭遇しているのですが、かなり不要な処理をすることになる見込みでさまざまなリソースを無駄にすることになりそうです。このような表も音声読み上げではかなりわかりづらいはずであり、人にとっても機械にとってもわかりづらく、ビジネス上の大きなデメリットに繋がります。

伝わらないコンテンツ

もうひとつ、音声読み上げについて、目が見えない(見えづらい)利用者のことばかりを考えてしまうとかえって適切な情報を伝えることができなくなることもある、という問題も挙げておきます。

それは音声読み上げでの読み方が正しくないので、無理やり直してしまう、という問題です。例えば、本来アルファベット表記である商品名を読み上げの部分だけカタカナにしてしまう、といった対応が挙げられます。これはスクリーンリーダーでテストするようになった担当者がよかれと思ってすることであり、すべてが問題であるというわけではないのですが、これによってスクリーンリーダーの利用者は正式な商品名を認識できない、というような可能性が出てきます。

そもそも正しく読み上げられない表記というものは画面を見ている利用者も正しく読めていない可能性があるわけであり、それを正確に伝えたいのであれば、見えているテキストも代替テキストも正式な表記と読み方を併記すればよいのです。私の名前などは最たる例であり、「精親」では読めないかもしれませんが、「精親(きよちか)」とすれば、この漢字でこう読むのだな、とわかります。これについても本コラムの冒頭にはふりがなはないわけですが、コラムを読むにあたって私の名前を正しく読める必要はないわけですので、伝えたいところで伝えたいことを見た目だけではなく表記する、ということが重要であることがおわかりいただけるかと思います。

セミナーのご案内

ということで、本コラムでは音声読み上げでの利用を意識することでコンテンツの内容の向上に繋がる、という例をいくつか紹介してまいりました。

最後になりますが、6月4日(金)に「スクリーン・リーダーで学ぶWebアクセシビリティ」というセミナーの開催を予定しています。このセミナーでは、主に冒頭でご紹介したスクリーンリーダーでの音声を聞いたことがない、というような担当者の方々に向けて、普段からスクリーンリーダーを利用している全盲のエンジニアである大塚が基本的な部分から解説をいたします。業務で大塚とコンビを組むことも多い、南との連携でまだWebの担当となって間もない、というみなさまにもわかりやすくお届けできるかと思いますので、是非お気軽にご参加ください。

本コラムでご紹介したような、コンテンツが読み上げられることによる別の側面での価値を考慮しながら参加いただくと、担当されるWebサイトでのいろいろな改善策が見えてくるのではないかと思います。

メールニュース登録

メールニュースでは、本サイトの更新情報や業界動向などをお伝えしています。ぜひご購読ください。