邮件发送须知
1、 HTML文件需至少提前1个工作日提供,以防HTML文件有需要修改的地方,给修改预留时间。
2、 需提供:发件人名称、邮件标题
3、 Html代码格式通用UTF-8,将显示正常的HTML压缩后发给我们,以防在传输给我们时,文字出现乱码
4、 邮件发送报告在发送完成3个工作日后提供(邮件发送效果一般需要三天才能表现出大部分效果)
5、 建议邮件发送的时间选择在周一至周四之间,周末往往效果并不好
邮件技术需求
在设计邮件通讯时,你必须考虑适用于邮件的一些限制条件,这些限制条件并不是简单受制于邮件发送平台,而更多与目标群体的艺术、礼仪、技术交流、多种邮件客户端的当前状态相关。 当你的邮件满足下列规定的限制条件时,目标群体正确接收你的信息的机率将会增加。 (下面的要求针对于HTML邮件)
1、 标题:包含空格在内,最多不超过35个字符。
标题不宜过长,一句话最好,但要能突出主题,要具有吸引力。长标题是没有意义, 每个邮局的邮箱在收到邮件时,可显示的标题长度是有限的,长了,后面的内容根本无法显示,所以不要损耗脑细胞去想很长的标题~~。另外,用户看标题都是从左往右看的,重点应放在前半句。
2、 图片:邮件内单张图片不宜超过30K。
试想下我们是用户,一个大图片加载半天,你还有耐心等着加载么?绝大多数会放弃。再试想下我们是邮局,一个IP发了N多的带大图片的邮件,这不是在加大我们的负荷么,那邮局就会开始拦截,过滤了,邮件也别想正常进入用户邮箱了。
3、 HTML代码(此处很重要,不注意邮件就都进垃圾箱了)
a、 邮件宽度500-650像素,居中(试想客户收到了一封邮件靠左或靠右~~一定会说很难看)
b、 绝对不可以用map链接,因为绝大部分的ISP是不识别map链接代码的
c、 不要使用HTML的cutting edge功能,HTML4.0将会承担旧版本HTML3.2的部分工作
d、 不要使用"CSS positioning"样式来布局,它很少能被邮件客户端支持,建议使用表格“table's”来布局,容易导致邮件变形。(对于邮局来说,他们不喜欢复杂的东西~~想用高级的方法去做,不好意思,搞不好就进垃圾箱了)
e、 无差错HTML:确保你的HTML代码不包含任何错误。(这个是很明显的吧~~虽然有些代码在本地看上去不影响显示,但是不要忘了~~邮件发送是要通过邮局的~~错误百出总不好吧,并且很多邮件平台会对邮件的代码有个重新编辑的过程,你一错,这编辑就会出错,那发出去的就不知道错成什么样了~~)
f、 必须兼容Firefox和IE两种浏览器,使邮件得以正确显示(这个很容易理解吧~~显示不正常是很悲剧的~~我想你也收到过类似的断层的邮件吧,看着就不专业了,哪有兴趣继续点呢)
g、 HTML必须在Hotmai、Gmail、腾讯邮箱中通过测试(这三个测试通过,其他的问题不会太大)
h、 不使用外部CSS(层叠样式表),使用各种字体的font-标签,且每个font-标签中的颜色、大小和face 属性都必须事先指定。可以使用内联样式,例如:(外联是不起任何作用的~~)
<font style="font-family:arial,helvetica; font-size:10pt; color:#000000">
...
</font>
i、 不要用CSS来指定HTML元素的背景颜色:
<table style="background:url(background.gif)" cellspacing="0" cellpadding="0">
Hotmail(以及其他基于Web的电子客户端)从HTML中过滤掉了这些背景图片,背景图片将不会显示。相反,可使用老式的背景标签:
table background="background.gif" cellspacing="0" cellpadding="0">
这个方法在Hotmail中适用
j、 使用body标签的背景颜色时,必须放置一个附加表格在整个邮件外围,且具有相同的背景颜色,宽度和高度都为邮件相应宽度高度的100%:
<table border="0" cellpadding="0" cellspacing="0" width="100%" height="100%">
<tr>
<td width="100%" height="100%" bgcolor=".....">
<!--- HTML for the mailing -->
</td>
</tr>
</table>
4、 其他代码要求(也不要忽略此处,优化这些内容,可以让你的邮件的质量越来越高)
a、 在web版本的邮件最上方位置嵌入以下链接: <-- mailonly --> Klik <a href="{$WEBLINK}" target="email">hier</a> om deze nieuwsbrief in uw browser te lezen. <-- /mailonly -->
b、 没有指定的链接必须包含在HTML代码中
c、 不要包含 Flash, Java,,Javascript,frames,i-frames,ActiveX或者动态HTML
d、 不要使用meta标签,其在邮件中没有实际意义,比如:
<meta http-equiv="refresh" content="10; url=http://www.dmdelivery.nl/">
e、 每一个超链接都要提供target="email"
f、 主体背景图片或者背景颜色都是不允许的,但是彩色图表可以
g、 使用body标签的 vlink、alink和link属性时,必须包含font-标签的每一个颜色属性链接 (<font face="......" color="......"></font>),这是必要的,因为Hotmail中的body标签被移除,预置的vlink、alink和link属性因而不再适用
h、 如果你的邮件包含了表单:
u 这个表单的method标签必须值为get,值为post是不可行的!
u 不要使用表单中的TEXTAREA属性,因为没有办法为它定义合适的最大输入长度,且容易导致在使用GET方法发送数据时出现问题
u 在<input type="text"...> 中通常使用 maxlength属性来限制最大输入长度
5、 营销层面考虑(这块是邮件营销效果的关键)
为啥你发很多邮件,都发送成功了,没人打开?这个很有可能是你上面的优化没做好,邮件进垃圾箱了。那为啥你发了很多邮件,打开率蛮高,但是点击率很低?那这个跟你的邮件内容显示有很大关系了,邮件走样了?图片成XX了?内容没有吸引力?还有为啥你发了很多邮件,打开率,点击率都挺高的,就是没有转化呢?不好意思,这个我帮不你了,得从你们网站的产品、结构、搜索、支付、体验等方面去考虑了,这不是邮件范围的问题了哈。那如何最大化邮件的效果呢?这里从邮件的设计角度阐述一下:
a、 图文并茂:邮件不宜过多只是一张大图,尽量多些配字,这样才显得友好嘛,可以放在邮件的最下面,可以借这些文字向用户表达一些政策等(文字内容多一些,在邮局的反垃圾判别中也会有一定帮助)
b、 邮件的风格要与网站保持一致:导航的风格尤其重要。
c、 邮件的高度不宜太长,建议两屏半以内,会有一些产品列表的邮件,很长的情况下,可以考虑使用锚点
d、 邮件的第一屏多采用大图,设计要具有视觉冲击,一封邮件最关键的位置就是第一屏,第一屏做好了用户才有可能继续往下看,第一屏做得没有吸引力,就别想用户继续往下看了。
e、 视觉是很重要的,内容更重要,内容是刺激转化的决定因素。
下面举几个例子:
a、 图文并茂
b、 导航风格
c、 锚点应用
d、 第一屏的视觉效果
e、 活动内容
注意:邮件只是个信息载体,是吸引用户进入网站,因此邮件力求友好,具有吸引力。网站的活动页面更重要。
其他内容:下面属于比较高级的优化。优化以下内容可以逐步提高邮件的质量(主要考虑邮局规则)
分块图像
现在很多邮件客户端接收邮件的默认设置是分块图像,只有在收件人明确设置允许图像显示(点击一个按钮)后,图像才会显示出来。
分块问题 | AOL v. 6.0-9.0 | Gmail | Hotmail | Yahoo! | Outlook 2000/XP | Outlook 2003 | Outlook Express w/SP2 | Outlook Express w/o SP2 |
外部图像被默认分块 | Yes | Yes | No | No | No | Yes | Yes | No |
用户控制图像分块设置 | Yes | No | Yes | Yes | Yes | Yes | Yes | Yes |
用户点击链接使信息中的图像可见 | Yes | Yes | Yes | No | No | Yes | Yes | N/A |
如果发件人在收件人的地址簿/好友列表中,图像可见 | Yes | No | Yes | No | Yes | Yes | Yes | Yes |
如果发件人在ISP白名单中,图片自动可见 | Yes | N/A | Yes | No | N/A | N/A | N/A | N/A |
ALT标签禁用时显示的图像 | No | Yes | No | No | No | No | No | N/A |
包含预览窗口功能 | No | No | No | No | Yes | Yes | Yes | Yes |
注:SP2 = Service Pack 2 upgrade for Windows XP
来源: EmailLabs, 2004.
当邮件中的图像不能显示出来时,邮件的显示结果将会像一幅破碎的图案和格式化掉的内容那么丑,下面给出一个典型的例子:
分块图像 可见图片
在这种情况下,发送的信息意味着几乎完全被破坏了,这里有一些提示,以减少这种情况的发生:
l 不要在重要内容中使用图像,比如标题、链接和任何鼓动客户的行为。
l 在web版本的邮件最上方位置嵌入一个文本链接:
·<-- mailonly -->
Having trouble reading this email? <a href="{$WEBLINK}" title="Weblink" target="email">Click here</a> to view this message in your browser.
<-- /mailonly -->
l 邮件通讯中的所有图像处理使用alt标签
l 对所有图像都保持添加其width和height属性(如果邮件是DMdelivery WYSIWYG编辑器创建的,这些属性将自动生成)。这样可以防止不具备拉伸或者收缩。
l 添加收件人的地址薄(见下文
如果你遵照这些准则,则邮件出现问题的机会将会最小化,见下面的例子:
分块图像 可见图像
获取你的用户地址薄
邮件通讯中,如果你的收件人地址来自于你的地址薄,图像能够显示的机率在默认情况下(没有用户交互)将显著增加。因此,邮件中添加一些文本注释,要求你的收件人添加你到他或者她的地址薄。当然,重要的是保证你每月用于邮件通讯的地址要与各版本地址薄中的都相同。
Outlook 2007 中的限制条件
微软Outlook 2007使用Word的渲染引擎,而不是Internet Explorer的,Internet Explorer的渲染引擎只在旧版本中使用。某些目前的HTML功能,Word HTML引擎不支持,但Internet Explorer的渲染引擎支持,例如:
l 背景图片
l CSS浮动属性和CSS定位属性
l Flash
l 动画GIFs(只有第一帧显示)
l Image标签中的alt属性
l 表单
想要了解更多,请点击这里
可以看出,当使用Outlook 2007来进行邮件通讯时,使用这些功能将会导致邮件不能正确显示。虽然并没有多少人在使用Outlook 2007,但是只要存在,其很长一段时间仍然是不可忽略的,这就意味着你在设计邮件通讯的时候不得不考虑这些限制条件。
CSS支持的电子邮件客户端
<style>元素
Gmail | Hotmail | Yahoo! | Live | Outlook/OE | AOL | Lotus Notes | Thunderbird | Mac Email | Entourage | Eudora | |
<head>中的<style>元素 | No | No | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
<body>中的<style>元素 | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
<link> 元素
Gmail | Hotmail | Yahoo! | Live | Outlook/OE | AOL | Lotus Notes | Thunderbird | Mac Email | Entourage | Eudora | ||
<head>中的<link>元素 | N o | No | No | No | Yes | Yes | Yes | Yes | Yes | Yes | No | |
<body>中的<link>元素 | No | No | No | No | Yes | Yes | Yes | Yes | Yes | Yes | No |
Gmail | Hotmail | Yahoo! | Live | Outlook/OE | AOL | Lotus Notes | Thunderbird | Mac Email | Entourage | Eudora | |
* | No | No | No | No | Yes | Yes | Yes | Yes | Yes | Yes | No |
e | No | No | No | No | Yes | Yes | Yes | Yes | Yes | Yes | No |
e > f | No | No | Yes | No | No | No | No | Yes | Yes | Yes | No |
e:link | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
e:active, e:hover | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
e:focus | No | No | Yes | No | No | No | No | Yes | Yes | Yes | No |
e + f | No | Yes | Yes | No | No | No | No | Yes | Yes | No | No |
e [foo] | No | Yes | Yes | No | No | No | No | Yes | Yes | No | No |
e.className | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
e#id | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
e:first-line | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
e:first-letter | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
CSS 选择器
CSS 属性
Gmail | Hotmail | Yahoo! | Live | Outlook/OE | AOL | Lotus Notes | Thunderbird | Mac Email | Entourage | Eudora | ||
background-color | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No | |
background-image | No | Yes, but | Yes | No | Yes * | Yes | Yes | Yes | Yes | Yes | No | |
background-position | No | No | No | No | Yes * | Yes | No | Yes | Yes | Yes | No | |
background-repeat | No | Yes | Yes | No | Yes * | Yes | No | Yes | Yes | Yes | No | |
border | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No | |
border-collapse | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | No | No |
border-spacing | Yes | No | Yes | No | No | No | No | Yes | Yes | No | No | |||||||
bottom | No | Yes | Yes | No | Yes | Yes | No | Yes | Yes | Yes | No | |||||||
caption-side | Yes | No | Yes | No | No | No | No | Yes | No | No | No | |||||||
clip | No | Yes | Yes | No | Yes | Yes | No | Yes | Yes | Yes | No | |||||||
color | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No | |||||||
cursor | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | No | No | |||||||
direction | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No | No | |||||||
display | No | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No | No | |||||||
empty-cells | Yes | No | Yes | No | No | No | No | Yes | Yes | No | No | |||||||
filter | No | No | Yes | Yes | No | No | No | No | No | No | No | |||||||
float | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No | |||||||
font-family | No | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No | |||||||
font-size | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No | |||||||
font-style | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No | |||||||
font-variant | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No | |||||||
font-weight | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No | |||||||
height | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No | |||||||
left | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No | |||||||
letter-spacing | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No | |||||||
line-height | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No | |||||||
list-style-image | No | Yes | Yes | No | Yes | Yes | No | Yes | Yes | Yes | No | |||||||
list-style-position | Yes | No | No | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
list-style-type | Yes | No | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No |
margin | Yes | No | Yes | No | Yes | Yes | No | Yes | Yes | Yes | No |
opacity | No | No | Yes | Yes | No | No | No | Yes | Yes | No | No |
overflow | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
padding | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
position | No | No | No | No | Yes | Yes | No | Yes | Yes | Yes | No |
right | No | Yes | Yes | No | Yes | Yes | No | Yes | Yes | Yes | No |
table-layout | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
text-align | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No |
text-decoration | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | Yes | No |
text-indent | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
text-transform | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
top | No | Yes | Yes | No | Yes | Yes | No | Yes | Yes | Yes | No |
vertical-align | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
visibility | No | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
white-space | Yes | Yes | Yes | No | No | No | No | Yes | Yes | Yes | No |
width | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
word-spacing | Yes | Yes | Yes | Yes | Yes | Yes | No | Yes | Yes | Yes | No |
z-index | No | Yes | Yes | No | Yes | Yes | No | Yes | Yes | Yes | No |
*)Microsoft Outlook 2007不支