見出し画像

受信トレイで差がつく最新戦略！ひときわ目立つ「Gmailアノテーション機能」

チーターデジタルCXコンサルチーム

こんにちは、チーターデジタルCXコンサルティングチーム、メールおたくの阿部です。
今回は、「どうやったら、メールの受信トレイでメールを開封してもらいやすくなるの？」というお話です。

メールマーケティングの世界で、受信トレイの中で際立つことは常に課題でした。Gmailのアノテーション機能は、この課題に対する革新的な解決策を提供します。
今回は、Gmailアノテーション機能についての、具体的な実装方法と効果的な事例についてご紹介していきます。


プロモーションタブでの視覚的優位性がUP！
Gmailアノテーション機能とは？

Gmailアノテーション機能は、[プロモーション]タブ内のメールに視覚的な要素を追加できる革新的なツールです。この機能を使用すると、画像、セール価格、有効期限などの情報をメール一覧で直接表示できるようになります。

通常のテキストベースの受信トレイの中で、アノテーション機能を使用したメールは視覚的に際立ちます。画像やアイコンが表示されることで、ユーザーの目を引き、開封率向上につながる可能性が高まります。

また、機能を活用することで、ユーザーはメールを開くことなく重要な情報を得ることができます。これにより、ユーザーの興味を引き、CTR向上が期待できます。

ある日の筆者のGmailプロモーションタブのScreenshot。
①Googleが勝手（？）にアノテーションとして表示しているもの、②意図的にアノテーションを表示させるもの、の2種類がある。今回の記事は②を説明しています。

重要な前提条件：Googleの承認

Gmailアノテーション機能を利用するには、Googleからの承認が必要です。具体的には以下の手順が必要となります：

  1. ドメインをGmailのプロモーションタブのアウトリーチチームに登録する。

  2. Googleから明示的な許可を得る。

この承認プロセスは、機能の適切な使用とユーザー体験の保護を目的としています。承認を得てはじめて、アノテーション機能を活用したメールマーケティングを展開することができます。
※詳細はGoogleの「[プロモーション] タブでメールにアノテーションを付ける」をご覧ください

アノテーション機能の実装方法

アノテーション機能の実装は、HTMLメールのヘッダー部分にコードを追加することで行います。

実装には主に2つの方法があります。

  1. JSON-LD を使用する方法

  2. Microdata を使用する方法

ESP（Email Service Provider）で、JSONが無効となる場合や、スクリプトタグが削除される可能性がある場合があるため、ESPに合わせた方法を選択してください。

どんな表示が可能なの？
アノテーションとコーディング例

アノテーションを実装してみましたので参考にしてみてください。
Googleの説明では、Schema.org は microdata を使用してアノテーションを付ける方法を提供していますが、筆者の使っているESPでは、スクリプトタグが無効なようでしたので、<head><script>...</script></head> の代わりに、<div>と<meta>を使って以下のように記述して実装してみました。

Googleのサイトでアノテーションをプレビューすることができるので、コーディングしたものを実際にプレビューしながら確認していきましょう。

表示できるアノテーションと記入例

上記を実際にコーディングした、Microdataを使用した記述方法

<head>

<div itemscope itemtype="http://schema.org/EmailMessage">
<meta itemprop="subjectLine" content="HOLIDAY SALE【定価商品がレジにて50％OFFに！】"/>
</div>
<div itemscope itemtype="http://schema.org/Organization">
<meta itemprop="name" content="Gmail"/>
<meta itemprop="logo" content="https://hoge/cats_03.jpg"/>
</div>
<div itemscope itemtype="http://schema.org/DiscountOffer">
<meta itemprop="description" content="SALE 50％OFF"/>
<meta itemprop="discountCode" content="LOVE Cats"/>
<meta itemprop="availabilityStarts" content="2023-09-01T00:00:00+09:00"/>
<meta itemprop="availabilityEnds" content="2023-09-07T23:59:59+09:00"/>
</div>

<!-- Build the first image preview in your product carousel: -->
<div itemscope itemtype="http://schema.org/PromotionCard">
<meta itemprop="image" content="https://hoge/cats_01.jpg" />
<meta itemprop="url" content="https://www.cheetahdigital.com/jp/" />
<!-- Optionally, include the following PromotionCard properties: -->
<meta itemprop="headline" content="Cat 1" />
<meta itemprop="price" content="10000" />
<meta itemprop="priceCurrency" content="JPY" />
<meta itemprop="discountValue" content="5000" />
<meta itemprop="position" content="1" />
</div>
<!-- Build the second image preview in your product carousel: -->
<div itemscope itemtype="http://schema.org/PromotionCard">
<meta itemprop="image" content="https://hoge/cats_02.jpg" />
<meta itemprop="url" content="https://www.cheetahdigital.com/jp/" />
<!-- Optionally, include the following PromotionCard properties: -->
<meta itemprop="headline" content="Cat 2" />
<meta itemprop="price" content="20000" />
<meta itemprop="priceCurrency" content="JPY" />
<meta itemprop="discountValue" content="10000" />
<meta itemprop="position" content="2" />
</div>

