マーケティングコラム

メールマガジンの制作でおさえておくべき!メーラーごとの表示の違いとは?

「メールマガジンの新規媒体を立ち上げたい」
そう考えてプロジェクトをスタートするとき、特に注意すべきなのはどのような点だろうか。

メールマガジンの媒体名・タイトル・コンテンツの内容、配信頻度、配信ターゲットなど、新規媒体を立ち上げる際に考えるべき事項は多数ある。
その中でも、実際に配信する原稿を制作する際に意識しなければならない重要な視点の1つが、「受け取った人のPCで、そのメールがどのように表示されるか」というものだ。

PCのメールアドレスに送るメールの場合、テキストメール・HTMLメールともに、受け取る人がどのようなメーラーを使用しているかによって、そのメールの表示が異なる場合がある。
ここでは、このような「メーラーごとの表示の違い」について、ご紹介したい。

■メーラーの種類

ここで、「メーラー」と呼んでいるものには、ソフトウェアをインストールして使用する「メールソフト」と、インターネット上でサービスを提供している「ウェブメール」の2種類がある。

メールソフトの代表的なものとしては、Microsoftが提供している「Outlook Express」などが挙げられ、ウェブメールでは、「Yahoo!メール」「Hotmail」「Gmail」などが挙げられる。

メールソフトとウェブメールでは、3つの大きな違いがある。

1つ目は「動作環境」である。PCにインストールして使うメールソフトに対し、ウェブメールはインターネット上で使用するサービスだ。そのため、ウェブメールはInternet Explorerなどのインターネットブラウザを通して表示される。

2つ目に「ユーザーの環境」が挙げられる。メールソフトは基本的に、インストールされたPCでしかメールを受信することができない。一方でウェブメールは、インターネットにアクセスできるPCさえあれば、どんな場所でもメールの受信が可能となる。

そして3つ目は、「更新方法」である。メールソフトのバージョンアップなどの更新はユーザー自身が更新していかなければならないが、ウェブメールは提供している企業がバージョンアップを行うため、ユーザーはアクセスするたびに最新のサービスを使用することができる。

以上がメールソフトとウェブメールの違いだが、メールを制作する際は、さらに各メーラーの特性を知っておく必要がある。例えば同じウェブメールでも、「Yahoo!メール」と「hotmail」では、メールの表示の仕方が異なることがある。せっかく時間をかけて奇麗にレイアウトしたメールも、受け取るユーザーの使用するメーラーによって、表示が崩れてしまう可能性があるのだ。

では、どのような崩れ方があるのか、そして制作する際にどこに気をつけるべきなのか。ここからはテキストメール、HTMLメールそれぞれの表示の違いと注意点を挙げていく。

■テキストメールでの表示の違い

テキストメールを制作するにあたり、メーラーごとの表示で気をつけなければならないのは、罫線やAA(アスキーアート)といった、「飾り」の部分である。

テキストメールの表示は、メーラーの種類によって異なる。その原因は、「使用しているフォント」の違いである。「たかがフォント」と侮るなかれ。場合によっては、大きな表示崩れを起こしてしまう可能性もあるのだ。

フォントには大きく分けて2つの種類があることをご存知だろうか。
1つは、文字毎に文字幅が異なる「プロポーショナルフォント」、もう1つは文字幅が同一の「等幅フォント」である。

プロポーショナルフォントは、例えば「っ」や「ゃ」などの小さい文字の場合、その左右の余白を詰めることで、文章全体を読みやすくする。一方の等幅フォントでは、「っ」も「あ」も「幅」もすべて同じ「1文字分」と計算して表示される。
例えば「あいうえお」と「とうきょう」では、等幅フォントでは同じ5文字分の長さとなるが、プロポーショナルフォントでは長さが異なって表示される。

文章であれば、「プロポーショナルフォント」であっても「等幅フォント」であっても、読む際にはあまり気にせずに読み進めることができる。
このフォントの違いによってテキストメールの表示上で最も見やすさに影響が出るのが、罫線やAA(アスキーアート)といった、「飾り」の部分である。

例えば、以下のような飾り文字を作成したとする。

等幅フォントによるAA(アスキーアート)

こちらは、等幅フォントで表示させると、上記のようになるが、プロポーショナルフォントで見ると、下記のようになる。

プロポーショナルフォントによるAA(アスキーアート)

このように、レイアウトが崩れてしまい、時には文章自体も読めなくなってしまう。

メーラーによって、このプロポーショナルフォントと等幅フォントのどちらを採用しているかが異なっており、メールソフトでは使用するフォントをユーザーが設定できるため、メールの送信者はユーザー(受信者)がどちらのフォントでメールを読んでいるかは判別できない。

一方、ウェブメールはそれぞれフォントが指定されている。さらに、テキストメールであっても独自のスタイルシートの導入によって、レイアウトが変更されるものもあり、プロポーショナルフォントや等幅フォントの違いだけではない、異なった表示になる場合がある。
例えば、行間を少し広くとるウェブメールの場合、数行で1つの四角を表現しているのに、行間が空きすぎているため、四角に見えない、といったことも起こりやすい。

