1、邮件 EDM 模板制作规范第一部分 邮件模板概括1、邮件类型:1) 新闻订阅;一般文字内容居多,每段文字具有相应的链接可供点击,同时加入少量图片进行点缀,模板顶部带有显著的公司 logo 和邮件发送内容标示,模板底部具有公司的联系方式,免责申明等栏目,邮件通常大于50K。2) 产品订阅;一般图片内容为主,图片带有相应的链接可供点击,目的是有针对性的介绍最新的产品或活动信息,由于采用图片为主的形式,邮件大小通常在20k 以内。注:以上类型的模板制作均采用标准的 html 语言,并插入具有绝对地址链接的图片和链接。2、邮件模板显示尺寸:考虑到现在显示器不同分辩率的问题,一般建议邮件模板的显示宽度为
2、800px 至1024px 之间;模板高度在1280px 左右(即用户之需要一次滚动屏幕就可浏览全部内容) 。模板最佳尺寸:显示宽度400px-800px ,模板高度控制在一屏以内。3、标准邮件模板中需包括以下内容: 1) 标准页眉页脚应用必须含有邮件无法正常显示的引导入口,如下的类似文字,如:如果无法浏览此邮件,请点击这里;另外,最好建议用户将发件人加入联系人列表。必须含有明显的退订链接标示(退订链接可直接由发送系统提供或链接到用户自己提供的退订链接) ;2) 其他页眉页脚应用表明邮件的主要目的邮件退订选择订阅内容修改订阅邮箱隐私保护说明企业服务标准等注:目前网民使用的主流的浏览器有:微软
3、IE6 / IE7 / IE8、以 IE 为核心的遨游/Green、Google Chrome 及FireFox,使用覆盖率超过90%;经过模板制作规范的建议修改后,以上浏览器均能正常显示模板。 第二部分 静态页面的制作 一、内容比例邮件模板中,图片及文字应具有平衡的比例,从门户的判断机制上来看,邮件正文中文本的比例越合理,被判断为垃圾邮件的可能性越小,尤其是网易。通常我们建议根据邮件的内容将非效果性文字都以文本的形式呈现。二、 切图方式 1、页面制作方式目前分为 table 与 div 两种方式要确保邮件模板在不同的邮件客户端中显示效果保持一致,需采用table 格式的切割;而 div 格式
4、由于有些属性不被邮件客户端完全支持,所以建议避免使用。 2、切割图片时,在不影响图片失真的情况下,所切割图片应尽可能的优化图片优化后,容量减小,保证了用户打开邮件时,在最短时间内看到感兴趣的图片,提高邮件模板的阅读率;另外,当遇到页面中有动画时,可将动画导出为 gif 图片;对于页面中的 flash 动画,目前大部分邮件客户端暂不支持正常的显示。3、插入的图片要定义高和宽通常图片的高和宽都使用 width 和 height 进行定义,但在 qq 邮箱中会清除页面里所有图片的高和宽,导致页面显示变形;所以图片的高和宽建议采用 style 中定义的方式,如: style=”width:xxx;he
5、ight:xxx”。4、不使用背景图片在 outlook 中,背景图片将无法显示,其他邮件客户端可正确显示背景图片。5、图片的地址链接不采用 map 标记形式,因为 map 标记在 outlook 中无法进行正常的点击,即无法打不开该链接指向的网址。6、不使用 word 转换的 html 文件作为模板由于 word 转换后会在 html 中插入大量无用代码,导致邮件出现显示错乱和易被拦截等问题。同时,建议对 word 文档手工转换成 html网页后,加入相关图片,以更好的吸引客户眼球。 三、CSS 样式定义1、CSS 样式的添加可分为两种方式:1) 外部调用样式;2) 内部调用样式;3) HT
6、ML Tag 中直接定义样式。2、对以上内容分别进行相关阐述1) 外部调用样式,指在网页的 中写出样式表文件的名称和路径,例如:2) 内部调用样式,指在页面的头部,以开头,以 结尾的样式定义。例如:bodyfont-family:Arial, Helvetica, sans-serif;font-size:12px;margin:0 auto;padding:0px;color:#000000;3) HTML Tag 中直接定义样式,指直接在 html tag 标记中写 style定义。例如:文字信息第一种和第二种方式为制作网页的常用方式,但这两种方式在邮件客户端中某些定义将无法生效。第三种方
7、式在邮件客户端中显示兼容性最高,但手工制作繁琐,所以系统集成了“网页抓取” 功能,抓取功能将自动把第一种和第二种网页转换成第三种网页的样式定义模式,从而确保了模板显示的最大兼容性。3、其他Alt 值在主要的图片中定义 Alt,标注上图片中的文字内容,在图片无法正常显示时,用户仍然可以看到图片所要传达的主题内容。第三部分 页面的测试页面制作完毕以后,需上传到 web 专用服务器测试时页面抓取分为:、url 抓取(url 抓取是系统专为提供模板显示兼容性而设计的功能,建议使用)、html 代码复制,使用代码复制要求网页中的链接或引用都使用绝对地址,否则网页中的图片将无法在邮件中正常显示;)第四部分
8、 查看邮箱邮件模板的发送有可能发生的三种情况1、邮件进入收件箱;2、邮件进入垃圾箱;3、邮件被拒收;出现以上情况后,建议对邮件做如下调整:1、适当更换邮件主题;2、删除模板中可能为国家规定的政治敏感词汇或色情、推销等词汇;3、模板内容采用文字和图片混合排列的方式;4、删除模板中不必要的链接,邮件中的链接不易过多,建议少于10个;第五部分 经验总结门户的规则总是不断更新,当我们无法掌握准确的规则信息时,可以通过每次发送经验中的问题,总结出解决的办法。以下是一些常见或不易发现的问题。问题1:正确写法一个链接,被分硬回车分成三部分 ,用户往往会这样做,尤其是 word 用户 问题2:一个链接对应两个
9、第二个 没有结束,IE 不会报错,但积少成多,造成邮件体积大,服务器负担变重.问题3: Td 里面只有图片,老系统会在 前加个空格,造成图片撑裂的问题,解决方法,在抓取模板后在代码部分手动清除空格问题4:mailto 的正确写法 问题5:对于纯英文邮件,发送时必须使用 utf-8字符集进行发送,减少因字符集问题带来的无法阅读问题。其他经验总结:1-模板制作尽量用色块,做成类似插画的效果,少用过度,切图时用 gif减少容量,减轻发送负担2-打开模板时要检查里面的 js,尽量去掉 js,因为有的客户端会报错,尤其是 outlook3 -应该尽量在 dw 里重做客户模板,不要用 ps 直接生成的 html 4-遇到图片裂痕问题,要在 dw 里面重新手动画 table,手动添加图片解决5-一个 里面只能有一个 img,有三个的话就容易出现上面 4提到的问题,如果有三个图在一个 td 里面解决方法,新建一个三列一行的表格吧三个图分别放在单独的列里面6-特殊符号,等等 用 等标准的 xhtml 替代7-尽量不用背景图 outlook 里面显示有问题 8-系统抓取模板的时候也会出错,尽量从代码模式中找到问题9-链接打开方式为_blank10-不用 map 方式制作链接 11-css 就近书写文字文字文字文字文字文字 备注:邮件模板的制作将随着门户规则的更新而有所变动,请注意。