代码之家  ›  专栏  ›  技术社区  ›  HandiworkNYC.com

HTML电子邮件:表格还是沙发?

  •  72
  • HandiworkNYC.com  · 技术社区  · 15 年前

    HTML电子邮件时事通讯的HTML/CSS是否需要采用表格格式,或者我可以使用DIV,并保证它能够很好地显示跨电子邮件客户端?我下载了许多模板来查看它们是如何完成的,基于这些模板我自己创建的,而且它们似乎都使用表。

    非常感谢您的洞察力,谢谢!

    4 回复  |  直到 7 年前
        1
  •  133
  •   PatrikAkerstrand    15 年前

    当涉及到电子邮件HTML时,请注意Web开发中的所有最佳实践都会出现在窗口之外。要使外观一致,您应该:

    1. 使用基于表的布局
    2. 对表格使用旧的学校属性样式
    3. 只使用内嵌样式,并且只使用非常简单的样式。 <style> -标签被许多客户机丢弃。
    4. 跳过使用 <html> , <head> <body> -不管怎样,大多数客户都会丢弃它们。
    5. 如果嵌入了图像,请尝试确保即使未加载图像,电子邮件看起来也不错。许多客户机要求用户在显示图像之前将电子邮件标记为“安全”。

    您可以在此处阅读上述要点的更详细版本:

        2
  •  9
  •   CafeHey    13 年前

    就像这里所有人都说的,使用表格和内联所有的CSS…但是有一个电子邮件应用生态系统来帮助你建立电子邮件。

    我一直在使用 Mailrox ( https://www.mailrox.com/ )对于我最近建立的大多数电子邮件,它似乎是相当不错,输出完美的HTML电子邮件,如果你正在建立一个设计,即使它是在测试版。

    您也可以尝试从 Mailchimp Campaign Monitor 但听起来你的电子邮件设计得很好,所以mailrox可能是最好的。

    如果你真的想建立电子邮件,我会说,忘记你所知道的大部分关于现代网页设计和主表布局,并使用帕特里卡克尔斯特拉德的链接。

    Litmus 也非常适合测试你的手工编码设计。他们会在所有的电子邮件客户中给你预览你的电子邮件。

    希望这有帮助。

        3
  •  4
  •   fb55    15 年前

    许多电子邮件客户端无法呈现CSS。我会用表格来格式化你的邮件,用图片来做其他事情。

        4
  •  1
  •   Alexandra    9 年前

    正如已经提到的,您的HTML电子邮件应该使用表(而不是div)来构建。你也可以添加CSS——两者都使用外部样式表,但这不会被所有电子邮件客户端接受,所以实际上添加你的CSS更可靠。即使这样做,某些电子邮件客户机可能会忽略某些属性,因此只要有HTML属性可用,您最好还是使用这些属性。”您必须这样做,因为有些客户机(如Gmail)会忽略或删除您的标记内容,或忽略它们。“来源: http://webdesign.tutsplus.com/articles/creating-a-simple-responsive-html-email--webdesign-12978

    除此之外,我还通过反复尝试了解到,即使是图像也必须剪切到您希望在电子邮件中显示的大小。Outlook如果在获取图片的宽度/高度的HTML属性时很糟糕的话,我也看到过一些令人讨厌的拉伸邮件,这仅仅是因为这些属性被忽略了,图片显示为全尺寸。