GmailやInboxなどのグーグルの電子メールサービスやアプリを使うと、メールによっては、荷物のトラッキングやURLなどがタイトル部分に表示されることがあります。また、Google Nowなどもメールの内容の一部を通知としておしえてくれることもあります。メールには、Spamから個人的なやりとりまでさまざまなものがあるのに、どうして特定のメールだけこのようにメールに関連したアクションを取り出せるのでしょうか? その秘密は、「Email Markup」にあります。

簡単にいうと、Email Markupは、HTMLメールに組み込まれた特別な形式のデータで、メールクライアントは、これを見て、メールの目的などを理解し、必要に応じてメールメッセージに「ハイライト」をつけて目立たせ、関連する「アクション」起動するための「ボタン」や「リンク」を表示します。これにより、オンラインショッピングや何かの予約、SNSの友達申請といったメッセージを見逃すことがなく、また、メール表示から離れることなく、必要なアクションを起動できるようになります。

図01は、Googleから来たメールをInboxで表示させたところです。本文の前に注文品の表示などがありますが、ここが「ハイライト」で、メール本文に組み込まれた情報から自動的に生成された部分です。また、ここにある「Track pacage」というリンクがアクションになります。これは、クリックすれば、運送業者の荷物追跡のページが開きます。また、Gmailでは、一部のマークアップに対応して、アクションに対応したボタンを表示します(図02)。

図01: Inboxアプリで、Google Playの買い物メールを受信したもの。Email Markupにより、本文にはない「ハイライト」や「アクション」が表示されている

図02: Gmailでは、アクションを示すボタンが表示されるようになる。これは、チュートリアルのサンプルを受信したときのもの

このEmail Markupは、現時点では、Googleのみの機能ですが、Schema.orgが定義するHTMLへの意味情報の付加という仕組みの中で仕様を確定させつつあり、Schema.orgとして仕様が確定すれば、同グループに参加しているYahoo!やMicrosoft(Bing)といった企業でも利用できるようになる可能性があります。

Email Markupは、HTMLメールの中にスクリプトタグやメタタグ(HTML5で導入)などで、文字情報にコンピューターが解釈しやすい形で意味づけを行います。例えば、メール中の数字の並びは、電話番号かもしれないし、荷物のトラッキング用の番号、オンラインショッピングの購入番号かもしれません。また、「PCオンライン」という単語は、インターネット上のサイトの名前かもしれないし、単にPCがインターネット接続しているという意味で使われているかもしれません。同様に人の名前や固有名詞なども、人間は、文章やメッセージのやりとりの中でここに区別することができますが、コンピュータには、単なる文字列でしかありません。

図03は、実際にグーグルから来たメールの一部を取り出したものです(個人情報などは改変してあります)。ここで、マーカーをつけた部分がEmail Markup固有の表示です。Schema.orgでは、HTMLへのマークアップの組み込みにいくつかの方法が選択できます。そのうちのSchema.orgが推奨する方法が「マイクロデータ」と呼ばれる方法で、このEmail Markupは、マイクロデータ形式でHTML内に埋め込まれています。

図03: 図01のメールに含まれているHTML形式のメール本文(抜粋。プライバシーに関わる部分は省略または書き換えしてあります)。マーカー部分がEmail Markupのマイクロデータ

利用するタグは、HTMLで定められたものですが、「itemscope」、「itemtype」や「itemprop」といったアトリビュート（タグ自身に設定される情報）を使い、情報を組み込んでいます。また、HTML5で導入されたmetaタグを使うのもマイクロデータの特徴です。

まず、「itemscope」、「itemtype」で対象がどの分野の情報であるのかを指定します。図03の2行目にある「http://schema.org/ParcelDelivery」は、以下の情報がSchema.orgで定義されている「荷物の配達」に関係する情報であることを示します。divタグは、HTMLの中の範囲を示します。図にはありませんが、このタグが「</div>」で閉じるまでの間、マイクロデータは荷物の配達に関係していることになります。

「itemprop」は、プロパティ名を示し、場合によっては、contentで直接内容を指定します。4行目の「itemprop="carrier"」は、spanタグで指定するものが「運送業者」であることを示すものです。ここにも「itemscope」、「itemtype」があります。これは、囲まれた部分が「組織関連」の情報であることを示すもので、「運送業者」が「Yamato」であることを示しています。

HTMLの記述に詳しくない方のために解説しておくと、divタグは、行単位(範囲内に改行がある)、spanタグは文字単位(内部で改行しない)の範囲を示す場合に使います。つまり、HTMLページの縦方向に範囲を指定する場合にはdiv、1行内で横方向に範囲を指定する場合には、spanタグを使います。

Email Markupには、このほかにスクリプトタグを使い、JSON形式でデータを埋め込む方法もあります。こちらは、どちらかというと、JavaScriptを使うクライアントアプリ向けです。マイクロデータは、HTMLをDOM(Document Object Model。HTMLデータをオブジェクトのツリーとしてアクセスする方法)で見ていくようなクライアントアプリに向いている方法です。

ただし、Email Markupは、ある種の危険を持っています。たとえば、Spamメールに危険なURLを含む「アクション」が定義してあったら間違ってクリックしてしまう可能性は低くありません。このため、Googleでは、Email Markupを認識するドメインを登録制(写真01)として、さらにDKIM(※注01)やSPF(※注02)などによりメールが正しいドメインから送信されたことを証明することを要求しています。

写真01: Email Markupを利用するには、Googleに登録を行う必要がある。登録は、こちらのページで行い、フォームに記入する

なので、個人が適当にEmail Markupを作って送ることはできないのですが、開発者向けのチュートリアル(写真02)にあるように、GoogleのApp Script(写真03)を使うと、自分のGmailアカウントから自分に自身に対してのみ、Email Markupを含んだメールを送信することが可能です。チュートリアルでは、HTMLファイルの送信のスクリプト(写真04)と、送信するHTMLファイル(写真05。メール本文になる)を作成しています。HTMLやJavaScriptに慣れていればそれほど難しいものではありません。HTMLファイルをいろいろと書き換えて試すことができます。

写真02: Email Markupをとありえず試すなら、チュートリアルのページにあるように、Google Apps Scriptを使ってスクリプトと送信HTMLファイルを作る

写真03: Google Apps Scriptサイトは、Googleサービスの1つで、JavaScriptを登録してさまざま処理が可能

写真04: Google Apps Scriptで送信用のスクリプトコードを登録。これは、単にメールを送るためのものなので、意味がわからなくても可

写真05: メッセージの本文になるHTMLファイルを作る。こちらは、Email Markupの仕様にしたがって記述する
※注01: Domainkeys Identified Mailの略。電子署名を使うメールの送信ドメイン認証方式の1つ。宛先のメールサーバーは、DNSサーバーを使って送信元のドメインが正しいものであるかどうかを検証する。
※注02: Sender Policy Frameworkの略。宛先のsmtpサーバー(メールサーバー)は、smtpによる通信が開始されたとき、メールの送信元が送信元ドメインのDNSサーバーに登録されているIPアドレスかを確認する。これにより、送信元を詐称してsmtp通信を行うことができなくなる。

関連リンク

■連載バックナンバーはこちら