先日、HTMLメールの作成依頼を受けたのですが
- HTMLメールについては初心者、ド素人ともいう
- メルマガの発行部数は数十万部
というわけで事前に色々と調べました。
むしろ調べるを得ない。
ヘッダーのサンプルソース
しょっぱなから悩みました。
書き方はともかく、ソースの先頭にズボボーッ！
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-2022-jp">
<meta http-equiv="Content-Language" content="ja">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>ここにタイトル</title>
<style type="text/css">
<!--
body { color: 2a2a2a;}
a:link { color: #00f; }
a:visited { color: #800080; }
a:hover{ color: #f00; }
-->
</style>
</head>
CSS書いてますけど、信用ならない。理由は後述
HTMLメールはtableコーディングで
「僕はdivタグとfloatプロパティで楽勝＾＾」
というわけにもいかないようです。
一応、CSSは使えるけど
メーラーによっては効かんようです。
サンプルソース
//tableコーディングのサンプル <table width="400" summary="サンプルコンテンツ"> <tr><th colspan="2" abbr="コンテンツの見出し">サンプルですけど何か</td><tr> <tr> <td>左側です</td> <td>もちろん右です</td> <tr> </table>
出力
| サンプルですけど何か | |
|---|---|
| 左側です | もちろん右です |
CSSの使用はインラインで
それが無難なようです。
なんでもメーラーによって（ry・・・
サンプルソース
<span style=" font-size: 18px; color: #090;">ちなみにインラインってこんな感じ</span>
出力
ちなみにインラインってこんな感じ
画像は絶対パスで
○良い
<img src="http://0402.hogehoge.com/img/hoge0402.jpg">
×残念
<img src="img/hoge0402.jpg">
コーディング中に違和感でたぶん気づくと思うけど
見落としがちかな・・・と思います。
