HTMLメールを作りたい！

レポート · Feb 04, 2021

皆様こんにちは。

HTMLメールの制作をしておりまして、Webと違って画像・フォントなどのインライン化が必要だと知りました（イラレの画像埋め込み・アウトライン化のようなもの…？）。

そこで、Dreamweaverの機能にCSSをHTMLに組み込むことができるプラグインはありますでしょうか。

なかなか、そのような都合のいいものはないと思いますが、もしございましたらご教示いただけないでしょうか。

レポート · Feb 05, 2021

HTMLメール、私も偶に業務でやりますが、正直もう苦行でしかないです。いまだにテーブルでガリガリ組んでます。

最近はシステム側で用意されたテンプレートを組み合わせて使用する場合が多いように思いますが、そうでない場合は基本的にすべてHTMLコードでやる必要があります。Webよりも遙かに泥臭いコーディング作業です。

HTMLメールはメール文章の中ですべて完結する必要があるので、画像のパスはすべてHTTPから始まるフルパスで記述します。
CSSも外部に置けないので、各HTMLタグ内にStyle属性でCSSを直接記述します。これが「インライン化」にあたるもので、以下のような記述になります。

<!-- ヘッダー -->
<table width="100%" border="0" cellpadding="20" cellspacing="0">
<tr>
<td valign="top" align="left" style="background-color:#000000;">
<img src="https://mysite.com/image/logo.png" alt="LOGO" width="250" height="50" style="max-width:100%;color:#ffffff;">
</td>
</tr>
</table>

HTMLメールはWebサイト作成よりも注意する部分が多いので、まずはHTMLメール作成についての情報収集と、もしメール配信システムをご利用であればHTMLメール作成ツールを提供している場合もありますので、まずはそちらから始められることをお奨めします。

レポート · Feb 05, 2021

大変わかりやすいご説明をいただき、ありがとうございました。

CSSと別組みだったのをすべてHTMLに記載しないといけないのですね。

無料でテンプレートも配布されているものもあるようですし、Dreamweaverにとらわれず、いろいろ調べてやってみようと思います。

併せて記述いただいたHTMLタグ、参考にしたいと思います。