2014年全球最新潮的七个响应式网页设计

电子邮件营销的未来在于适应周围环境的能力。全球超过一半的电子邮件在移动设备上被打开，而根据全球领先的多渠道智能化营销服务商webpower的邮件客户数据分析，中国地区电子邮件移动设备打开率也增速迅猛，达到30%以上，而这一比例预计在未来几年将继续增长。同时，不容忽视的是，至少50%的移动用户将关闭或者删除没有优化阅读的电子邮件。

对于邮件发送者来说，解决移动小屏幕的邮件用户体验的一个最方便的解决方案就是响应设计，通过包括媒体查询、流体布局、图片和定制化的文案一整套技术和原理，电子邮件可以在桌面和移动设备得到最佳展示。响应技术允许邮件设计师隐藏、堆叠、展开、折叠或修改内容，以优化电子邮件内容在小屏幕上的显示效果。

多渠道智能化营销服务商webpower提供了7个关键技巧和最佳实践，帮助你通过响应式设计以移动客户期望的方式提供给移动客户想要的信息。

1.以移动设计为中心创建桌面版邮件

把需要响应的部分铭记在心，特别是在设计阶段。首先你要先形成一个移动设计的概念，并在此基础上创建桌面版，这正与我们以往的做法恰恰相反。保持移动版本尽可能整洁、简约，因为使用的图片和特殊设计越多，邮件越难以达到所有移动读者。

2.单列设计可以更好的同时满足桌面和移动显示

要想使优化电子邮件通讯的过程尽可能简单，那么应该选择一栏的设计。webpower这样实践的原因在于，并不是因为多列设计在移动设备上无法实现和展示，而是说单列设计可以更好的满足邮件在桌面和移动上的最佳展示。

3.学会玩捉迷藏：隐藏层级、精简内容

设计一个手机版本邮件的主要目标是为了确保邮件在手机上的易读性。这通常意味着在你的移动邮件中，需要隐藏一些次要的内容，以保持用户专注于最重要的信息。通过对任何不太重要的图像、段落和表格等应用一个简单的隐藏层级，以使这些内容在移动设备显示时被自动隐藏。

不是电子邮件中的每个信息都一样重要。在创建响应设计时，挑选出电子邮件中“最重要”的信息，以避免拥挤、臃肿的移动信息，并保持内容简洁。小屏幕意味着让用户尽可能有效地互动比以往任何时候都更重要。

4.邮件文本左对齐，聚焦用户更多注意力

在互联网的复杂环境中，用户的注意力随时都在变化，由上海交通大学认知实验室与艾瑞咨询联合发布的《网络视频眼动体验与广告效果研究报告》表明，人们在观看网络视频的眼动行为影响着人们对视频广告的注意力和持续时间。webpower研究同样表明，用户对电子邮件的不同区域赋予不同的注意程度，用户的大部分注意力集中在左边的电子邮件内容。某些操作系统，尤其是Android用户，不太乐意伸缩邮件内容，而电子邮件的左半部分也更容易被注意到。另外，从人体工程学的角度来看，在使用手携式屏幕设备时，大多数用户也更容易与左部、中部和底部区域的元素互动。

5.响应式图像，可以让用户体验更好

相同尺寸的图像，在移动设备上下载的速度通常比在个人电脑上更慢，这将让移动用户等待时间更长。当电子邮件在移动设备上接收时，用一个较小版本的图像替换，可以让用户体验更好。

6.小屏幕改变了哪些邮件设计规则

小屏幕改变了以往的邮件设计规则，太小的按钮和链接在触摸屏设备上使用真的非常不方便。根据苹果公司的指导，链接和按钮应该有一个最低显示区域大小44×44像素。多渠道智能化营销服务商webpower在服务客户时建议，移动邮件应保持字体大小在17-21像素之间，最佳的字体大小通常是19像素;如果CTAs没有被用户立即看到，之后可能用户再也不会去留意，所以重要的CTAs应该尽可能靠近邮件顶部区域。

7.分割思考与融合设计

当你为移动用户瘦身设计时，停止从整个“页面”角度去思考，而应该分割来考虑。webpower的邮件设计师们，通常会把电子邮件的每一部分作为一个单独分割的包，这样在设计电子邮件时会发现存在更大的自由。

创建一个响应式的布局有很多种不同的方法，建议综合融入各种设计想法。如创建响应式布局最简单的方法是建一个流体设计，使邮件适应设备显示宽度，但作为一项最佳实践，可以综合使用一个可伸缩的响应布局。如媒体查询也是响应设计中最大的一部分，邮件设计师用它来把电子邮件转变为一个适应移动设备的更细长的版本。但不同类型的移动设备也可以有不同类型的媒体查询，所以营销者还可以针对流行设备的屏幕分辨率进行合理响应邮件设计。