最佳做法及；编写HTML电子邮件时的注意事项

我已经开发网站十多年了，但很快发现我的许多为网络开发的习惯在为电子邮件客户端开发时是无用的。这给我带来了巨大的挫折，所以我想我要问一个问题：

对于像我这样不时为gmail、outlook等进行设计的人来说，最佳实践和必要考虑是什么

示例：

..

与内联CSS

---

简言之：什么从网络世界转移到电子邮件世界，什么不转移？

内联css和表格-想想2000年左右的web开发，你会没事的。CampaignMonitor有一个很好的资源，可以帮助电子邮件客户端处理哪些内容。也用于测试-省去了发送大量测试的麻烦

我（在相当长的时间里）为我的工作做这些已经有一段时间了。HTML电子邮件有很多陷阱。不同的电子邮件客户端以不同的方式呈现HTML，使IE6看起来更高级

这是我到目前为止所学知识的总结

• 使用内嵌CSS：并不总是支持样式
• 使用表格布局：我知道，但是div布局依赖于css，许多电子邮件客户端无法处理
• 不要使用rowspan：这会导致奇怪的间距问题
• 不要使用背景图像：对这些图像的支持有限
• 使用“display:block”设置图像标记样式。：这修复了hotmail中奇怪的间距问题
• 如果使用多个表将它们嵌套在一个父表中：这将停止更奇怪的间距问题
• 不要使用Javascript：同样，支持得不太好
• 确保您的电子邮件清晰易读，没有图像：用户可能无法加载这些图像
• 提供一个在线版本和链接：这可以让用户看到预期的内容，即使他们的电子邮件客户端很糟糕
• 测试，测试，测试：仅仅因为它在一个电子邮件客户端中工作并不意味着它在其他客户端中工作。一个大问题是Outlook 2007。它使用word来呈现HTML（叹气）

---

这远不是一个全面的列表，但应该会让大多数人走上正确的道路。

对于任何试图学习HTML电子邮件的人来说，这似乎是一个列出一些资源的好地方。这可能是你在网上能找到的最全面的HTML电子邮件资源列表。快乐学习

入门指南：

CSS支持和一般指南：

您应该始终在html电子邮件中内联CSS。这是一份清单

响应指南：

模板和框架：

响应性备选示例：

此外，上面的Ted Goas响应链接还有一个极好的流体示例

故障排除和一般指南：

您需要使用以使背景图像在Outlook中工作（例外）。以下是一些VML链接：

---

这里还有mailchimp提供的一些指南：