GmailにHTMLを挿入する方法

家で働く若い女性

HTMLをGmailに挿入できます。

画像クレジット: Marko Geber / DigitalVision / GettyImages

古いバージョンのGmailではHTMLが許可されており、使いやすいHTMLエディターも提供されていました。 現在、GmailではHTMLの使用がより困難になり、実際にサポートされるHTMLに制限が設けられています。 とは言うものの、電子メールのカスタマイズと設計に役立つ基本的なHTMLの実装は簡単に実装でき、カスタムの電子メールサービスにお金を払わなくても、いくつかの非常に優れた設計要素を作成できます。

GmailのHTML制限

Gmailでは、WYSIWYGエディターで簡単にフォーマットできますが、より複雑なコードには外部エディターを使用することもできます。 外部エディターは会社のブランディングやニュースレタースタイルのフォーマットを作成するのに理想的ですが、内部エディターはシンプルなフォント、絵文字、画像に最適です。 エディターの選択は、基本的にHTMLの複雑さと実際の電子メールの特定のニーズに依存します。

今日のビデオ

WebフォントもGmailエコシステム内では機能しません。 Gmailですでに提供されているフォントのみを使用できるため、コードはカスタムフォントをレンダリングしないため、これら以外のものを追加することは避けてください。 ただし、Gmailで提供されるフォントはかなり堅牢であり、カスタマイズされたメールには多くのオプションがあります。

もう1つの制限は、外部スタイルシートを組み込むことができないことです。 独立したCSSシートを作成してGmailに直接接続することはできません。 幸い、CSSコードの特定の行をHTMLコード内の埋め込み要素として追加できます。 これは、スタイリング機能が制限された優れた回避策を提供しますが、カスケードスタイルシートのフルパワーではありません。

GmailでHTMLを使用する

制限事項がわかったので、先に進んで、内部エディターまたは外部エディターでHTMLコードを記述します。 外部エディターは一般的であり、多くの場合、メールリストサブスクリプション管理サービスと統合されています。 無料版と有料版があり、さまざまなオプションを利用できます。 内部エディタが正しく機能するには、プレーンテキストエディタから生のコードを作成またはコピーして貼り付ける必要があります。

生のコードを書くことは必ずしも必要ではないので、外部エディターは多くのユーザーにとって理想的です。 多くのバージョンには、事前に設計されたテンプレートと、コーディングの知識を必要としないドラッグアンドドロップエディタが付属しています。 デザインは、Gmailなどのメールプラットフォームの制限内で機能するように特別に作成されています。

カスタムHTMLコードをGmailに挿入する際の最大のハードルは、表示です。 電子メールはさまざまなデバイスで読み取られ、コードはデバイスごとに異なって表示されます。 ラップトップでは完全に機能し、モバイルデバイスのレイアウトを調整できない場合があります。 レスポンシブテンプレートデザインを提供する外部編集プラットフォームを探して、どのデバイスでも適切にサイズ変更できるようにします。

コードをレンダリングする

メールをデザインしたら、Gmailにコードを直接入力します。 送信前のテストも、プロセスの重要な最終ステップです。 フルサービスのメールエディタと管理システムがGmailに接続し、外部サービスを介してメールを送信します。 これらのエディターは通常、テストメールを送信して、通常の受信トレイにあるすべてのものを表示する簡単な方法を提供します。

GmailのメールにHTMLを埋め込むには、コードをプレーンテキスト形式でコピーし、最初にウェブブラウザでコードをレンダリングします。 Chromeまたは別のブラウザでHTMLファイルを開くことは問題ありません。 これにより、Gmailに表示されるとおりにメールが表示されます。 Webブラウザの表示からすべてをコピーして、Gmailに直接貼り付けます。

公式メールを送信する前に、テストメールを自分に送信して、正しく表示されることを確認してください。 Googleは、大量のメールを管理して公式のメーリングリストに送信するためのGmass拡張機能も提供しています。