前言
虽然现在的 Email Client 有在进步, 但是比起 browser 还是差太远了. 假如你用 HTML5 + CSS3 的方式去写 Email Template 的话是不行的.
这篇特地学习一下如何写好 Email Marketing HTML Template.
参考
Youtube – The RIGHT WAY to Build HTML Email Templates 2022
Youtube – HTML Email Template Built the RIGHT WAY - 2022!
DOCTYPE, html, meta
DOCTYPE
我们写网页的 DOCTYPE 是这样的
<!DOCTYPE html>
但在 email client, 这个是不 ok 的.
参考: Which Doctype Should I Use in HTML Email?
要用 XHTML 1.0 Transitional doctype
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
html
<html xmlns="http://www.w3.org/1999/xhtml">
meta
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
提醒, IE=edge 和 viewport 和平常的网页是一样的
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
Standard CSS Reset
body { margin: 0; } table { border-spacing: 0; } td { padding: 0; } img { border: 0; }