我们在HTML电子邮件中是否仍需要使用<font>标签?

36

我要接手一个构建我们HTML电子邮件的人的工作,但模板中充满了字体标签。这真的有必要吗?我知道电子邮件中CSS的支持并不好,但如果我在容器上设置文本的内联样式,就像这样...

<td style="font-family:Arial, Helvetica;color:#555555;font-size:12px">

如果是这样,那么这将适用于大多数电子邮件客户端。 根据我所做的测试,这似乎是正确的,这篇文章也证实了这一点。

是否真的需要在HTML电子邮件中使用<font>标签?有人想发表意见吗?

2个回答

73

不幸的是,被接受的答案是不正确的,即使像@MrMisterMan的帖子这样令人讨厌的东西仍然是“de rigeur”。

尽管它可能已经过时,但仍然是唯一可以在几乎所有电子邮件客户端中通用的标签。请记住,电子邮件不是互联网,它仍然非常古老。一些电子邮件服务会做出难以置信的事情;我遇到过一个盲目剥离所有HTML标记(忽略提供的纯文本版本),将链接图像转换为附件,导致无法阅读的混乱。面对这种破坏行为,甚至考虑将内联样式工作真正变为愿望。

你想知道哪里有大漏洞吗? Hotmail。 Hotmail、live.com和outlook.com剥离或替换内联样式,是的,甚至在2013年也是如此。怪微软:hotmail、live、outlook.com和outlook在过去几年中都变得更糟了(例如,浮动从outlook.com中删除了6个月; outlook在2007年放弃了背景图像,从那以后就再也没有看到过)。

内联样式在Gmail中工作,但它会剥离body标签之外的任何内容。一些企业邮件过滤器(如BlackSpider/WebSense)正好相反,因此,如果您想完全确定样式,您需要在head标签中放置样式标签,另一个副本在body中(无效,但起作用),相同的样式内联(参见premailer项目),最后使用font标签相同的样式。是的,这很疯狂,但不论多少愿望都无法使问题消失。当然,您可以放弃其中一些,但这样做就等于默认接受在某些地方它不会看起来一样。你需要关注你的观众-新的移动音乐网站可能可以做到,但公司养老金提供商可能需要生活在2003年的字体标记领域。

值得庆幸的是,Apple Mail、iOS Mail和iCloud在HTML处理方面都有着极为优秀的表现(正如Campaign Monitor的表格所示,以及邮件标准项目所展示的那样)。由于大多数移动设备使用WebKit渲染,因此在移动设备上显示通常比桌面设备更加一致(而且大多数情况下更好)。

你可以简单地说这不值得花费精力去做(即接受答案的观点),因为明显使用糟糕的邮件阅读器的人并不太关心他们的电子邮件外观,但这并不意味着你的样式不会出问题。


7
邮件阅读器不太好的人很可能已经习惯了看到混乱的基于HTML的电子邮件。 - Ricketts
虽然它已经过时了,但字体标签仍然是唯一在所有情况下都能正常工作的东西。你有任何例子来支持这个说法吗?在你的例子中,只要使用内联样式,所有客户端都可以像处理<font>标签一样处理<span>标签。问题不在于使用<style>块或<link>元素,我认为你的答案所指的就是这个。 - Phil
2
当你使用gmail时,它会剥离类和ID,hotmail会删除样式标签,链接标签在任何地方都不起作用,而像blackspider这样的服务则会剥离样式属性,因此font标签是唯一留下来的东西。通常我同意这种观点——这真的不值得努力——任何使用会导致这种破坏的东西显然不关心他们的消息看起来像什么,所以你赢不了,也没有太大的必要尝试太努力。 - Synchro
@Phil Outlook 2016和Outlook.com都不支持大多数CSS属性在style属性中,而且Outlook 2016甚至不能正确地支持<div>元素,所以如果你的目标是任何使用Exchange的公司的工作人员,那么你需要使用表格和<font>标签。猜猜谁正在他的办公桌上解决这个确切的问题? >.< - Benjamin Nolan
1
@Phil Alas,这个方法不起作用,我们确实不得不切换回使用<font>标签。 :< - Benjamin Nolan
显示剩余8条评论

14

你的假设是正确的。它们是不必要的。此外,从HTML 4开始,<font>标签被弃用了,因此单为这个原因,你可以将其删除。

如果需要在特定文本上使用内联CSS样式,最好使用内联样式的<span>标签而不是<font>标签。

Campaign Monitor提供了一个很棒且最新的资源,以了解电子邮件中当前的CSS支持


这正是我所想的。这些模板有一些毫无意义的东西,比如 <font face="Arial"><font color="#393"><font size="2">一些文本</font></font></font>。这太荒谬了。 - punkrockbuddyholly
3
@jwiscarson 哈哈!我接手使用这些模板在周一给超过10万客户发送每周邮件的任务(帮我) - punkrockbuddyholly
如Syncro所提到的,旧的FONT标签在某些电子邮件样式方面是必需的,例如更改锚点颜色在不同的电子邮件客户端中很困难,在某些客户端中无法正常工作:<a href="url-here"style="color:red">点击这里</a>,但是在大多数情况下这将有效:{{link2:<font color="red">点击这里</font>}}。 - paulgagu
此外,<font face="arial">...</font> 是在编写针对棘手的 Outlook 的代码时轻松覆盖默认字体系列的方法。 - paulgagu

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接