「WEBサイト制作」と「メール制作」、
どちらもWEBディレクターがプロジェクト推進・品質管理を行う仕事です。
ところが、いざ、実際にディレクションしてみると、
両者それぞれで制作の進め方・意識すべきポイントが、けっこう異なります。
今回は、特に「メール制作」のディレクションを行う上での注意点
「WEBサイト制作」と比較した時の違いをご紹介します。
※4つのポイントを、前・後編に分けて連載します。
＜前編＞
◎チャネル特性の違い
◎原稿の違い
＜後編＞
◎ブラウザとメーラーの違い
◎リリースの仕方の違い
後編はこちら＞「WEBサイト制作」と「メール制作」の違い ４つのポイント（後編）
チャネル特性の違い
＜WEBサイトの場合＞
その掲載内容に関心を持ったユーザーにアクセスされます。ユーザーの関心が高い状態・タイミングで閲覧されるので、能動的な態度で内容を読んでもらえます。
＜メールの場合＞
メールの場合、一度、購読者登録をした後は、メールを受け取るタイミングは送り手次第です。購読者は、ただメールが届くのを待っています。
メールは情報の受け取り方が受動的です。
そのため、件名や内容でユーザーの興味・関心を引き起こすことがとても重要です。
興味・関心を起こせなければ、そもそもメールは開封もされませんし、
WEBサイトに載せている情報をメールですべて伝えようとすると、
わかりづらい印象を与え、読み途中でメールを閉じられてしまうおそれがあります。
メールはコンテンツへのフックと割り切り
・メールはコンテンツのポイントをしぼって簡潔に
・詳細はリンク先のWEBサイトで紹介
と、メールの役割にあった内容を意識して構成するのが基本です。
原稿の違い
WEBサイトの場合、各ページはHTMLで制作するのが基本です。
メールの場合、原稿の種類としては、HTMLとテキストの2種類があります。
それぞれにメリット・デメリットがあるので、
メールの目的やスケジュール、予算などに応じて、
どちらのメールを使うか検討してください。
※詳しくは過去記事 「HTMLメールってどんなメール？」 をどうぞ。
■HTMLメールの特性
HTMLメール用のHTMLには、WEBサイト用のHTMLとは異なる、
HTMLメール特有の作り方があります。
（１）テーブルレイアウトでコーディング
現在ではWEBサイトはCSSを使ってレイアウトするのが通常ですが
HTMLメールの場合は、テーブルレイアウトでコーディングするのが一般的です。
メールの場合、メーラーごとにCSSの解釈が異なることから、
メーラーの違いによる表示崩れが起きやすくなります。
テーブルレイアウトで、画像やスペースなどのサイズを厳密に指定することで
メーラーの違いによる表示崩れの発生を少なくすることができます。
※メーラーごとの特徴については
過去記事「メールの表示検証って、どうしたらいい？」でご紹介しています。
（２）外部CSSへの対応
WEBサイト制作の場合、サイト内で共通するスタイル設定には、
メンテナンス性を考慮して外部CSSファイルを読み込ませるケースが多くあります。
メールの場合、ほとんどのメーラーが外部CSSファイルを読み込めません。
そのため、CSSは、HTML内へ インラインで記述します。
ただし、これには例外もあり、
スマートフォンの標準メールアプリは、外部CSSを読み込むことができます。
デバイス・環境ごとの外部CSSへの対応を簡単にまとめると、下記のようになります。
こうした特徴をふまえ、ディレクタスが提供するレスポンシブメールでは、
外部CSSファイル・インラインCSSを併用することで、
・PCメール
・スマートフォン（CSS無効）
・スマートフォン（CSS有効）
と、３つの閲覧環境ごとに最適なデザインが表示されるよう
出し分けを行うことができます。
※Eメールのスマートフォン対応について詳しくは下記の記事をどうぞ。
「【コラム】Eメールのスマートフォン対応してますか？（前編）」
「【コラム】Eメールのスマートフォン対応してますか？（後編）」
