情報が伝わるHTMLメールを目指しませんか？

普段私は、Webアクセシビリティについてセミナーなどでお話しする際、アクセシビリティ対応とはスクリーン・リーダー^※等の利用者だけを対象としたものではないことを強調するようにしています。全盲の私がスクリーン・リーダーを操作しながらアクセシビリティ対応についてお話しすると、聴き手の方々には障害者にも利用しやすい、音声で読みやすいWebサイトを作ることがアクセシビリティ対応だという印象を与えてしまうような気がするからです。

とはいえ、アクセシブルなコンテンツが増えることは、普段の生活の中でコンピューターやスマートデバイスのスクリーン・リーダーを頻繁に使用している一個人としての私にとってもうれしいことなので、本稿では私の最近の関心事であるHTMLメールのアクセシビリティについて書いてみたいと思います。

HTMLメールにおけるスクリーン・リーダー利用者のメリット

様々な製品やサービスを紹介するために発信されるメールマガジン、今日ではWebサイトと同じようにHTMLで記述されているものも少なくありません。対応しているメールクライアントであれば、スクリーン・リーダーの利用者にもWebサイトと同じように閲覧できます。

HTMLで記述されているということは、Webページと同じように見出しやリストなどの文書構造を表現できるので、画面上で製品やサービスを魅力的に表現できるだけでなく、本来はスクリーン・リーダーを使っている私たちも、目的の情報を効率よく探すことのできる可能性を持っています。

ところがこのHTMLメール、Webページのようにアクセシブルに作られていないことが多々あります。その結果、目的の情報を探すのに時間がかかってしまったり、場合によっては本文から情報が読み取れないものもあります。スクリーン・リーダーを使っている立場で言えば、一昔前のWebページを読んでいるような気分になるものが少なくないのです。 具体的にどのような問題に遭遇するのか、いくつか例を挙げてご紹介します。

必要な情報が読み上げられないケース

毎日私のメールボックスに届くHTMLメールの中には、件名に『新型○○新発売！』とか『抽選で10名様に商品券をプレゼント』のような、私が気になる文言を含んだメールが少なくありません。しかしながらメールを開いてみると、本文では件名に書いてあったような情報が全く読み上げられないものがあります。実際に情報はそこにあるのですが、画像で提供されている情報に代替テキストが設定されていないようなケースがこれに該当します。 やや大げさかもしれませんが、メール本文で探している情報がみつからない（読み上げられない）ことで、利用者はそのHTMLメールの発行元からのメールには有益な情報がないと判断し、2度と開かなくなってしまうかもしれないのです。

メール本文の画像に代替テキストを提供することで、スクリーン・リーダーの利用者はもとより、初期状態ではHTMLメール内の画像を表示しないメールクライアントを使用している人や、何らかの理由で画像を表示することなくメールを読んでいる利用者にも情報を届けられるというメリットがあります。

文書構造が適切にマークアップされていないケース

先にも述べましたが、私たちスクリーン・リーダー利用者にとってのHTMLメールの魅力の一つは、文書構造を利用して目的の情報により効率よくたどり着けることです。例えば、メールの先頭に目次があり、各項目の見出しがh要素を用いてマークアップされている場合、目次を読んだ後に見出しへのジャンプコマンドを使用することによって、読みたい項目の先頭に移動することができます。先頭の目次がリスト項目としてマークアップされていれば、そのメールに含まれているトピックの項目数をリスト項目の数の通知で知ることもできるかもしれません。

ところが、HTMLメールの中には、見出しの項目の先頭に■記号を置くことで見出しを表していたり、目次の項目の先頭に・記号を置くことでリストを表しているようなものが少なくありません。これも一昔前のWebサイトの情報発信の方法によく似ており、残念ながらHTMLメールのメリットを十分に生かすことができていないと言わざるを得ません。

リンク項目があいまいなケース

メールマガジンの中には、メールの本文には商品やサービスの概要を記載し、詳細はリンク先のページで紹介しているものがあります。そして、その詳細ページへのリンクのテキストが、「こちら」や「詳細ページへ」とだけ書かれているものも少なくありません。中には、すべてのリンク項目が「こちら」としか読まれないものもあります。

もちろん、目的の情報を得ることができるまで、それぞれの「こちら」と書かれたリンクを開いていくことはできますが、あまり効率の良い情報アクセスの方法だとは言えません。 余談ですが、すべてのWebページのリンクテキストを「こちら」や「詳細」とだけ記述している場合、アクセシビリティチェックでは問題点として指摘されることがあります。

その他の問題点

私のメールボックスに届くHTMLメールには、このほかにも次のような問題を含んだものがあります。

• 画像リンク項目に代替テキストが指定されていない
• 画面のレイアウトを整えるための空白画像に「spacer.gif」等の代替テキストが指定されている
• 装飾目的の画像に「icon.gif」などの代替テキストが指定されている

HTMLメールをアクセシブルにするには

私がスクリーン・リーダーでHTMLメールを読んだ時に気がついた問題点をいくつか書いてきましたが、どうすればこれらの問題を解決できるのでしょうか？

もうお気づきの方もいらっしゃるかと思いますが、HTMLメールを作成する際も、Webサイトと同じようにアクセシブルなコンテンツを制作することを心がけていたくことがもっとも重要かつ簡単な方法です。

とはいえ、現状のメールクライアントではWebブラウザーと同程度に標準的な技術を使用できるわけではないので、情報表現のためにテーブルレイアウトを使用するなどの対応が必要なことも事実です。

まずは、画面上で魅力的なコンテンツを発信できるHTMLメールは、スクリーン・リーダー利用者にとってもアクセシブルな情報源になりうることを認識していただき、今後のコンテンツ発信に生かしていただけますと幸いです。 近い将来、より多くのアクセシブルなHTMLメールが、私をはじめとしたスクリーン・リーダー利用者のメールボックスに届くようになることを願っています。