美浩工作室是一个以90后团队为主的网站设计,制作,优化,维护为一体的网站建设工作室,为您量身定制适合企业自身的网站,欢迎咨询:15249241469

EDM网页设计制作规范及注意事项

HTML/CSS mihoweb 2412℃ 1评论

在去年美浩工作室写过一个关于EDM网页的一些注意事项和编写技巧,当然那时候是因为偶的美女设计师网友(然然~~)提供的一些思路,前几天从站酷上看到一位美女设计师分享的自己关于邮件网页的制作方法和技巧,瞬间茅塞顿开。立马想高歌一首,咳咳~~是写作一篇。当然很多人就要说了,你怎么这么关注美女设计师的动态呢?那我就要说了,有本事你也是美女设计师让偶瞧瞧啊~~~立马关注你5颗心。肿么样?好了,闲话要少说,立马进入正题。

EDM

网页设计与制作里面有好多分类,比如说,网站设计制作,专题设计制作,还有今天要讲到的EDM,当然还有现在比较新新的一种网页表现方式,就是H5移动端页面设计制作,不过这种其实也可以包含在专题设计里面。大家常常在微信朋友圈见到的一些营销链接,进去之后都是这种高大上的网页啦。额,扯的有点远了。回正题:EDM网页设计制作;那么什么是EDM呢?给小白们解释下:(来自百度百科~~)

EDM(Email Direct Marketing)也即:Email营销、电子邮件营销。新竞争力写道:对于许可Email营销来说,可能很多人都将精心放到如何提高邮件打开率,如果提高转化成功率的研究上,却忽视了退订的用户。而事实上,在电子邮件营销中,用户退订也会给企业带来有用信息,而且很可能可以再次吸引其成为订阅用户。

通过“美浩工作室通俗百科”讲解的意思是:就是Email营销中重要的一点就是内容,邮件内容就是网页,而这个网页就是需要设计与制作的。然后设计和制作中需要注意和了解的一些方法和技巧是必须的。

那么就有人说了,就是给你要发送邮件的人的信箱里面发送一个网页嘛,有什么好设计和制作的,还要注意事项?遵循网页的设计制作事项不就KO了嘛,为什么要这么麻烦?其实很简单,因为你没有做过也没有发过此类邮件,所以才这样想的。做过这些的都知道,EDM有1.打开率2. 点击率3. 送达率4.个性化这几个特点的。且听我慢慢道来~~~~

首先就是EDM网页的排版和样式啦,即首先是要确定EDM网页版型;

1、模板的宽度在650px-800px(太宽在部分邮箱中会影响视觉效果,拉动横向滚动条)高度在2.5屏内较好,没有明确规范。

2、版型以最简单明了的形式展现给客户,可参考以下方式进行设计。(当然你有你的想法也可以,这个只是参考而已)

m_0d795486ad1e00000125e559e2c2

 

3、切图时注意确保图片的高度大于23px(否则qq及outlook会默认用空白填充至23px),这一点一定要注意,也就是切图不要切太短的图哦。

其次进行EDM网页编写代码
1、Html编码请使用utf-8
2、要使用table表格来布局,不要用css+div来布局,要采用行内样式的书写方式,不要把css独立成一个外部文件。即<td style=”font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#000000;” >文字</td>。也不要把样式写在<style></style>之间,部分邮箱会将其过滤。
3、不使用Flash、Java、Javas cript、frames、i-frames、ActiveX 以及 DHTML。大部分的邮件客户端都不支持Flash,JavaScript会被阻挡或者带来安全警告。
4、不可将word类文件直接转换为html格式,否则会造成编码不规范。(你要知道word其实就是一个dw的可视化的而已,他也有样式的)
5、EDM居中不要用margin:0 auto;可在table里面加上align=“center”。
6、同时,避免用css来定位【position 属性】,大部分的邮件客户端都不支持这个属性。

EDM网页文字:
1、文字内容、版面尽量简洁,突出主题,以达到更高的点击率。
2、不使用类似如下敏感及带促销类的文字:风险,处理,温馨提示,实名认证, 财付, 安全隐患, 您的QQ,预览, 被盗,随机抽取,周年庆典, 解除,服务器维护,查收等。如果邮件发送量大或发送数据容易引起投诉,则需要将公司标志性信息如电话,邮箱或者品牌口号等制作成图片,避免被ISP监控记录。
3、文字应尽量定义字体的样式,每个邮箱的默认字体样式不同,为了达到您想要的效果,字体样式一定要定义完整。

EDM网页图片:
1、尽量避免全部是图片,注意平衡图片和文字的比例。
2、图片名称不要用中文书写,可由数字,小写字母,下划线组成。
3、在<img>标签里面加上alt,这样用户在收到邮件的时候,即使有些邮箱将图片隐藏掉,也可以看到alt=””里面内容的显示。
4、背景图片在outlook里面会被过滤,所以要减少背景图片的使用,尽量使用纯色背景。
5、邮件页面中用到的图片,需用完整绝对的地址,(例:http://www.mihoweb.com/xx/xx。gif)。
6、设定每张图片的宽和高,以保证页面排版设计的正常。

EDM网页链接:
1、链接里面最好不要使用特殊符号,避免邮箱解析错误。
2、尽量不要使用map链接图片,此功能会使邮件被多数邮箱划分为垃圾邮件!

其实你要觉得要注意的就是以上这些那你就错了,你忘了网页设计制作的一个最重要的步骤,那就是EDM网页测试:

 

记得一点,要各种测试,譬如不同的浏览器,不同的邮箱,要寻找bug似的来对待这个测试,因为其实在真实的实际EDM网页设计制作与发送过程中还是有一些被无缘无故的屏蔽或者是送到垃圾箱里面,不过只要你的EDM营销的送达率可以就行,不要发送的所有被干掉就好了。其实还有一点就是现在的EDM营销已经过了火热期了,要说火热期那当然是邮箱盛行的年代了啊。不过现在像QQ邮箱啊,网易邮箱,新浪邮箱,搜狐邮箱,这些用的人还是蛮多的,这种营销就是适合做病毒式营销的人使用的。总体来说,发要比不发好哦~~~

好了,以上就是美浩工作室博客给大家分享的关于EDM邮件网页设计与制作的一些技巧和注意事项。最重要的就是你在实际操作中的实践了。在这里要感谢两位美女设计师:然然和XX!!!

参考网址:http://blog.mihoweb.com/archives/521.html和http://www.zcool.com.cn/article/ZMTM5MDgw.html

转载请注明:美浩工作室官方博客 » EDM网页设计制作规范及注意事项

喜欢 (28)