Googleが推進するウェブ高速化フレームワークのAMPが電子メールに対応、2018年後半にGmailにも導入へ

複数の最適化処理を組み合わせることで、モバイル端末でのインターネット体験をより高速かつ快適にするフレームワーク「AMP」を生み出したAMPプロジェクトが、新たに、電子メール向けに機能を拡張した「AMP for Email」を発表しました。

Bringing the power of AMP to Gmail
https://www.blog.google/products/g-suite/bringing-power-amp-gmail/

モバイル向けウェブページの表示速度を高速化するため、2015年に策定されたオープンソースのフレームワークが「Accelerated Mobile Pages(AMP)」です。AMPがどのようなものなのかは以下の記事を読めばよくわかります。

待ち時間なしでモバイルページを表示できる新規格「AMP」でモバイルネット体験が超快適に - GIGAZINE

ウェブサイト運営者を手助けするためにスタートしたAMPですが、誕生から2年以上が経過して機能は徐々に拡張されており、今ではウェブページを構築するための最良の方法のひとつとなっています。ウェブサイト関連で大きな成果を残すことに成功したAMPは、さらにユーザーのインターネット体験をより良いものにすべく、「電子メールの近代化」に取り組むことを決定したとのこと。

そして誕生したのが、AMPのパワーをGmailのような電子メールサービスに導入する「AMP for Email」で、よりインタラクティブで実用的な電子メール体験を開発者が作成するための「強力な手段になる」とGoogleは記しています。

実際に「AMP for Email」の誕生で、電子メール上でさまざまなタスクが完了可能になります。一体どういうことかというと、例えば複数人に向けて何かしらのイベントの出欠確認を行う際、通常は出欠管理ツールを用いて出欠確認を行います。この場合、幹事役の人はわざわざメールで候補者にURLを送信し、候補者側はURLをクリックしてウェブページへ飛び、そこで出欠情報を入力する必要があります。しかし「AMP for Email」を使えば、わざわざ本文中のURLを開かなくても、メール上で出欠情報の入力を済ませることが可能です。

Googleによると、インターネット上では毎日2700億通以上のメールがやり取りされており、その中でフライト情報をチェックしたり、ニュースをチェックしたり、何かしらのアイテムを購入したりと、ユーザーはさまざまなアクションを取っています。「AMP for Email」はメール上の情報をより簡単に最新状態に更新できるようにすることで、「メールの内容が古くなってしまっている」といった事態を防ぐこともできるようになるとのこと。

既にPinterest、Booking.com、Doodleといった企業が「AMP for Email」を導入しており、実際にメール上でどんなことができるようになるのかがよくわかります。

Pinterestではメール上でアイテムの確認・保存ができます。


Booking.comではメール上でホテルの写真をチェックするだけでなく、最新の空室状況を確認することも可能。


Doodleでは出欠確認の連絡をメール上から選択可能になっています。


記事作成時点では「AMP for Email」の開発者向けプレビュー版が公開されており、Googleは2018年後半にもGmailで「AMP for Email」をサポートすることを明かしています。Gmailでデベロッパープレビュー版の「AMP for Email」を利用するにはBringing the power of AMP to emailにアクセスしてサインアップすればOK。また、導入アイデアがイメージできないという人向けにG Suite Developers Blogで作例が公開されています。

なお、AMPはオープンソースのフレームワークなので、ソースコード共有サイトのGitHub上で公開されており、「AMP for Email」については以下のページで解説されています。

AMPHTML Email · Issue #13457 · ampproject/amphtml · GitHub

記事作成時点で「AMP for Email」が対応しているのは以下の通り。

動的コンテンツ
・amp-form
・amp-selector
・amp-bind & amp-state
・amp-list
・amp-mustache

プレゼンテーション
・amp-accordion
・amp-carousel
・amp-sidebar
・amp-image-lightbox
・amp-lightbox
・amp-fit-text
・amp-timeago

メディア
・amp-img
・amp-anim