@import CSS 埋め込みコードを使用すると、カスタム Web フォントを HTML 電子メールまたはニュースレターに含めることができます。

注意:

JavaScript によるフォントの読み込みは、東アジアの Web フォントの提供に必要な、アドビのダイナミックサブセットに使用されます。CSS 埋め込みコードオプションがないので、これらの Web フォント(中国語、日本語および韓国語の言語サポートのあるフォントを含む)は、HTML 電子メールでは使用できません。

使用するフォントの選択

Web フォントのチュートリアルに従って、使用するフォントを選択し、プロジェクトを作成します。

埋め込みコードの追加

プロジェクト用の埋め込みコードは、Web プロジェクトページで確認できます。該当するプロジェクト名を探し、「@import リンク」オプションをクリックします。

@import 埋め込みコードを含む <style> タグをフォントファミリー名と共に電子メールの <head> に追加します。

HTML 電子メールで使用される @import 埋め込みコード

テキストにスタイルを適用するために CSS 内で使用するフォントファミリー名は、Web プロジェクトでも表示されます。CSS でのフォントの使用に関する説明を参照してください。

注意:

@Import 埋め込みコードは、他のすべての @import ステートメントと共に <style> タグの先頭に記述する必要があります。そうしなかった場合、フォントは読み込まれません。@import 行の前にリストできるのは、@charset エントリのみです。

Web フォントをサポートする電子メールクライアント

一部の電子メールクライアントは、HTML 電子メールや電子メールの Web フォントをサポートしません。これは、受信者に表示される内容に影響します。電子メールでは必ずフォールバックフォントを指定し、送信前にテストをおこなって、電子メールがすべてのクライアントで正常に表示されることを確認してください。

次に、一般的な電子メールクライアントと Web フォントの互換性の簡単なリストを示します。

クライアント名 互換性
AOL メール はい
Android メールアプリ(ネイティブ。GMail 以外) はい
Apple Mail はい
GMail いいえ
Google Inbox いいえ
iOS メール はい
Outlook 2000 いいえ
Outlook 2011(OS X 10.10 以降) はい
Outlook 2016(OS X 10.10 以降および Windows 10) はい

プロジェクトの削除またはサブスクリプションのキャンセル

電子メールキャンペーンで使用しているプロジェクトを削除した場合や、プロジェクトをホストしているサブスクリプションをキャンセルした場合は、送信された電子メールでフォントを使用できなくなります。代わりに、指定したフォールバックフォントまたは電子メールクライアントのデフォルトフォントが使用されます。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

リーガルノーティス   |   プライバシーポリシー