EDM营销邮件规范-制作-设计-[转]

    7.       以上部分是我遇到在网上也搜不到解决方式的问题。踩过太多坑,保守一点没坏处。因为你不一定知道到底是什么原因导致手机屏幕显示的差异,不同邮箱打开的差异。

2、换行用<br>结尾,而非<br />, 在 HTML4.01 下是没有加斜杠这一规则,只有发展到了XHTML才出现用斜杠终止空元素。

  或许有人会问EDM是什么,Email Direct Marketing的缩写,即电子邮件营销。EDM模板就是你邮箱中的广告邮件,其实就是在邮件中写网页。但是EDM模板怎么书写。如果你在网上搜,或许你会搜到以下书写要点:(以下要点来自知乎

2).EDM 内含图片的大小应控制在30k-120k以内;

    4.           IOS中,电话被safari自动识别为电话变为默认的蓝色并且可以点击打电话,与设计稿色调不一致怎么办

1)一般邮件不支持任何脚本语言:多数邮件客户端软件和webmail中默认不支持任何脚本语言;

    以上代码告诉你如何用p标签划线,其实就是把p标签当div一样用.然后去掉外边距。

6) 邮件的设计重点在上半部,以吸引阅读者的注意力;

CSS只可以使用内联样式表,如:style=“margin:0“

8、邮件title最好是 html文本 . 即文字不要嵌入到图片里

  如果问你table布局,你肯定会嗤之以鼻?什么table布局?不是早已经淘汰了吗?但是如果让你写EDM邮件模板,table布局相对来说是最好的选择。

三、兼容性

  

11、设定每张图片的宽和高,以保证页面排版设计的正常。

<tr>
    <td width="" valign="top" style="padding-left:55px;font-family:Arial, Helvetica, sans-serif;font-size:16px;line-height:14px;color:#333333">
        <p>更多讲师</p>
        <p>持续更新中......</p>
     </td>
</tr>

 

  •   <tr>:表示表格的行
  •        <td>:表示表格的列
  •       <tbody>:表示表格的主体内容
  •   属性cellpadding:规定单元边沿与内容之间的空白
  •   属性cellspacing:规定单元格之间的空白
  •       align:表格相对周围元素的对齐方式。

4).能够使用系统文字应尽量避免使用图片文字以减少文件大小;

  如果让你立刻写EDM,你在网上搜的话,得到的信息相对较少,但是又很懵的话,建议你看看这篇文章,让你30分钟之内入门并开始写, 需要源码再私我吧~

3) EDM内含flash或流媒体格式文件的邮件,包括flash或流媒体格式文件在内应控制在50k-250k以内,否则必须经过修改(除特殊情况外);

  因为只要你遵循table写法,完全可以避开前人走过的深坑,快速在相应时间内完成工作。

4、禁止使用脚本

 

2).图片个数不宜过多,建议在20个以内,Gif动画文件个数控制在3个以内;

基础知识参考链接http://www.w3school.com.cn/tags/tag_table.asp

7、尽量用utf-8的编码可以避免某些(注意,是某些)邮箱出现乱码情况。

  1.   table 布局写法:这是最外层的table

    <table align="center" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
    </table> 
    
  2.      利用td实现空白书写,而不是margin,代码为上边距和左边距的写法

     <tr>
        <td height="34" valign="top"></td>
     </tr>
    
    <tr>
        <td width="20px"> </td>
    </tr> 
     
    

1、邮件宽度:邮件的标准宽度为575像素,最宽不宜超过778像素,否则必须修改。

    如果你去百度的话,结果如下,让你加入私有属性

