5

一位设计师使用 CSS 最佳实践编写了一个 html 模板。我想将此模板用作电子邮件通讯模板，但我听说有人说 hotmail、yahoo 和 gmail 对 CSS 的支持有限。

我应该使用表格布局和字体标签重新编码这些模板吗？

4

5 回答 5

11

简短的回答是Yes。

通过尽可能使用最基本和最简单的 HTML，您将获得跨网络邮件帐户和电子邮件客户端的最佳兼容性。

  • 不要使用任何 CSS 文件或 <style> 标签。内联做所有事情。
  • 使用具有明确宽度的嵌套表处理定位
    • 在这些情况下，我大量使用 HTML 注释，以确保我不会对我在布局中的位置感到困惑。
  • 所有文本都应该被带有字体样式信息的 <font> 标签包围。
  • 图片应该有明确的宽度和高度。
    • 这有助于电子邮件在图像被阻止时保持其正确的布局。

我通常至少测试以下内容：

  • 展望 2003
  • 展望 2007
    • 你的大部分头痛都来自这里。
  • 雷鸟
  • 随行人员（OSX 版本的 Outlook）
  • 邮箱
  • 热邮件
  • 雅虎邮箱

如果您在所有这些上都得到了正确显示的东西，那么您通常处于非常好的状态。

我们使用 Exact Target，他们有 HTML 预览功能，但并不完美。我遇到过很多情况，其中一封电子邮件在预览中看起来不错，但在 Outlook 2007 中仍然出现问题。

于 2009-01-30T19:24:01.900 回答
4

上面的 Mark 说了开发电子邮件模板所需的一切（又是 90 年代），但我想添加最后一件事：

http://www.email-standards.org/是了解不同电子邮件客户端如何解释 HTML 和 CSS 的绝佳资源。

于 2009-01-30T19:30:41.747 回答
1

以马克所说的为基础：

如果可能，请完全避免使用 CSS（不过，对于文本之类的东西通常没问题）。使用表格进行所有定位，空<td>元素用于填充/较小的定位位。

即使有这一切，它也只会在一些电子邮件程序/网站中看起来很完美。HTML 电子邮件，我相当有信心地说，完全不可能以这样一种方式完美地显示在所有邮件客户端/应用程序中。

于 2009-01-30T19:26:51.273 回答
1

您必须回到石器时代的 HTML，才能按照 Mark 的建议处理 HTML 电子邮件。html 中内联的所有样式。没有 STYLE 标签或外部样式表。

MailChimp和CampaignMonitor都提供出色的免费 HTML 电子邮件模板。他们还提供电子邮件测试服务，将您的 html 电子邮件发送到几个不同的电子邮件客户端，然后将结果的屏幕截图发送给您。

于 2009-01-30T19:32:06.003 回答
1

使用具有固定高度/重量的 div 标签并将所有 HTML 放入其中。在大多数客户中看起来都是一样的。我以前试过，效果很好。

于 2011-04-13T15:43:56.743 回答