HTMLメールコーディング

提供:Wiki@KDS
2007年2月5日 (月) 11:59時点におけるAkama (トーク | 投稿記録)による版
ナビゲーションに移動 検索に移動

HTMLメール(えいちてぃーえむえるめーる)は、毎週金曜日に高島屋が配信しているメール。

お歳暮、バレンタインデーなどの際にはそれ以外のスケジュールで配信されることもあり。

基本的には、定型レイアウト(右のキャプチャ画像参照)だが、上部の緑で囲まれたあいさつ文がなかったり、下のバナーがなかったりといくつかのバリエーションがあり。また、通常スケジュールで配信される以外のものはまったく違うデザインだったりもする。

定型レイアウトのものに関してはHTMLメール作成君を使って作成。ただし非定型レイアウトのものや修正などは手作業で行う必要があるので部品の構成やコーディングのやり方は把握しておく必要があり。

部品の構成と仕組み

配信用のHTMLファイル(index_mail.html)とそれを見ることができない人のためのサイト置き用HTMLファイル(index.html)、アクセス解析をするためのリダイレクト用HTMLファイル、同一フォルダ内に置く画像ファイルから構成される。
リダイレクト用HTMLファイルは上部バナー用(banner.html)、下部バナー用(banner2.html)、ピックアップアイテム用(detail01~06.html)から構成される。
全てのHTMLファイルと画像ファイルを高島屋本サーバ上(/link/mail/YYmmdd/)以下、たとえば2006年10月27日配信分であれば(/link/mail/061027/)以下に置く。実際の配信は高島屋さんがやるのでこちらの作業はこれで終了。

コーディングの際の注意事項

Webメール(Hotmail、Yahooメール)などでCSSをフルに使ったレイアウトが乱れるので、 一部のプロパティを使うことができない。JavaScriptは当然不可。HTMLタグ、CSSプロパティで使用不可のものは以下の通り。

使用不可のHTMLタグ

  • 外部CSSへのリンク(<link rel="stylesheet" href="~">
  • emタグ(CSSでスタイルを指定してもイタリック体などになる)
  • <head></head>タグ(CSSの記述は全て<body></body>内に記述)

使用不可のcssプロパティ

  • margin(Hotmailですべて無視される:代わりにpaddingを使用)
  • float及びclear(代わりにtableタグを使用)


その他の情報はCSSのサポート情報:Hotmail, Yahoo! Mail and Gmail(英文)を参考のこと。