</head>

上記のコードの中の「itemtype="http://schema.org/PromotionCard"」って一体なんだろう？と思って、調べてみたところ、「このアイテムがSchema.orgで定義されているPromotionCardタイプだよ」と言う意味のもので、アノテーションの要素によって値が変わるようでした。（例：ディスカウントオファーの場合は、itemtype="http://schema.org/DiscountOffer"）

表示可能なアノテーション要素

Gmailアノテーション機能では、画像、セール価格、有効期限など、様々な要素を表示することができます。
主な表示可能要素には以下のようなものがあります。

  • SUBJECTLINE（件名）

  • DESCRIPTION（説明）

  • DISCOUNT_CODE（割引コード）

  • START_DATE_TIME（開始日時）

  • END_DATE_TIME（終了日時）

  • IMAGE_URL（画像URL）

  • HEADLINE（見出し）

  • PRICE（価格）

  • DISCOUNT_VALUE（割引額）

アノテーション機能の効果的な活用法

出典：Email Marketing Inspiration: How Brands Utilize Gmail’s Promotions Tab Annotations

目を引くデザイン戦略

  1. 鮮やかな画像の使用：キャペーンや製品の魅力が伝わるような高品質で鮮明な画像を用いましょう。

  2. 簡潔で魅力的な見出し：HEADLINE1とHEADLINE2を使って、短くインパクトのある見出しを作成しましょう。画像に入れる見出しは「SUBJECTLINE」とかぶってしつこくならないように工夫しましょう。

  3. セール情報の強調：DISCOUNTやPRICE情報を効果的に使用し、割引率や特別価格を目立たせましょう。

CTR向上のためのテクニック

  1. 緊急性の創出：START_DATE_TIMEとEND_DATE_TIMEを活用し、セールの期間限定性を強調しましょう。

  2. ターゲティングの最適化：ユーザーの興味関心に基づいて、パーソナライズされたコンテンツを提供しましょう。MAのデータを連携して、パーソナライゼーションを行うと、より受信者が欲しい情報を提供することができます。

  3. クリアーなCTA（行動喚起）：PROMO_URLを効果的に使用し、ユーザーが次のアクションを取りやすくします。受信トレイから直接Webサイトへ誘導できるメリットもあります。

注意！アノテーションは必ず表示されるわけではない

アノテーションは必ずしも全てのユーザーに表示されるわけではありません。表示の有無は、Gmailの品質フィルタや表示頻度の上限など、様々な要因によって左右されるようです。

まとめ：Gmailアノテーション機能で実現する次世代のメールマーケティング

Gmailアノテーション機能は、メールマーケティングに新たな可能性をもたらします。視覚的に魅力的で情報量の多いプレビューを受信トレイで提供することで、ユーザーの注目を集め、エンゲージメントを高めることができます。
この機能を効果的に活用するためには、技術的な実装と戦略的なコンテンツ設計の両面からアプローチすることが重要です。
特に、実装面においては、設定に手間がかかるので、バルクメールで配信毎にアノテーションのコーディングを行うより、MAツールを用いて差し込みで作られる動的なシナリオメール、例えば、新着・ランキング・レコメンドなどに使うのがよさそうですね。
ぜひ、みなさまも試してみてください。

Author

阿部 加奈 （Kana Abe）
Senior Creative Specialist / Creative Consultant
Japan Services Div. CX Consulting Team - CHEETAH DIGITAL
HTML黎明期よりメールデザインとコーディングにおいて10年以上の経験。
多種多様な業界での支援経験で培った発想力とノウハウで、貴社のメールクリエイティブを次のステップに引き上げます。

★次回セミナーのお知らせ
『メールマーケ、進化の最前線！』後編
〜最新デザイン手法、AI活用、パーソナライズで実現するコミュニケーションの向上〜

分析・クリエイティブ・製品・最新技術など…マーケティングに役立つ情報を発信中！
＞ チーターデジタルBLOGはこちら

＞ 過去セミナー動画やeBookなどのコンテンツはこちら


この記事が参加している募集

#仕事について話そう

114,807件