移动端EDM设计6个要点

最近的一份统计报告（http://www.returnpath.com/resource/email-mostly-mobile/）显示，电子邮件在移动端的打开率已经明显超过或者与桌面PC电脑的打开率持平。移动端的显示兼容性越来越重要，下面是6个相关的邮件设计实例，为大家分享：

1．注重可读性

邮件最重要的就是它的可读性。因此。使用醒目的标题、字体还有足够的留白可以让邮件的可读性更强！下面是案例分享

2，布局保持简单

因为是在移动端中显示，所以在有限的屏幕内，一列的布局是最理想的。
下面的两封邮件都采用了简单的布局，内容清晰。
其中采用了一列的布局，简洁清晰；采用了两列的布局，使用清晰的图片而且减少了文字的使用。

3，使用大的点击按钮(call to action)

在移动端人们是用手去点击按钮，没有在PC电脑上用鼠标那么精确的操作性。所以需要邮件中的点击按钮更大，更明显。

4，保持简单清晰的信息

由于很多邮件都是在PC上设计和预览的，没有考虑移动设备的用户体验，在窄小的手机屏幕上阅读比较困难，简单清晰。下图中案例1中太多的信息与文字，在移动设备上显示，反而变的比较凌乱。但是案例2没有使用太多的信息显得更加的清晰。

案例1

案例2

5，去掉不必要的修饰

在PC端您可能会收到很多精美的邮件，但是在移动端，因为其有限的屏幕空间，最好删除不必要的元素，如“导航”还有“社交分享”按钮等。只需呈现出这封邮件的主要内容即可。

6，色块以及字体粗细的运用

因为在移动端，很多漂亮布局是不能完美实现的，如何去提高它的美观性和吸引力？下面的邮件运用了大胆的用色和图片。

从上面6点不难看出，手机端的邮件设计在布局-按钮设计-配色上都应当尽量简洁，突出主要内容。需要做到将信息最直观的展现出来。
现在大家一起来欣赏一些其他的邮件。

本篇文章转自http://www.smileycat.com/miaow/archives/003028.php
其中加入了我的一些个人观点~

2 条评论分类于邮件制作, 邮件营销知识 | Oliver

当前团购网站EDM存在哪些典型问题，如何优化？

如何优化团购网站营销邮件

我的邮箱里每天可以收到各种各样的团购邮件，这里分享一些团购营销邮件有待改进的地方，和值得学习的地方。

有待改进的地方：

1，邮件内容很丰富，但相关性不高

美团的营销邮件，直接在yeah.net邮箱中打开时，需要42屏才能阅读完，即使是在新窗口中打开也要33屏才能阅读完。一般来讲，我喜欢团购电影、双人餐和甜点，而酒店、摄影等类型项目很少购买。在这么多项目中查找我喜欢的，着实不易。

值得一提的是国外团购网站Groupon提供这种相关性选择（如图1），我可以在我喜欢的类型后面，点亮爱心，这样邮件推荐给我的就是这些类型的项目；同时每期邮件都会提醒：用不超过29s的时间告诉我们您喜欢什么。

点击查看大图：

图1-Groupon可以选择喜欢的团购项目

2.未充分考虑图片不显示的情况

有些邮箱，如Hotmail、Gmail、Outlook等默认不显示图片（如下2张图）。当邮件相关性不好时，邮件前面的导航条就是把流量引向网站的重要环节，因此导航条处的建议尽量使用文字而非图片。

图2-糯米营销邮件在Outlook中图片不显示的效果

图3-糯米营销邮件图片显示后的效果

1号店团购营销邮件的导航条即使用文字而非图片，如下图，即使不显示图片，仍然可以点击导航条中的文字。

图4-1号店团购营销邮件的导航条图片不显示的效果

值得借鉴的地方：

1.投诉按钮很大方，可修改订阅频率

美团营销邮件顶部明显的退订和投按钮也可以让“恼怒”的订阅者发泄情绪，以避免向ISP举报，导致后续邮件被屏蔽等不良后果；另外美团提供3种订阅邮件的频率，方便订阅者选择。

图5-美团邮件设置按钮和投诉按钮

图6-美团提供3种邮件订阅频率

2.利用用户关怀邮件，激活不活跃用户

营销理论中，开发一个新客户的成本要高于维护老客户的成本，如何通过邮件来唤醒不活跃的老客户呢？美团的用户关怀邮件是一个好案例：语言活泼、内容清新，同时明显的call to action也有利于邮件订阅者采取行动。

图7-美团的用户关怀邮件案例一

图8-美团的用户关怀邮件案例二

经过一系列的激活活动，一部分订阅者可能会被唤醒，另外一部分可能依然沉睡（如邮件已经废弃使用等原因），这时可以发送一封如下大众点评的“退订提醒邮件”，以减少给订阅者带来的不必要的麻烦，同时也降低邮件营销的成本。

图9-大众点评的退订提醒邮件

3.与移动媒体结合，增加便捷性

QQ团购邮件底部，推荐了便捷的二维码扫描下载手机端和加微信的方式，让邮件营销变得更立体，通过EDM有效促进手机端应用的流量与转化。

图10-QQ团购推荐便捷的二维码扫描

6 条评论分类于邮件制作, 邮件营销案例, 邮件营销知识 | Lisa

APPLE的EDM之如何做好手机端的兼容性

不管你是在地铁、在路上、在等车、在逛街，你总会看见形形色色的人拿着各种移动设备在把玩着，可见移动设备是多么的普及。而我们又如何让一封邮件在电脑和移动设备中都有很好的显示效果呢？下面的数据更证实了电子邮件越来越多的在移动设备上被打开的趋势。

邮件在各个客户端的打开率

在父亲节前夕我收到了一封来自苹果的邮件，发现它在我的PC和手机上排版和显示效果是完全不同的，EDM在移动设备的显示兼容性越来越重要，如果你还不去专注与他，你必然会OUT的。

邮件在各个客户端的打开效果

上图左边是邮件在电脑邮箱中的现示效果；
右边的图1是一般情况下邮件在手机上的显示效果；
右边的图2是经过优化后邮件在手机上的显示效果。
可以明显地看出图2中邮件的显示效果更加的明确，信息更加的突出，可见邮件在手机端的优化是很有必要的。

部分代码

苹果的这封邮件针对PC电脑和手机客户端写了两遍代码。其中一份代码是针对PC电脑编写的，一份是针对手机移动客户端编写的。

在上图的代码中 @media only screen and (max-device-width: 568px)是识别当前客户打开邮件所使用的设备宽度是否是568px或者比568px窄，如果是的，那么其中td[id=aapl-desktop] {display: none;} 这段代码就会让其中兼容电脑客户端的代码被屏蔽，而只显示手机端的代码。