iphone上的HTML邮件预览

时间:2013-03-22 19:28:01

标签: html ios html-email

我正在从我的应用程序发送一些电子邮件。电子邮件中包含html,电子邮件中的第一项是公司徽标图像

电子邮件在包括iphone在内的所有电子邮件客户端都可以正常使用,但问题在于iphone主题行下面的电子邮件“预览”。由于邮件正文具有徽标,因此邮件预览显示图像URL。如何避免在预览中显示图像URL并在预览中显示更有意义的文本。 我确实需要将徽标作为电子邮件正文中的第一件事。

这有什么解决方法吗?

Thansk

4 个答案:

答案 0 :(得分:4)

在过去几天测试了我自己的各种迭代后,只需将我的两分钱加入到这个讨论中。这个问题的其他答案很好,但是他们都会错过一些边缘情况(或者有时不是边缘情况)。我不会声称我已经在每个客户端对此进行了测试,但我已经让它在所有大客户上工作:Gmail,Yahoo,Outlook.com/Hotmail,Outlook for Windows和OS X(连接到Exchange,POP和IMAP的各种版本),各种基于Web的IMAP客户端,iOS Mail(都连接到Exchange服务器和常规IMAP服务器:是的,它会在这些情况下呈现不同的预览),Android Mail ,Android / iOS Gmail客户端,邮箱,Thunderbird以及其他一些我现在无法记住的人。

使用preheader div。将div设置为内联样式,因为某些基于Web的电子邮件服务(Gmail)会将<style>标记从电子邮件的HTML头部中删除。内联样式display: none;适用于大多数客户端,但在gmail Web视图和Yahoo Web视图中失败,除非您将其定义为display: none !important;。如果您没有!important声明,那么在基于网络的客户端中为这些服务阅读时,preheader div将显示在电子邮件正文中。

目前,我们正在使用具有以下内联定义样式的div来隐藏我们在我们测试过的各种客户端和服务中的预取器:display: none !important; height:0px; overflow:hidden; color:#ffffff; font-size:2pt;。其中一些人不会在所有或大多数情况下工作,但在所有这些人之间,他们很好地覆盖了各种基础。特别是height黑客只会影响几个客户端并完全打破Gmail基于网络的客户端(它目前将高度声明重写为最小高度,这是意料之外的),但是因为它的荣誉display: none !important;无论如何,预感器最终隐藏在那里。如某些客户端/服务转发消息时,ste7enm提到的颜色和字体大小的hack会更有效地隐藏预取器。

旁注:经过多次测试,重新设计和重新测试我们的模板后,我得出结论,HTML电子邮件是所有好事和纯粹事物的死敌。

答案 1 :(得分:2)

您是否尝试在alt代码中使用img?例如 <img src="mycompany.png" alt="company name" />

答案 2 :(得分:2)

电子邮件通常会在电子邮件的最顶部包含一小段文字来解决该问题。

请参阅 - http://www.aweber.com/blog/email-marketing/do-you-use-snippets-for-more-opens.htm

答案 3 :(得分:1)

我知道这个问题有点老了,但我在搜索中找到了它,我想我会添加另一个小提示:

如果您打算在顶部包含DIV(preheader,每个@John),请务必设置样式。

我发现当人们收到Outlook中的电子邮件时,虽然预读器没有出现在原始邮件中,但如果他们转发或回复邮件,它就会重新出现。

使用此简单的解决方法来避免此问题:

<div style="display:none; color:#fff; font-size:2pt;">This is the abstract text that will appear in your email client's message preview or notification window.<br />&nbsp;</div>

然后,preheader在收到时会被隐藏,文本仍然用于Outlook中的预览通知或iOS上的Mail中的文本预览,当他们转发或回复您的观众的消息时,它是如此小而白不会看到它。

另请注意,使用较旧的BlackBerry设备的用户可以看到此类型的标头(如果禁用了HTML,则BlackBerry 4和BlackBerry 5)。