Smart Communication Design Company
ホーム > ナレッジ > Blog > フロントエンドBlog > 2018年5月 > AMP for Emailに期待できる新たなメール戦略

フロントエンドBlog

Webのフロントエンドを構成する技術、特にHTMLやCSS、JavaScript、またそれらに関連する話題を扱うBlogです。

AMP for Emailに期待できる新たなメール戦略

UI開発者 木村

2018年4月末に東京でAMP Roadshow Tokyo、5月上旬にアメリカのカリフォルニア州でGoogle I/O 2018が開催され、AMPの新機能や、新たな活用方法などが発表されました。

その中でも特に注目しているのが、2018年中にGmailでサポート開始予定のAMP for Emailです。

AMP for Emailでは、AMP HTMLでHTMLメールを実装することで、従来のHTMLメールでは実現できなかった、インタラクティブな機能やリアルタイムなコンテンツの表示が可能となります。

これまでEメールは、Webサイトへの誘導としてよく使用されてきましたが、AMP for Emailを使用することで、よりWebサイトに近いユーザー体験や、鮮度の高い情報を提供できるようになります。

AMP for Emailで実装可能になること

インタラクティブなコンテンツの実装

AMP for Emailでは、いくつかのコンポーネント(amp-carouselamp-lightboxなど)が使用できるため、Eメール内にインタラクティブな機能(カルーセルやライトボックスなど)の実装が可能になります。

さらに、コンポーネントに状態を持たせたり、コンポーネント同士を連携させるamp-bindも実装予定のため、アイデア次第では独自性の高い機能も実装できるようになりそうです。

リアルタイムなコンテンツの表示

amp-listという、外部データを元にコンテンツを表示するコンポーネントがサポート予定のため、APIや静的なJSONファイルと連動した内容を表示させることが可能です。

たとえば、商品のセール情報をメールで配信した際、在庫状況をリアルタイムに表示させたり、キャンペーン開始までのカウントダウンを表示させたりと、様々な用途で活用できるようになります。

入力フォームの実装

AMP for Emailではamp-formもサポート予定のため、Eメールに入力フォームの実装が可能になります。予約フォームやアンケート機能などを実装することで、ユーザーがEメールからWebサイトへ遷移する手間を削減し、コンバージョン率の増加が期待できます。

AMP for Emailを試すには

AMP for Emailのマークアップは、いくつかのAMP独自要素や属性がAMP for Email専用の記述に変わりますが、マークアップのルールはAMP HTMLとほとんど同じです。そのため、AMPページを作成したことがある方であれば、低い学習コストでAMP for Emailを作成することができます。

AMP for Emailは、2018年5月時点において開発途中のため、一般での利用はできませんが、Bringing the power of AMP to emailから申請することで、Gmailでのプレビューが可能になります。

メール配信は行わず、とりあえずAMP for Emailのマークアップを知りたい場合は、AMP by Exampleでより手軽にプレビューを試すことができます。

作成したAMP for Emailの検証は、AMPページと同様に専用のバリデーターを使用します。2018年5月時点では、npm版Webサービス版が対応しています。

まとめ

AMP for Emailの登場によって、EメールをWebサービスの一部のように扱えるため、従来のようにWebサイトへの誘導目的ではなく、コンバージョンに直接影響するようなコンテンツが配信可能になります。

AMP for EmailはAMP HTMLがベースとなっているため学習や実装にかかるコストが低く、Eメールのコンバージョン率の向上が期待できます。そのため、現在運用中または開発中のWebサービスなどで、AMP for Emailに向いていそうな機能を考えてみると、今までにはなかった効果的なアイデアが生まれてくるかもしれません。

2018年5月時点で、サポート予定のEメールクライアントがGmailだけである点がネックです。しかし、今後AMP for Emailに対応するEメールクライアントが他にも登場すれば、AMP for Emailが徐々に使われだし、ユーザーと運用者の両者にとって効率的なEメール配信ができるようになるのではないでしょうか。