HTML电子邮件:表或divs?

HTML电子邮件通讯的HTML / CSS是否需要以表格格式,或者我可以使用DIV等同的保证,它将显示良好的交叉电子邮件客户端? 我已经下载了一些模板,看看它们是如何完成的,我自己也是基于这些模板的,他们似乎都使用表格。

任何洞察力非常感谢,谢谢!

说到电子邮件HTML,请注意,Web开发的所有最佳实践都离开了这个窗口。 为了使外观一致,您应该:

  1. 使用基于表格的布局
  2. 使用old-school属性样式表格
  3. 只使用内联样式,只有非常简单的。 许多客户都丢弃了标签。
  4. 跳过使用<html><head><body> – 无论如何,它们将被大多数客户端丢弃。
  5. 如果您embedded图像,请尽量确保电子邮件看起来不错,即使图像未加载。 许多客户要求用户在显示图像之前将电子邮件标记为“安全”。

你可以在这里阅读更详细的上述观点:

就像在这里所说的一样,使用表格并内嵌所有的CSS …但是有一个电子邮件应用程序生态系统可以帮助您构build电子邮件。

我一直在使用Mailrox ( https://www.mailrox.com/ )来查看我最近的大部分电子邮件,而且看起来好极了,输出完美的HTML电子邮件,如果您正在从devise中构build一个,甚至尽pipe它处于testing阶段。

您也可以尝试从Mailchimp或Campaign Monitor预先构build的模板,但听起来像您有一个devise的电子邮件,所以也许Mailrox是最好的。

如果你真的想进入build设性的电子邮件,我会忘记大部分你知道现代网页devise和主表格布局,并使用从PatrikAkerstrand链接。

石蕊试纸也非常适合testing手工编码的devise。 他们给你几乎所有的电子邮件客户端的电子邮件预览。

希望这可以帮助。

许多电子邮件客户端不能呈现CSS。 我会使用表来格式化您的邮件,并使用图像的任何其他。

正如已经提到的 – 你的HTML邮件应该使用表(而不是div)来构build。 你也可以使用外部样式表来添加CSS,但是这不会被所有的电子邮件客户端所接受,所以添加你的css内联更加可靠。 即使这样做,某些电子邮件客户端可能会忽略某些属性,所以只要这些属性可用,最好的办法就是使用HTML属性。 “你必须这样做,因为有些客户端,比如Gmail,会忽略或去掉你的标签内容,或者忽略它们。 资料来源: http : //webdesign.tutsplus.com/articles/creating-a-simple-responsive-html-email–webdesign-12978

除此之外,我还通过反复试验了解到,即使是图像也必须按照您希望显示在电子邮件中的确切大小进行裁剪。 Outlook如果在为图像的宽度/高度提取HTML属性时感到可怕,而且我看到一些讨厌的延伸电子邮件,只是因为忽略了这些属性,并且图像显示为全尺寸。