如何创建 HTML 电子邮件以在所有电子邮件客户端中工作？

Question

我知道这是一个模糊的问题，但我将不胜感激任何指导。我的客户有一个电子邮件订阅者列表，他将 HTML 电子邮件发送到该列表。问题在于，当不同的电子邮件客户端查看时，电子邮件看起来不一致。例如，一封电子邮件在 Gmail 中可能看起来不错，但在 Outlook 或 AOL 中却很糟糕。

对于这个问题，是否有一种适合所有的解决方案？也就是说，是否有我可以使用的特定 CSS 规则等？谢谢你的帮助。

Answer 1

HTML 电子邮件本质上在每个电子邮件客户端中看起来并不完全相同，因为 CSS 和媒体查询支持因客户端而异。不过，您可以采取一些步骤，使它们看起来相当一致并优雅地降级。

我从这里开始： https: //webdesign.tutsplus.com/tutorials/creating-a-future-proof-responsive-email-without-media-queries--cms-23919这是一篇关于构建流畅电子邮件的精彩文章您可以用作创建其他电子邮件的基础的模板。它还包括电子邮件的源代码。

一旦您的电子邮件被编码，您可以使用Litmus之类的服务进行检查，以查看它在许多客户端/设备上的外观。Litmus 也非常适合解决电子邮件问题。

最后查看 Campaign Monitor 的 HTML 电子邮件 CSS 支持列表：https://www.campaignmonitor.com/css/这是全球 10 个最受欢迎的移动、Web 和桌面电子邮件客户端的 CSS 支持的完整细分。

至于 Outlook，这确实很麻烦，但请确保使用 Outlook 条件标记专门针对 Outlook。查看此线程中的第一个答案，了解条件标签的完整概要。额外提示：如果您将样式放入 Outlook 条件标记中，请确保使用 !important 并在其前面添加一个空格。

Answer 2

粗略地我可以列出一些可以帮助你的做和不做的事情

1. 始终使用嵌套表而不是 div 来创建 HTML
2. 不要忘记将纯文本部分与 HTML 一起添加，这样邮件就不会在“查看为 HTML”设置为 NO 的地方被修剪掉。
3. 始终使用内联 CSS

4. 优化您的图像，使其不超过 72ppi。

5. 永远不要使用背景图片。

6. 永远不要使用外部链接的 CSS。
7. 不要在整个消息中使用单个图像
8. 在为电子邮件编写 HTML 时，请考虑它与网页不同。是的，它们确实是不同的，因为 Web 浏览器比电子邮件客户端能够呈现 HTML。