テキストメールを制作する際は、等幅フォントでの表示を前提として制作するのが基本だ。その際も、プロポーショナルフォントで表示されることも想定しながら制作するか、もしくは「このメールは等幅フォントでご覧ください」といった注意書きをメール内に記載する、などの対応策が望まれる。

■HTMLメールでの表示の違い

HTMLメールを制作する場合に気をつけなければならないのは、「より多くのメーラーでHTMLメールを正しく表示させるためには、HTMLメールのソースは、現在のウェブページでのソースとは異なる書き方をしなければならない」ということである。

そもそもHTMLメールでは、外部のスタイルシートを読み込むことができない。そのため、1つのHTMLファイルの中に、レイアウトを指定するためのCSSを収めるべきであり、できる限りCSS部分をシンプルに書く必要がある。

また、ウェブページ制作で標準とされるいくつかのタグ要素が、HTMLメールでは反映されないため、当社のコーポレートサイトのようなウェブページと同様のソースでHTMLメールを制作してしまうと、表示崩れが発生してしまう恐れがある。「HTMLメールは、ウェブページとはソースの書き方が異なる」ということを、まずは念頭に置いて進めるべきである。

さらに、HTMLメールにおいても、テキストメール同様、メーラーの種類によって表示の仕方が変わる。
テキストメールでは、使用されるフォントの違いによって表示が大きく異なるが、HTMLメールの場合は、「メーラーによって使用できるタグが違う」ことにより表示が異なってくる。

例えば、あるウェブメールでは、背景画像を指定しても表示されない。そのため、「メールの背景に水玉模様などの模様を敷きつめたい」と考えてメールを制作しても、そのウェブメールで受け取ったユーザー(受信者)には、その模様が表示されずに、シンプルなメールが届いてしまうのである。

このような仕様の特性はウェブメールだけではなく、それぞれのメールソフトにも使用できるタグと使用できないタグが存在する。

そのため、HTMLメールを制作する場合は、「どのメーラーに対応したメールを制作するのか」を考えておく必要がある。

どのメーラーを対象とするか、については、そのメールを受け取る対象者のアドレスを確認するのも1つの方法である。アドレスに特定のウェブメールが多いようであれば、そのウェブメールでは問題なく表示されるように制作すれば「多くのユーザー(受信者)は制作者の意図通りの表示でメールを見ている」と考えることができる。また、ウェブメールのアドレスではないものが多い場合は、表示確認の対象となるメールソフトの種類を少し充実させることが望ましい。

■メーラーは日々変化していく

メールを制作するにあたり、意識していくべきことは、「メーラーもインターネットブラウザや他のソフトウェア同様、バージョンアップしていく」ことである。

メールソフトはバージョンアップした製品がリリースされるが、バージョンアップしたことで、これまでの仕様と変わる場合があり、前回までは使用できたタグが今回のバージョンアップでは表示されない、ということもある。
また、バージョンアップの製品がリリースされたとしても、ユーザーがその製品に切り替えない限り以前のバージョンを使い続けるため、新しいバージョンだけに対応した制作を行うには注意が必要である。

さらに注意すべきは、ウェブメールである。ウェブメールのバージョンアップは、公表されずにひっそりと行われることもある。そのため、「昨日まで問題なかったソースなのに、今日は表示崩れが発生した」といったことが起きてもおかしくないのである。

これらへの対策としては、

  • 各メーラーの特性を知り、それぞれの表示の仕方を把握すること
  • どのメーラーに対応したメールを制作するか、事前に決めておくこと
  • 定期的にメーラーでの表示検証を行い、バージョンアップに対応すること

などが挙げられる。

エクスペリアンジャパンでは、これまでの制作と定期的な表示検証による各メーラーについてのノウハウに基づいた制作を行っている。また、メーラーのシェアを意識して設定した標準メーラーを対象とした制作から、クライアント様の要望に応じた特定メーラーでの検証も可能なので、メールの表示について不安や要望をお持ちの方は、ぜひ当社までお問い合わせいただきたい。

2012年6月18日
(執筆者:金子 亜美)

 

WEBからのお問い合わせ・資料請求
お問い合わせ・資料請求フォーム

開封エンゲージメントサービス

株式会社アマナ様
マルチデバイス時代のメールマーケティングコミュニケーション最適化への取り組み

クリエイティブサービス

ガシー・レンカー・ジャパン株式会社様
CV率2 .2倍。スマートフォンユーザーに伝えたいメッセージをダイレクトに訴求するレスポンシブメール。

CCMP

American Eagle Outfitters様
2週間で800万人以上にリーチ!ホリデーシーズンを通じて効果的なクロスチャネルマーケティングを実践。

開封エンゲージメントサービス

ピーチ・ジョン様
メールが読まれている時間を計測して気づいた スマートフォンへの最適化でコンバージョンUP!

レコメンドconnector

イチオク様
クラウド環境で利用可能なレコメンドconnectorの導入により、短期間でレコメンドメールの開始が可能に。クリック率7倍、CV率5倍、開封率3倍を1ヶ月で実現!