PitaTools Guide
HTMLメールを配信前に確認するプリフライト手順
HTMLメールの構造、件名、プリヘッダー、リンク、UTM、容量、PC・スマホ表示を送信前に検算する作業フローです。
Free tool
HTMLメールビルダーを今すぐ使う
ブロックを並べてメルマガ用HTMLを作成。登録不要で、入力内容はブラウザ内だけで処理します。
受信者の目的と1つの主要行動を決める
HTMLを組む前に、誰へ何を伝え、読後にどのリンクを選んでほしいかを一文にします。主要CTAを複数置く場合も優先順位を決め、件名と本文で別の内容を約束しないようにします。
差出人、件名、プリヘッダーを受信トレイ風プレビューへ入れ、スマートフォン幅でも主題が前半に残るか確認します。省略位置はメールソフトで変わるため、プレビューは確定表示ではありません。
リンクと計測パラメータをHTMLから一覧化する
HTMLメールリンク確認でhrefを抽出し、空URL、重複、意図しないテスト環境URL、主要UTMの不足を一覧で確認します。この解析はリンク先へ通信しないため、HTTP状態は別の送信テストで確認します。
解除リンクや配信設定リンクなど、配信システムが差し込む値は完成HTMLで確認します。計測パラメータへ個人情報を直接入れず、分析用途と保存期間に合う値だけを使用します。
容量と実メールクライアントで最終確認する
HTML容量確認でUTF-8バイト数、画像、リンク、style要素の件数を見ます。配信システムが追跡コードやCSSを追加すると最終容量が変わるため、編集前の値だけでクリップ有無を断定しません。
テスト送信後はPCとスマートフォンで、画像非表示時の代替テキスト、文字サイズ、ダークモード、CTA、解除リンクを操作します。HTML生成ツールのプレビューだけで配信可否を決めないことが重要です。
参考資料
- MDN - HTML table
メール互換性を考慮した表構造を理解するためのHTML仕様資料です。
- Google - Gmailでのメール表示
Gmail上のメッセージ表示と操作を確認する公式ヘルプです。