HTML形式のメルマガを送る方法とは？
作成から配信まで徹底解説
HTML形式のメールマガジン（メルマガ）に挑戦したいけれど、作成や送信の方法がわからず悩んでいませんか？
本記事では、HTMLメールの基本ルールから各メーラーでの送信手順、配信ツールの活用法までを体系的に解説。初めての方でも安心して実践できます。
HTMLメール作成時の基本ルールと注意点
HTMLメールは、視覚的に訴求力の高いメルマガを実現できる反面、表示崩れや読み込みトラブルを防ぐためには、いくつかの基本ルールを押さえておく必要があります。ここでは、HTMLメールを正しく、効果的に作成するための基本と注意点を順に解説します。
HTMLメルマガのテンプレート構成例
HTMLメルマガを一から作成する際、まず迷うのがどのようにパーツを組み立てればいいかという点です。
ここでは、基本的なテンプレート構成を具体例とともに解説します。全体像をつかめば、制作のスピードもクオリティもぐっと向上します。
- レイアウトの枠組み
- ヘッダー・フッター
- 本文テキスト
- CTAボタン
- 画像やアイコン
- 罫線・中見出し
全体レイアウトの枠組み（width, heightなど）
まずはメルマガ全体を囲む枠組みを作成します。
多くの場合、横幅（width）は600px前後に設定するのが一般的です。これは、多くのメーラーやスマホ画面に適したサイズだからです。
<table width="600" cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td>ここにコンテンツが入ります</td>
</tr>
</table>- width="600"で横幅を固定
- cellpadding="0" cellspacing="0"で余計な隙間をなくす
- align="center"で中央寄せ
全体のサイズ感をまず決めることで、後続のパーツ配置がスムーズになります。
ヘッダー・フッターの設置
次に、ヘッダーとフッターを設定します。
ヘッダーにはブランドロゴやタイトル、フッターには会社情報や配信停止リンクを入れるのが一般的です。
ポイントは以下の通り：
- ヘッダーには第一印象を意識したデザインを
- フッターには法的な表記（会社名、住所、配信停止リンク）を忘れずに
- どちらもシンプルで目立ちすぎない設計が理想
本文エリアにテキストを追加
本文エリアは、メルマガの主役となる情報を載せる場所です。
テキストは単に並べるのではなく、メリハリのある構成を意識しましょう。
- 見出し・本文でフォントサイズを変えると読みやすさUP
- 行間（line-height）は1.4〜1.6程度を確保
- テキストブロックは適度に区切る（改行や段落）
CTAボタンの設置（Web誘導など）
HTMLメルマガでは、行動を促すCTA（Call-To-Action、行動喚起）ボタンが欠かせません。「詳しくはこちら」「今すぐ登録」など、具体的なアクションを促しましょょう。
- 目立つカラーでデザイン（ブランドカラーを使用すると統一感が出る）
- ボタンは大きめ・タップしやすいサイズに
- リンク先が正しく機能しているか必ず事前確認
画像やアイコンの挿入（alt属性やパス指定）
画像を使う場合は、正しく読み込めない場合を想定してalt属性を設定しましょう。
また、パス（URL）は絶対パスで指定するのが基本です。
- alt属性を必ず記述（画像が非表示の場合に備える）
- https://〜の絶対URLを使用（相対パスは不具合の原因に）
- 画像のサイズをあらかじめ調整しておく（受信者側の負担を軽減）
ALT未設定の表示例
ALT設定済の表示例
罫線・中見出しで読みやすさアップ
長文のテキストが続くと読みにくくなるため、罫線や中見出しを挟んでメリハリをつけましょう。
また、途中に中見出し（サブタイトル）を挟むことで、読者は情報をスムーズに整理できます。
- 罫線は色を薄めに設定（主張しすぎない）
- 見出しは本文より大きめのフォントサイズに
- セクションの切り替えが明確になり、離脱率防止にも効果的
このように、HTMLメルマガは「枠組み → ヘッダー・フッター → 本文 → CTA・画像 → 整理」と順を追って組み立てることで、誰にでもわかりやすい構成を実現できます。
各メーラー別のHTMLメール送信方法
HTML形式でメルマガを作成できたら、次は実際に配信する方法を押さえましょう。ここでは代表的な4つのメーラーで、HTMLメールを送信する方法を紹介します。
- Gmail
- Outlook
- Mac
- Thunderbird
Gmailから送信する方法
Gmailは基本的に、直接HTMLコードを入力する仕組みがありません。
そのため、以下の手順で送信します。
GmailでHTMLメールを送る手順
メールの新規作成画面を開く
画面右下のその他のオプションから「プレーンテキストモード」のチェックを外す
画面右下のその他のオプションから「プレーンテキストモード」のチェックを外す
送信先・件名を入力して送信（メルマガの場合、送信先メールアドレスが「BCC」に
なっているかを確認）また、以下の記事も参考にしてください。
【参考記事】一括メールを送信する際のおすすめの方法
Outlookから送信する方法
Gmailと同様に、OutlookでもHTML形式のメールを作成することが可能です。
OutlookでHTMLメールを送る手順
既定の書式を変更する（表示タブ＞ビューの設定）
メールの新規作成画面を開く
右上部にあるリボン表示オプションをクリックし、詳細なリボンに変更する
適宜装飾を追加する。基本的な装飾は、一般的なエディターと同様
送信先・件名を入力して送信（メルマガの場合、送信先メールアドレスが「BCC」になっているかを確認）
Macのメーラーから送信する方法
Mac標準のメールアプリでも、HTMLメールを送信できます。
Macの標準メールアプリでHTMLメールを送る手順
Macのメールアプリを開く
メッセージで、「フォーマット」＞「リッチテキストにする」（現在のフォーマットが標準テキストの場合のみ使用可能）と選択
適宜装飾を追加する。リッチテキスト（HTML）フォーマットには、書式設定、表、画像を含めることが可能
送信先・件名を入力して送信（メルマガの場合、送信先メールアドレスが「BCC」になっているかを確認）
Thunderbirdの設定と送信方法
無料で利用できるThunderbirdでも、HTMLメールを送信できます。
ThunderbirdでHTMLメールを送る手順
Thunderbirdを起動し、「新しいメッセージ」を作成
メッセージペインの上部の書式バーにあるワープロ機能を使って、メッセージの外観をカスタマイズ
送信先・件名を入力して送信（メルマガの場合、送信先メールアドレスが「BCC」になっているかを確認）
【参考記事】Thunderbird のメッセージの送信と受信
HTMLメールの送信方法
HTMLメールの準備ができたら、いよいよ実際に配信する段階です。
配信方法には、少人数向けに手動で送信する方法と、大規模向けにシステムを使う方法の2つがあります。
それぞれの特徴と使い方を見ていきましょう。
BCCで手動送信する方法（小規模向け）
配信対象が少人数（例えば数十件程度）であれば、BCC（ブラインド・カーボン・コピー）機能を使って手動送信することも可能です。
BCC手動送信の基本手順
- メール作成画面を開く
- 宛先欄の「BCC」フィールドに複数の受信者アドレスを入力
- 本文にHTMLメールを貼り付けまたは挿入
- 件名・差出人名を確認して送信
BCC送信のメリット
- 追加のコストなしで手軽に実施できる
- 個別アドレスが他の受信者からは見えない
BCC送信のデメリット
- 1通あたりの送信数制限（Gmailなら最大500件/日など）に注意
- 開封率やクリック率のトラッキングができない
- 情報漏洩のリスクやスパム判定による配信制限
メール配信システムを使って一斉配信
配信対象が数百件以上になる場合は、専用のメール配信システムやマーケティングオートメーションツール（MAツール）を利用するのが現実的です。
配信システムを使った基本手順
- 配信システムにHTMLメールをアップロードまたはエディタで作成
- 配信リスト（宛先リスト）を登録
- 件名・差出人設定、配信スケジュールを設定
- テスト配信で表示やリンクをチェック本配信を実施
配信システム利用のメリット
- 配信数制限を気にせず大量送信が可能
- 開封率・クリック率・配信エラー率など効果測定ができる
- 配信停止管理（オプトアウト）機能が標準搭載されている
注意点
- 無料プランでも一定の機能は使えるが、本格的な運用には有料プランが必要になる場合も
- メールの品質（認証設定やドメイン管理）によっては迷惑メール扱いされるリスクがあるため、初期設定は慎重に行う
HTMLメルマガを送るなら「Zoho Campaigns」
HTMLメルマガを本格的に運用したいなら、専用の配信ツールを活用するのが近道です。なかでもおすすめなのが、シンプルな操作性と高機能を両立したZoho Campaigns です。
Zoho Campaigns は世界で40万以上のユーザーに利用されているメルマガ配信・メールマーケティングツールです。ドラッグ＆ドロップ式のHTMLメールエディターで、誰でもすぐにHTMLメルマガを作成できます。
- HTMLメルマガテンプレート
- HTMLエディター
- リスト管理
- セグメント
- ステップメール
HTMLメルマガテンプレート
Zoho Campaigns には、さまざまな用途にあわせてデザインされた 多彩なテンプレートが用意されています。Zoho Campaigns のテンプレートはスマートフォンやタブレットにも最適化されたレスポンシブデザインのため、特別な設定を行うことなく、あらゆるデバイスで快適に閲覧できます。
HTMLエディター
HTMLメールエディターでは、簡単なドラッグ＆ドロップの操作で独自のメールマガジンを作成・編集することができます。画像やテキスト、ソーシャルアイコンなどのデザインパーツ（要素）を選択して、配置を変更したりするなど、柔軟にHTMLメールを作成できます。
リスト管理
HTMLメルマガの配信に欠かせないのがリスト管理。手持ちのリストやメルマガ購読の登録フォーム経由で獲得した見込み客の情報をもとに、リストを適切に管理しましょう。Zoho Campaigns のリスト管理機能では、Excel からのインポートや、CRMツールとの自動同期が可能です。さらに、重複アドレスや無効なアドレスはインポート時に自動で除外されるため、手間なく安心です。
セグメント
Zoho Campaigns に登録された属性の情報から、顧客をかんたんにセグメント分けできます。「年齢」「性別」「興味のある製品」などの属性情報や、検討フェーズに合わせて、セグメントごとに最適なメッセージを届けられます。
ステップメール
Zoho Campaigns にはメール送信や各種操作を自動化できる「ワークフロー」機能が備わっています。ステップメールの作成は、ワークフローのテンプレートから簡単に設定が可能。例えば、資料請求から数時間後に「ご不明点はありませんか？」と促すリマインドメールを自動送信できます。
検討中の見込み客に寄り添い、次のステップへと進める後押しをしましょう。
Zoho Campaigns の導入事例
単体のMAツールでは配信のたびに連絡先のインポートが必要でしたが、Zoho CRM とZoho Campaigns を連携させればスムーズに連絡先情報を同期できますし、リストやセグメントで対象ごとの配信も可能となるため、使い勝手が良いと感じています。
株式会社イムラ
特にHTMLのメルマガを、ドラックアンドドロップで簡単に作成できる機能は重宝しています。「誰でも簡単に使いこなせるツール」だと思います。
セイスイ工業株式会社
Zoho Campaigns のレポート機能を活用して、電話でフォローし、顧客管理データベース上にお客さまの状況をアップデートするようにして商談に活かしています。
株式会社コンテックス
要件に合う機能が一通りそろい、結果がわかり改善ができる機能（A/Bテスト）も魅力でした。Zoho Campaigns は配信先数による課金体系で、売上の増加と連動する条件で費用対効果が出せるのが選定の決め手となりました。
株式会社すららネット
サイトに設置しているメルマガ配信の申し込みフォームから登録された方などは自動でデータをインポートして配信しています。メールの開封率は、平均30％くらいあり、集客メールを配信するとすぐに数件の申し込みが確認できています。
株式会社オプンラボ
