新規での E メールのデザイン

Eメールコンテンツの編集をマスターする方法を説明します。 Eメールデザイナーを使用すると、独自の定義済みコンテンツを使用して、または使用せずに、Eメールやテンプレートを作成できます。

Eメールデザイナーを使用してEメールコンテンツを最初から作成およびデザインする主な手順は次のとおりです。

  1. Eメールを作成し、その内容を開きます。
  2. 構造コンポーネントを追加して、Eメールを形成します。 Eメール構造の編集を参照してください。
  3. 構造コンポーネントにコンテンツコンポーネントとフラグメントを挿入します。 フラグメントとコンテンツコンポーネントの追加を参照してください。
  4. 画像を追加し、Eメールのテキストを編集します。 画像の挿入を参照してください。
  5. パーソナライゼーションフィールドやリンクなどを追加して、Eメールをパーソナライズします。 パーソナライゼーションフィールドの挿入リンクの挿入およびEメールでの動的コンテンツの定義を参照してください。
  6. 電子メールの件名行を定義します。 Eメールの件名行のパーソナライズを参照してください。
  7. E メールのプレビュー.
  8. コンテンツを保存し、オーディエンスを定義し、送信を適切にスケジュールした後で、メッセージを続行します。

紹介ビデオもご覧ください。

メモ

Eメールコンテンツをゼロからデザインするのを避けるために、標準のコンテンツテンプレートを使用できます。 詳しくは、コンテンツテンプレートを参照してください。

電子メール構造の定義

Eメールデザイナーを使用すると、Eメールの構造を簡単に定義できます。 簡単なドラッグ&ドロップ操作で構造要素を追加および移動することで、Eメールの形状を数秒でデザインできます。

Eメールの構造を編集するには:

  1. 既存のコンテンツを開くか、新しいEメールコンテンツを作成します。

  2. 左側の​+​アイコンを選択して、Structure components​にアクセスします。

  3. Eメールの形状を設定する必要がある構造コンポーネントをドラッグ&ドロップします。

    構造コンポーネントをドロップする前に、青い線が正確な位置を具現化します。 他のコンポーネントの間または下にドロップできますが、内部にドロップすることはできません。

    メモ

    列のスタックは、すべての電子メールプログラムと互換性があるわけではないことに注意してください。サポートされていない場合、列はスタックされません。

    Eメールに配置した後は、既にコンテンツコンポーネントまたはフラグメントが配置されていない限り、コンポーネントを移動または削除できません。

  4. 1つ以上の列で構成される複数の構造コンポーネントを使用できます。

    n:n column​コンポーネントを選択して、選択する列の数を定義します(3 ~ 10)。 また、各列の下部にある矢印を動かして、各列の幅を定義することもできます。

    メモ

    各列のサイズは、構造コンポーネントの全幅の10%未満にすることはできません。 空でない列は削除できません。

構造を定義すると、コンテンツフラグメントとコンポーネントをEメールに追加できます。

プリヘッダーの使用

プリヘッダーは、インボックスからEメールを表示する際に件名行に続く短い概要テキストです。 プリヘッダーは、開封率を高めます。

Preheader​編集ボックスを選択し、内容を入力します。

プリヘッダーコンテンツには、Content blockDynamic content​または​Personalization fields​を追加できます。

メモ

プリヘッダーは、すべての電子メールプログラムと互換性があるわけではないことに注意してください。サポートされていない場合、プリヘッダーは表示されません。

コンテンツコンポーネントの使用

コンテンツコンポーネントは生の空コンポーネントで、Eメールに配置すると編集できます。

コンテンツコンポーネントは、構造コンポーネントに必要な数だけ追加できます。 また、構造コンポーネント内や別の構造コンポーネント内に移動することもできます。

Eメールデザイナーで使用可能なコンポーネントのリストを次に示します。

Button

複数のボタンを使用する必要がある場合は、各ボタンを一から編集するのではなく、コンテキストツールバーを使用して​Button​コンポーネントを複製できます。

また、ボタンをフラグメントに保存して再利用することもできます。 詳しくは、コンテンツフラグメントの作成およびコンテンツをフラグメントとして保存を参照してください。

Fallback view 」を選択して、Eメールデザイナーにフォールバック画像を表示します。

Text

このコンポーネントを使用して、Eメールにテキストを挿入します。 Component Settings​内のテキストの色、スタイル、サイズを調整できます。

Divider

このコンポーネントを使用して、Eメールに分割線を挿入します。 Component Settings​では、改行の色、スタイルおよびサイズを選択できます。

HTML

このコンポーネントを使用して、既存のHTMLの様々な部分をコピー&ペーストします。 これにより、無料のモジュラーHTMLコンポーネントを作成できます。

メモ

無料のHTMLコンポーネントは、制限されたオプションで編集できます。 すべてのスタイルがインライン化されていない場合は、HTMLコードの​head​セクションに適切なCSSを追加してください。そうしないと、Eメールが応答しなくなります。 Preview​ボタンを使用して、コンテンツの応答性をテストします(メッセージのプレビューを参照)。

外部コンテンツをEメールデザイナーに準拠させるだけで済むように、Adobeでは、メッセージを一から作成して、既存のEメールからフラグメントやコンポーネントにコピーすることをお勧めします。

再作成できないコンテンツがある場合は、Html​コンテンツコンポーネントを使用して、元のEメールからHTMLコードをコピー&ペーストできます。 先に進む前に、HTMLについて理解しておく必要があります。

メモ

新しいコンテンツは元のEメールの正確なコピーではありませんが、以下の手順で、できるだけ近いメッセージを作成します。

コンテンツをコピーする前に

  1. 元のEメールで、送信する各Eメールに固有のセクションから再利用可能なセクションを特定します。
  2. 使用するすべての画像とアセットを保存します。
  3. HTMLに詳しい場合は、元のHTMLコンテンツを別々の部分に分けます。

ビデオ

電子メールの構造コンポーネントにビデオコンポーネントを挿入し、Component Settings​にビデオリンクを入力します。

メモ

ビデオは、すべての電子メールプログラムと互換性があるわけではないことに注意してください。サポートされていない場合、フォールバックが表示されます。

画像

このコンポーネントを使用して、Eメールに画像を挿入します。

画像コンポーネントを構造コンポーネントに挿入し、「参照」をクリックして、コンピューターから画像ファイルをアップロードします。

Social

このコンポーネントを使用して、Eメールにソーシャルメディアページへのリンクを挿入します。 Component Settings​では、表示するリンクとそのアイコンのサイズを選択できます。

  1. Carousel​コンポーネントを構造コンポーネント内にドラッグ&ドロップします。

  2. コンピューターから画像を参照して選択します。

  3. Settings​ウィンドウで、カルーセルに表示するサムネールの数を設定します。

  4. コンピューターからフォールバックイメージを選択します。

カルーセルコンポーネントは、すべての電子メールプログラムと互換性があるわけではありません。 電子メールでカルーセルがサポートされていない場合は、代わりに画像を表示するためのフォールバックをアップロードします。

メモ

カルーセルコンポーネントは、次のEメールプラットフォームと互換性があります。Apple Mail 7、Apple Mail 8、Outlook 2011 for Mac、Outlook 2016 for Mac、Mozilla Thunderbird、iPadおよびiPad mini iOS、iPhone iOS、Android、AOL(Chrome、FirefoxおよびSari)。

関連トピック

このページ