株式会社ディレクタスディレクタスはデータドリブンなOne-to-Oneコミュニケーションをクロスチャネルで実行するために必要なサービスをワンストップで提供します。本コラムの前編は下記よりご覧いただけます。【コラム】Eメールのスマートフォン対応してますか?(前編)スマートフォンでHTMLメールはどのように見えているのか?レスポンシブメールのサンプルをご紹介する前に、レスポンシブデザインにしていないHTMLメールが各デバイスやメーラーでどのように見えているのかをまとめておきます。(表1)赤枠で囲ったスマートフォン部分をご覧ください。見えない状態)になります。可能となっていますが、Android4.0以上が対象となっているため、2.3以前の端末では依然として横スクロール問題が残っています。その他のメーラーでは、PC版が縮小された状態で見えます。1では、PCサイズのままで表示されるため、横スクロールしないと全体が見えません。2では、PC版が縮小されているため、本文や右カラムのテキストが小さく読みにくいですね。このようにスマートフォンでのHTMLメールの閲覧には、「PC版が縮小されて表示されるためにテキストや画像が見にくい」「クリックしにくい」という課題と、そもそも全体が表示されないメーラーがある、という大きく2つの課題があります。レスポンシブメールとは?この課題をクリアするのがディレクタスのレスポンシブメールです。実際のレスポンシブメールが各メーラーでどのように表示されるのか先ほど事例に使ったメールで見てみましょう。通常のHTMLメールでは、一部しか表示されていなかったHTMLメールも、デバイスの幅に合わせて調整され、最適化されていますね。レスポンシブメールは、シングルソースでデバイス/メーラーにより3種類の表示にわかれます。1:PC版2:スマホ版[フル](デザイン対応可)3:スマホ版[ライト](横幅対応のみ)各デバイス/メーラーで表示されるメールは以下のとおりです。先ほどのキャプチャでは3種類の表示の違いがわかりにくいので、レスポンシブメールのサンプルで3種類のメールを比較してみましょう。スマートフォンに最適化されています。スマホ版[ライト](横幅対応のみ)は、横幅がデバイスの幅に合わせて調整されるので、画像が縮小され、テキストは横幅に合わせて改行されますが、レイアウトはPC版と同じです。レスポンシブメールをデザインする際は、この3種類の表示を前提にデザインをします。PC版とスマホ版[ライト](横幅対応のみ)はレイアウトが同じなので、ある程度どちらのデバイスでの表示を優先してデザインするのかを決めておくと、スムーズです。ディレクタスでは、ローソンHMVエンタテイメント様のご協力により、レスポンシブメールの効果検証を実施いたしました。この結果につきましては、あらためて弊社サイト上にてご紹介いたします。2008年より株式会社ディレクタスにてEメールマーケティングに従事。