1).EDM正文的html文件大小(不包含图片或者flash)控制在10k以内;

  • html4中,br/ 表示换行,br表示必须换行。
  • 而wbr,意思是在浏览器窗口或父级窗口宽度足够的情况下,不换行;在宽度不足的情况下,在加了wbr处主动换行。
  • 当正常情况下英文宽度过小,不足以在行末书写完一个词时,就将行末整个词放到下一行,实现换行,但是加入上面位置的wbr时,软换行就能收主动拆分单词,可以在支持HTML5的浏览器中测试(IE系列除了9都不支持,可以用Chrome)。
  • 这个wbr好像对字符型的语言用处挺大,但是对于想中文这种字,貌似没多大用处。

    <a href="mailto:lasia961@163.com" target="_blank">lasia961@163<wbr>an.com</a>
    

     

22、不要对图片使用line-height行高,避免拼装图片出现空白间隙。

<tr>
    <td>
        <p style="margin-top: 0; margin-bottom:0;text-decoration:none;font-size:12px;color:#ffffff;font-family:'Microsoft YaHei';opacity:0.8">
            联系邮箱:<a href="" style="text-decoration:none;color:#ffffff">lasia961@163.com</a>
        </p>
    </td>
</tr>

8).背景图片的td应加高宽限制,以避免部分客户端的图片显示出现异常;

    放在a便签里,并设置style

15、由于Gmail的兼容性问题,假如td里有文字,如要定义该文字样式,必须在td里写style来定义字体,另td内样式最好也加上这个style=”word-break:break-all;”,其作用在于不会让表格撑开,会自动换行

 

EDM的设计要求:

*    safari有私有属性可以避免,但是我们是edm 不能加入meta*

3、邮件的大小:

    3.       邮箱被自动识别颜色变为浏览器给的默认颜色怎么办?

19、竟可能不要使用span,因为其在某些邮箱里会导致换行。

  好了,下面开始讲什么是table布局呢?

6、不得使用javascript ,例如Clk数据跟踪 ,防止浏览器过滤

    参考国外的模板写法如下:

3、如没有特殊要求,html代码小写

    这个时候,打开审查元素,如果元素被加上了外边距 则在这个元素的样式中加上

3、小心使用背景图,背景图的地址要也设成绝对地址,不过背景图有些邮箱不支持,可以试试背景颜色代替。(不能用前景图实现的与设计沟通修改或背景色代替)

 

4、内嵌css写法 style=”font-size:10px; font-family:Verdana; color:#ffffff”

威尼斯人棋牌,    5.   安卓中出现,5位数字以上被一些手机邮箱或者浏览器识别电话,并带有蓝色之类的,点击到拨打界面,如何解决 

7).带有故事情节的flash设计应以下载屏幕开始,以吸引阅读者等待下载;

 

2、关键图片必须设定 alt

<meta name="format-detection" content="telephone=no" />

5、css尽量避免选择符的使用,定位和浮动标签也不要使用,很多信箱都不支持。(如果是设计导致需与设计沟通修改设计)

 

邮件的高度没有具体要求,应以邮件内容多少而定,建议最长不要超过1200像素,即 2.5屏,否则必须修改。

  现在我们知道什么是table布局了,那么该如何不用div实现css中的一些效果?css世界中张鑫旭对于table布局中有说,table比css2出现的还要早,这就是为什么一些css的布局在table中不适用。所以我们可以使用P标签来实现块元素div 的效果。来,让我们模拟整个EDM书写过程。

14、不要使用<pre>标签,因为会有潜在撑破页面的风险,用 定义来处理缩进。

<tr>
        <td>
            <p style="margin-top: 0;  margin-bottom: 0;font-size:12px;color:#ffffff!important;font-family:'Microsoft YaHei';opacity:0.8">
              咨询电话:00crfebetf0-00crfebetf0-00crfebetf00abc
             </p>
        </td>
   </tr>

16、由于边框背景部分宽度固定,写在模板中的逗号(特别是右上角标题)一律使用英文状态下的”,” 不要使用中文的”,”(已写在模板中)

本文由威尼斯人棋牌发布于计算机教程,转载请注明出处:EDM营销邮件规范-制作-设计-[转]