Skip to Navigation
この記事ではメールクライアントをテストするためのツールとプロセスについて詳しく解説していきます。まず背景とユースケースを少しご紹介した後、使う価値のあるツールをカテゴリ分けして分析していきます。以下が大体の流れです。
メールクライアントテストとは？
メールクライアントテストとは、さまざまなメールクライアント、デバイス、オペレーティングシステムでメールがどのように表示され、機能するかを評価するプロセスです。受信者が使っているプラットフォームに関係なく、メールが正しく、一貫した形で表示されるようにすることが主な目的です。
たとえば、あるメールはGmailのウェブブラウザでは完璧に表示されるかもしれませんが、デスクトップのAOLやOutlookやモバイルデバイス上のYahooメール（iPhoneやAndroid）ではレイアウトが崩れたり、画像が表示されなかったりすることがあります。
メールクライアントテストはメールを送信する前にこれらの問題を特定・修正し、すべてのユーザーにシームレスなエクスペリエンスを提供しするのに役立ちます。
以下はユースケースの例をご紹介します。
- クロスクライアントレンダリング: マーケティングキャンペーン用に設計されたメールをGmail、Outlook、Apple Mailなどのさまざまなプラットフォームでテストします。その結果、一部のCSSスタイルが古いバージョンのOutlookでサポートされていず、レイアウトが崩れてしまうことが分かります。この問題は、Outlook専用のフォールバックスタイルを実装することで解決できます。
- モバイル対応: プロモーションメールをAndroidのGmailアプリやiOSのApple Mailなど、さまざまなモバイルデバイスでテストします。その結果、小さめの画面では画像が適切にスケーリングされていないことが判明します。そのためデザインチームはメールのメディアクエリを調整し、すべてのデバイスで画像が適切にサイズ変更されるよう取り組みます。
メールクライアントテストツール
つまりこれらのテストツールを使うと、メールがさまざまなデバイスやメールクライアントでどのように見えるかを確認し、レンダリングの問題を特定し、適宜調整を行えます。
でも、どのプロ用のツールも同じというわけではありません。テストツールは一般的に、次の3つのカテゴリに分けられます。
- 独立型またはスタンドアロンのテストツール（利用方法を詳しく解説しましたので、ぜひリンクをクリックしてみてください。）
- HTMLプレビューツール（以下の概要をご参照ください。）
- プレビュー機能を備えた大規模なプラットフォーム（こちらも下記の概要をご参照ください。）
結論として、現在の技術スタックや個人の好みに応じて、ツールの種類を選択することをおすすめします。どのツールを選んだとしても、フォーマット、メールデザイン、背後にあるコードのチェックはメールの到達率の向上に役立つでしょう。
ただし問題のあるコード行を表示せず、それを修正するための提案も提供しないテスターも一部ありますのでご注意ください。
HTMLプレビューツール
HTMLプレビューツールを使うとHTMLとCSSの解析を行い、人気のあるメールクライアントごとにイシューリストを閲覧できます。
ここではプレビューを提供するツールについて簡単にご紹介していきます。さらに詳しくお知りになりたい場合は、こちらのリンクをクリックして詳細なガイドをご覧ください。
HTMLメール解析ツールは各メールクライアントのプレビューを生成してくれるだけでなく、コード内の正確な問題を指摘し、修正する方法も説明してくれます。
そのため複数のメールクライアントのプレビューウィンドウを1つずつ確認して問題を探す必要がなくなります（ツールによっては60以上のプレビューがある場合もあります）。HTML/CSSツールが問題を解析し、結果をレポートにまとめてくれます。
なおほとんどのメールプレビューツールはブラウザでHTMLがどのようにレンダリングされるか、デスクトップ、タブレット（iPadなど）、モバイルデバイスでどのように見えるかも表示してくれます。
メールプレビュー機能
前述の通り、メールクライアントテストはCRMやメール送信ツールの機能として提供されることがあります（例：MailtrapのEmail Delivery Platform）。すでにお使いの技術スタックにこのようなツールがある場合、プレビュー機能の利用をおすすめします。以下、いくつか例をご紹介します。
HubSpot
HubSpotはメールマーケティング、営業、ヘルプデスクサービスを提供するCRMプラットフォームで、メールエディタに組み込まれたメールプレビューツールを備えています。
HubSpotを使うと約30種類のメールクライアント（複数バージョンがあるメールクライエントも含みます）から選択でき、各メールクライアントでテンプレートがどのように表示されるかを確認できます。Gmail、Outlook、Office 365、Apple Mailなど最も人気のメールサービスに対応しており、テンプレートのパフォーマンスを手動で比較することも可能です。なおHubSpotのメールプレビューツールは、Litmusによって提供されています。本サービスについてはこの記事の後半で説明いたします。
Campaign Monitor
Campaign Monitorは人気のメールマーケティングと自動化ツールのひとつです。無制限プランとプレミアプランでインボックスプレビューテストを利用でき、このテストでは約20の主要なウェブ、デスクトップ、モバイルのメールクライアントでレンダリングされたテンプレートのスクリーンショットを生成できます。
Campaign Monitorのテストツールでは、プレビューをクリックして手動で比較することもできます。
ActiveCampaign、Brevo、Mailjet（エンタープライズバージョン）も人気のメール配信サービスで、メールクライアントプレビュー機能を備えています。さらにMailchimpにはメールビルダーツールの一部としてインボックスプレビュー機能があります。
他のメール配信システムをお使いの場合は、サードパーティのメールテストツールが適しているでしょう。
適切なメールクライアントテストツールを選ぶ方法
技術的なニーズ、目標、予算に基づいて、メールクライアントテストツールを選ぶためのガイドをご用意しましたので、ぜひご活用ください。
- プレビュー vs. コード解析: 前述のように、メールのプレビューとコード解析の違いを理解することが重要です。プレビューでは視覚的な正確さに着目する一方、コード解析ではHTML/CSSの構造と互換性を確認できます。あなた固有のニーズに合ったツールの選択がもちろん重要ですが、より正確で予測可能な結果を得るためにはコード解析をおすすめします。
- 既存ツールとの統合: メールクライアントテストツールが既存のメールマーケティングプラットフォームや開発環境とシームレスに統合できるかをご確認ください。
- 自動化機能: 大量のメールを送信する場合やアジャイル環境で作業する場合は、自動化と継続的な統合機能を提供するツールを選ぶと時間と労力を節約できます。（なおMailtrap Email Testingは、すべてのテストフローを自動化してくれる数少ないツールの一例です。）
- サポートとドキュメント: サポートの対応具合を確認し、またチュートリアルやコミュニティフォーラムなど、どのような利用可能なリソースがあるか考えて、迅速な問題解決が可能かどうか検討しましょう。
- コスト効率: メールプレビューツールは確かに強力なツールではありますが、高価になることがあります。テストを実行する頻度と必要な反復回数を検討し、投資が正当化されるかどうかご確認ください。たとえば30件のクライアントで10種のテンプレートを5回繰り返しテストすると、1,500のプレビューが必要となり、プレミアムツールではかなりの費用になる可能性があります。
- マーケティングキャンペーン: ビルトインテンプレートとプレビュー機能を備えたマーケティングメール配信用のソフトウェアをすでにお使いの場合、まずはその利用を検討すると良いでしょう。これらのツールには通常、テストが最小限で済むように設計されたテンプレートが備わっています。
- カスタムテンプレート: ご自身でテンプレートをコーディングされている場合、実際のスクリーンショットと手動のインスペクション（検証）機能を提供するツールを優先すると良いでしょう。これらのツールを使うと、さまざまなクライアントやデバイスでメールのプレビューを確認でき、潜在的なエラーを見つけられます。
様々なメールクライアントでのメール送信テスト方法
ここではメールテストとプレビューの詳細なフローについて説明いたします。まずはプレビューとHTMLチェックを備えた完全なサンドボックスを提供するMailtrapのEmail Testingについて解説し、その後Litmusや他のプレビューツールをご紹介いたします。
免責事項：以下のセクションには機能リストや料金に関する言及があります。これらは執筆時点で有効なものですが、記事をお読みになる時点では変更されている可能性があります。
Mailtrap
MailtrapのEmail TestingはMailtrap Email Delivery Platformの一部で、メールを安全な環境で検証しデバッグするためのステージング環境を備えています。
料金：
- MailtrapのEmail Testingには無料プラン（1か月あたり最大100通のメール送信）があります。
- 有料プランは月額$14.99のIndividualプランからあります。
Mailtrapを使ったメール送信テストのワークフロー
ステップ 1
Mailtrapのアカウントを作成します。次にメールを作成して、Mailtrapのサンドボックスに送信します。これはSMTP認証をサポートするアプリ、MTA、またはMailtrapのメールアドレスを使ってテストする任意のメール送信ツールを使って実行できます。
ステップ 2
MailtrapのダッシュボードでEmail Testing > Inboxes > My Inboxに移動し、送信したメールを確認します。
注：受信トレイの名前はご自由に変更できます。また上位プランでは追加の受信トレイを取得できます。
ステップ 3
HTMLコードに関連する3つのタブがあります。
- HTML（ウェブブラウザでレンダリングされたHTMLプレビュー）
- HTML Source（メールのHTMLコード）
- HTML Check
HTML Checkタブに移動します。重要なメールクライアントやデバイスタイプを選択するか、全体のレポートを確認して見つかったすべてのエラーを調べてください。
使われているHTML/CSSが主要なメールクライアントでどの程度サポートされているかが表示されます。全体のレポートスコアは「Market Support」のパーセンテージとして表示され、人気メールクライアント全体のHTML/CSSのサポートレベルを表しています。
全体スコアの下にはさらに詳細なセクションがあり、以下が含まれます。
- HTML要素/CSSルールの名前（例：:hover、 <style>要素、marginなど）
- サポートされていない、または部分的にサポートされているメールクライアント
- メールのHTML内で問題の要素やルールが見つかったコード行へのリンク（HTML Sourceタブに移動し、メールのHTMLコード全体を確認できます）
[Show more]のリンクをクリックすると、問題の詳細やどのメールクライアントのバージョンがエラーを表示しているかを説明するセクションが表示されます。
これらのデータを基に、どの程度の受信者が期待通りの見た目のメールを受け取れるかを把握できます。さらに、どのコード行を修正すればメールのパフォーマンスが向上するかも明確になります。
HTMLチェックに加えて、MailtrapのEmail Testingは以下の機能も提供しています。
- スパムスコアのチェック
- メールプレビュー
- メールヘッダー情報
- ブロックリストレポート
- ユーザー管理
- SSO
- API
- 20以上の言語向けの即時使用可能な統合
最後に、Email TestingはMailtrap Email Delivery Platformの一部であると上で説明いたしました。そのためMailtrapはメール配信API/SMTPツールも提供しており、メールの本番送信をサポートしています。つまり、たとえばAPIを選択した場合、テスト環境から本番環境に迅速に切り替えて、メールが適切に表示され、期待通りのパフォーマンスを発揮することを確認してから送信することができます。
Litmus
Litmusはメールクライアントまたはデバイスからの個別のスクリーンショットを、メールプレビューとして提供しています。プレビューは90以上のメールクライアント（この数には異なるバージョンやデバイスも含まれます）に対応しており、Gmail、Outlook、Apple Mail、Yahooなどの人気クライアントや、Comcast、freenet.de、web.deなどのあまり使われないクライアントもサポートしています。
料金
- すべてのプランで7日間の無料試用期間がありますが、無料プランはありません。
- 個人利用向けのプラン[Litmus Basic]は月額$99からです。
Litmusのメール送信テストワークフロー
ステップ 1
Litmusにテンプレートを追加する方法は次の通りです。
- Litmusのテスト用メールアドレスを使って送信する。
- HTMLテンプレートをアップロードする。
- Litmusのビルダーで、テンプレートライブラリから選択するか、一から作成する。
ヒント：作業中にテンプレートのウェブプレビューを確認できます。
ステップ 2
メールクライアントのプレビューに切り替え、テストしたいメールクライアントを選択してプレビューを確認します。問題がないかどうか各プレビューをよくチェックしましょう。
このテストで使ったHTMLテンプレートは、Really Good Emailsで入手しました。
ヒント：たとえばApple Mail 13とApple Mail 13 Dark Modeは異なるメールクライアントとしてカウントされるので、テンプレートに変更を加えて適用するたびに、新しいプレビューが生成されます。あっという間に上限に到達してしまうのを避けるために、メールクライアントを選択する際はプレビューの上限数を意識することをおすすめします。
ステップ 3
問題がある場合はメールクライアントのスクリーンショットをクリックして、詳細を確認します。次に他のクライアントやデバイスで問題が再現されるかどうかを手動で確認します。
メールクライアントに関連する問題や修正方法を記載した記事のリンクが表示されることもあります。その後、Litmusのビルダー内でHTMLテンプレートを修正し、更新されたプレビューを確認します。
ステップ #4
作業が終わったら、テンプレートをチェックリストにプッシュします。新しく生成されたプレビューのリストが表示されるので、スクロールして各クライアントの詳細なチェックを行います。
重要な注意点：
- Litmusのプレビューは、raw HTMLを使って生成されます。そのためLitmusではメールクライアントでの表示具合が確実に同じであることは保証されていません。
- プレビューはリンクで共有したり、スクリーンショットやHTMLコンテンツとしてダウンロードしたりできます。
プレビューに加えて、事前送信チェックリストには次のテストが含まれています。
- 主要なメールクライアントでの件名とプレビューテキストの確認。
- 6つのベストプラクティスに基づいたアクセシビリティテスト（配置、altテキスト、コンテンツタイプ、見出し構造など）。
- リンクの検証。リンクが機能しているか確認した上で、リンク先のURLをひとつの表にまとめてくれます。
- トラッキングのチェック。HTMLコード内でトラッキングピクセルをチェックし、見つからない場合は独自のメール分析を追加するよう提案してくれます。
- 画像を非表示にした状態でメールプレビューを表示する画像ブロックチェック。
- 画像の読み込み速度を示すロード速度テスト。
- スパムテスト。メールが受信トレイに届かない原因となる問題を探してくれます。このテストはPlusおよびEnterpriseプランでご利用いただけます。
Email on Acid
Email on Acid は多数のメールクライアントでのプレビューの提供、およびメールキャンペーンの事前チェックをしてくれる人気のサービスで、Litmusの代替ツールです。ChromeとFirefoxのブラウザを使って、90以上のメールクライアントのメールプレビューを確認できます。
料金
- Email on Acidのすべてのプランには無料試用版があり、無料プランはありません。
- Basicsプランは月額$75からで、1ユーザーに対して無制限のプレビューを提供しています。
Email on Acidでのメール送信テストワークフロー
ステップ 1
メニューからメール送信テストツールを選択して開始します。HTMLテンプレートのメールプレビューとスパムテストを実行できます。HTMLコードはコピーして貼り付けるか、アップロードする、またはテスト用アドレス宛にメールで送信できます。
HTMLコードを貼り付けるとEmail Test Summary（メールテストの概要）が表示され、お選びになったモバイル、ウェブ、デスクトップクライアントでのプレビューが生成されます。
このテストで使ったHTMLテンプレートは、Really Good Emailsで入手しました。
ステップ 2
各クライアントでテンプレートが正しく表示されるかを手動で確認します。上記の例では、テンプレートにレンダリングの問題があることが一目でわかります。
各プレビューを開いて、上から下までスクロールし、テンプレート全体でどのような影響があるか確認することが重要です。プレビューを開くと、ビジュアルレンダリングとコード分析の概要の間を切り替えられます。なおコード分析には次の3つのタブがあります。
- コード分析 (Code Analysis)：エラーが見つかったかどうかが表示されます。
- ヒントとコツ (Tips and Tricks)：問題のリストです（例：デスクトップのOutlookではGIFがサポートされていない）。
- よくある質問 (FAQs)：特定のクライアントでの問題の解決方法についてのアドバイス。
ヒント：追加で$75を支払うと、テンプレートのコード修正を依頼できます。
ステップ 3
テスト結果を確認した後、HTMLメールテンプレートを修正し、新しいテストを作成します。結果に完全に満足するまで、繰り返し作業を行います。
ヒント：メールプレビューの結果はリンクを介して共有することもできます。
Email on Acidはメールテスト機能に加えて、次の機能も提供しています。
- キャンペーンの事前チェック：90以上のメールクライアントでのメールプレビュー、プリヘッダーのテキストチェック、アクセシビリティガイドラインの準拠、スパムテスト、ドメインブロックテスト、URLの検証、スペルチェック、画像の最適化などを含む一連のテストを実行できます。このチェックリストはLitmusの機能に似ています。
- メールエディタ：新しいメールテンプレートプロジェクトを作成するためのエディタです。テンプレートの取り込み方法はZIPファイルとしてアップロード、URLからインポート、ライブラリから選択、HTMLコードを直接入力または貼り付けができます。HTMLがどのようにレンダリングされるかを確認し、選択したメールクライアントでプレビューを生成できます。
- スパムテスト：送信者のメールを分析してくれます。提供されたシードリストにお使いのESPからテストメールを送信するか、SMTPサーバーを使ってテストを送信します。分析対象はメールサーバーの評価、設定、メールコンテンツ、件名、IPブロックリストです。
- オプティマイザー：HTMLテンプレートをすぐに改善してくれます。HTMLコードを入力すると、すぐに修正されたバージョンと提案および検証結果のリストが表示されます。
- アナリティクス：エンゲージメント、購読者、クリックアクティビティ、ベンチマーク診断を追跡できます。
Email Preview Services
Email Preview Servicesは60以上のメールクライアントを対象にリアルタイムでリアルデバイスのスクリーンショットを提供するサービスです。メールアナリティクス、受信トレイおよびスパムテスト、メールエディタも備えています。EnterpriseプランではホワイトラベルのAPIで利用できます。
料金：
- Email Preview Servicesのすべてのプランで7日間の無料トライアルがあり、無料プランはありません。
- 有料プランは月額$25のStandardからあります。
Email Preview Servicesでのメール送信テストワークフロー
Email Preview Servicesの場合、特に作業工程はないので、ステップバイステップの解説はいたしません。以下でご紹介するように、基本的にすべてが1つの流れの中で行われます。
まずPreviewsに移動し、HTMLコードを追加します。HTMLコードがない場合は、ドラッグアンドドロップのメールエディタを使って新しいテンプレートを作成します。または、emailpreviewservices.comでテスト用メールアドレスを生成し、お使いのESPまたはメールクライアントからメッセージを送信することもできます。
テストを実行した後、選択したメールクライアントごとにメールテンプレートのスクリーンショットが一覧表示されます。コード分析や修正方法についてのヒントは提供されません。特定のメールクライアントで問題が発生した場合、テンプレートを編集し、別のテストを実行する必要があります（ただしEmail Preview Servicesにはバージョンテストも提供しています）。
このテストで使ったHTMLテンプレートは、Really Good Emailsで入手しました。
なおメールプレビューおよびエディタ機能に加えて、Analyticsを使い受信者の活動を追跡したり、スパムテストを実行したりもできます。スパムテストには送信者IPの評価、スパムフィルタ、メールプロバイダーの配信レポート、ヘッダープレビュー、コンテンツ分析が含まれます。
まとめ
これで一連のメールクライアントのテストに挑む準備ができたでしょう。覚えておくべき重要なポイントは、プレビューとコードインスペクション（検証）の両方を行うか、または多数のクライアントでのプレビューだけを行うかという点です。
繰り返しになりますが、常にコードインスペクションに重点を置き、さまざまなデバイスとクライアントでのサポートを確認することをおすすめします。早速ですが、MailtrapのEmail Testingをぜひお試しください🙂
