概要

カスタムフォントを使用すると、標準の Web セーフフォントにとどまらず、メールキャンペーンをブランド独自のビジュアルアイデンティティに合わせることができます。カスタムフォントを MoEngage ワークスペースに直接統合することで、ブランドのタイポグラフィをメールコミュニケーション全体に一貫して適用できます。この機能は、統一されたブランド体験の維持、デザインの向上、メッセージ全体のプロフェッショナリズムの向上に特に役立ちます。 すべてのメールクライアントがカスタムフォントをサポートしているわけではないことを理解しておくことが重要です。これに対応するため、MoEngage ではフォールバックフォントを指定でき、受信者のメールボックスプロバイダーがカスタムフォントをサポートしていない場合でも、メールが正しく表示され、読みやすさが維持されるようにします。送信されたメールでフォントが作成時と異なって表示される場合は、送信されたメールでフォントが変わるのはなぜですか？ を参照してください。

ユースケース

カスタムフォントの導入は、メールマーケティング戦略を強化する効果的な方法です。この機能を活用する方法のユースケースをいくつか紹介します。

• ブランドの一貫性: ブランドが Web サイト、モバイルアプリ、印刷物で特定のフォントを使用している場合、メールでも同じフォントを使用することで、顧客にシームレスで認識しやすい体験を提供できます。これにより、ブランドの想起率と信頼が強化されます。
• 独自のキャンペーン: 特別なプロモーション、ホリデーキャンペーン、新製品の発売などでは、カスタムフォントによってメッセージを際立たせることができます。見出しや Call-to-Action (CTA) に目を引く特定のフォントを選択的に適用して、注目を集めることができます。
• テーマに沿ったデザイン: カスタムフォントは、キャンペーンのトーンや雰囲気を演出できます。高級ブランドであれば洗練されたセリフフォントで優雅さを伝え、テクノロジー企業であればすっきりとしたモダンなサンセリフフォントで革新性とシンプルさを表現できます。
• 読みやすさの向上: 標準フォントは安全ですが、カスタムフォントは、慎重に選択し多様なオーディエンスでテストすれば、特にニュースレターや記事などの長文コンテンツにおいて、より優れた読みやすさを提供できる場合があります。

カスタムフォントの構成

カスタムフォントを構成するには、以下の手順を実行します。

1. MoEngage UI の左側のナビゲーションメニューで、Settings > Channels > Email に移動します。
2. 表示されるメール設定ページで、Font management タブをクリックし、+ Add font をクリックします。

カスタムフォントは、以下の手順で構成できます。

• ステップ 1: フォントファイルのアップロード
• ステップ 2: フォールバックの設定

フォントファイルのアップロード

1. フォントファイルは、ドラッグアンドドロップするか、コンピューターから選択してアップロードできます。MoEngage は .ttf、.woff、.woff2、.otf 形式のファイルを受け付けており、最大ファイルサイズは 5 MB です。
2. ファイルがアップロードされたら、Next をクリックします。

フォールバックの設定

メールキャンペーンにカスタムフォントを選択しても、すべての受信者のメールクライアントでサポートされているとは限りません。メールの読みやすさを確保するため、最大 3 つのフォールバックフォントを選択できます。これらのフォントはバックアップとして機能し、カスタムフォントを表示できない場合に指定した順序で使用されます。 MoEngage は、以下の順序でフォールバックフォントを適用します。

• Fallback Font 1: 最初の代替フォントです。カスタムフォントが表示できない場合、メールクライアントはこのフォントの表示を試みます。
• Fallback Font 2: 2 番目の代替フォントで、最初のフォールバックフォントも表示できない場合に使用されます。
• Fallback Font 3: 最後の最も重要なオプションで、両方のフォールバックフォントが表示できない場合に使用されます。この位置には Web セーフフォントのみを選択できます。Web セーフフォントとは、ほぼすべてのデバイスにプリインストールされている標準フォントであり、確実に利用できます。
  Fallback Font 3 を Web セーフフォントにすることで、すべての受信者に一貫した読みやすい体験を提供でき、他のフォントが表示できない場合でも、メールがスタイルなしの状態や崩れた表示になるのを防げます。

すべてのフォールバックを選択したら、Add Font(s) をクリックして、構成したフォントを Font Management タブに一覧表示します。

構成済みのカスタムフォントの表示

カスタムフォントを構成すると、Font Management タブに一覧表示されます。追加したカスタムフォントに対して、以下の操作を実行できます。

• フォント URL のコピー
• カスタムフォントをデフォルトに設定
• カスタムフォントの削除

フォント URL のコピー

Copy font URL をクリックすると、構成済みのすべてのカスタムフォントを含む CSS ファイルが生成されます。この CSS ファイルは、以下のシナリオで使用できます。

• Custom HTML エディターを使用してメールキャンペーンを作成する場合、この CSS ファイルはエディターの head タグに自動的に含まれるため、フォントをすぐに使用できます。
• Email settings で Auto-format HTML code トグルを無効にしてから Custom HTML エディターでメールキャンペーンを作成する場合は、フォント URL を Custom HTML エディターに貼り付けてフォントを使用できます。

デフォルトフォント

Default トグルをオンにすると、カスタムフォントをデフォルトとして設定できます。デフォルトとして構成されたカスタムフォントは、新しいメールテンプレートが作成されるたびにデフォルトとみなされ、特定のデフォルトフォントが構成されていない場所で使用されます。メールキャンペーンへのデフォルトフォントの追加の詳細については、こちら を参照してください。

フォントの削除

フォントを削除するには、以下の手順を実行します。

1. 削除アイコンをクリックして、構成済みのカスタムフォントを削除します。
2. 表示される Delete fonts ダイアログボックスで、Delete and Save をクリックします。フォントを削除しても、過去のキャンペーンや現在作成中のキャンペーン、下書き、テンプレートには影響しません。
3. フォールバックフォントを削除する場合、Delete Font ダイアログボックスで代替フォントを選択して、すべてのフォールバック箇所で古いフォールバックフォントを置き換えることができます。
4. デフォルトフォントを削除する場合、Delete Font ダイアログボックスで別のフォントを選択して、古いデフォルトフォントを置き換えることができます。

メールキャンペーンへのカスタムフォントの追加

メールキャンペーンの作成時に、さまざまなエディターを使用してメールコンテンツを作成できる ステップ 2: コンテンツ で、構成済みのフォントをメールキャンペーンに追加できます。たとえば、構成されているデフォルトフォントが Priestacy Regular であるとします。 Drag and Drop エディター では、以下のようになります。

• このフォントは、プロパティパネルの Settings タブで Default font として確認できます。Settings タブでデフォルトフォントを変更しても、Font Management タブで構成されたデフォルトフォントは変更されないことに注意してください。
• Text コンテンツ要素では、ツールバーのドロップダウンから Global Font を選択して、構成済みのデフォルトのカスタムフォントを適用できます。
• Title、Paragraph、Table、List などのコンテンツ要素では、Content プロパティタブの Font family に Global Font と表示されます。Global font はデフォルトのカスタムフォントを表します。
• デフォルトフォントを変更すると、Drag and Drop エディター内の Global font のすべてのインスタンスが自動的に更新されます。
• Drag and Drop の各要素ごとに、フォントを個別に上書きすることもできます。

Custom HTML エディター では、構成済みのデフォルトフォントが自動的に選択され、エディターの上部に表示されます。