移动优化网站是电商商家的必备之选。为实现这一目标，许多人采用响应式设计，使网站能在多种设备上良好呈现；我曾在2012年的《响应式设计入门》一文中介绍了响应式设计的基础知识。
随着响应式设计的使用日益普及，实施过程中的错误也随之增多。在本文中，我将探讨电商商家在实现响应式设计时常见的八大误区。
1. 未能分析访客行为
零售商或许因急于建立移动端的存在感而兴奋不已，往往在未分析客户行为的情况下就开始了设计流程。这种分析是设计的关键输入，因为它能揭示最常用的移动设备、在移动设备上最常执行的操作（例如缩放产品图片）、来自移动设备的转化率，以及使用移动设备的购物者提出的其他问题。这些因素对于确保移动端体验满足购物者的需求至关重要。
需要持续进行此类分析，以便不断完善和优化面向客户的网站。
2. 从桌面版开始设计
大多数电商商家首先为桌面版设计网站，尽管从较小的移动屏幕开始设计然后向上扩展至桌面端更为容易。此外，大多数零售商并未意识到将网站缩小以支持智能手机所面临的技术挑战。
通过首先关注较小的屏幕，重点在于为移动用户设计更好的体验——这使得同时为桌面和移动两个渠道进行设计变得更加容易。
3. 缺乏测试
在将响应式网站公开之前，测试是强制性的。但响应式网站往往在极少或完全没有测试的情况下就发布了。我曾见过响应式结账的主要流程出现中断，例如——如果经过测试本可以发现这个问题。大多数零售商资源有限，因此一旦响应式网站构建完成，他们希望尽快上线，而不愿对其进行彻底测试。
至少应在主要浏览器（Chrome、Explorer、Firefox、Safari）和操作系统（Windows、Mac OS）以及主流移动设备与浏览器的组合上测试网站的主要用户流程，并且对网站的任何更改都需进行此类测试；借助易于使用的自动化测试工具——例如BrowserStack和Viewport Resizer——只需几小时即可完成这些流程和组合的测试。
BrowserStack 提供即时的跨浏览器测试。
4. 移动端屏幕上的行动号召按钮太小
为了将所有内容塞进小型智能手机屏幕，电商商家常常将行动号召按钮做得过小。如果用户必须放大才能点击按钮，或者因为按钮太小而误点其他按钮，他们可能会感到沮丧并离开网站。
即使是笔记本电脑也提供了触摸屏。因此，请设计具有适当大小行动号召按钮的界面，这些按钮既不能太小，彼此之间也不应过于靠近。
5. 移动端页面加载缓慢
移动用户希望快速采取行动。保持页面尽可能小以确保快速加载非常重要。在将内容（包括图片、按钮、文本）纳入页面之前，请仔细审查所有内容。据报道，Google 已开始将页面速度作为搜索引擎排名网站的指标之一，因此拥有更轻量的网站变得尤为重要。
如果页面需要更多内容，则将这些内容分隔到不同的标签页中。例如，产品页面可以包含基本的产品图片、描述、价格和购买按钮。客户评价和产品视频可以放在单独的标签页中，从而减小主产品页面的大小。
除了内容之外，渲染页面还需要多种资源，如 CSS 文件、图像文件和 JavaScript 文件。并非所有设备都需要每种资源。设计网站时，应仅发送显示页面所需的资源。不必要的资源会延迟页面的加载速度。
市面上有工具可对资源文件进行压缩以缩短下载时间——例如Uglify和JSCompress。
6. 为移动用户减少内容
电子商务网站经常为移动用户隐藏部分内容以减小页面大小。然而在许多情况下，页面大小并未真正减小。内容只是在向最终用户展示页面时被隐藏了。其他一些网站能够动态生成页面以减少其大小，这确实提高了移动用户的下载速度。
无论如何，向移动用户展示较少的内容是不好的做法。这会混淆用户体验。大多数用户在购物过程中会使用多种设备。根据 Google 的数据，90% 的互联网购物者使用多种设备。在响应式设计中对他们的体验进行限制是一个错误。
7. 仅支持一种图像分辨率
设计良好的响应式网站会根据用户的设备更改图像的分辨率。但许多网站仍然未能做到这一点。大尺寸图像会导致移动设备的加载时间变慢。
有多种方法可自动缩小图片尺寸以适应用户的设备；流式图片——一种使用相对单位而非绝对像素尺寸来设定图片大小的CSS技术——能够正确渲染图片；此外还有多个用于提供响应式图片的WordPress插件；还有一个名为picture的HTML5元素正逐渐成为首选方案，因为它能根据设备提供相应的图片。
8. 电子邮件不具备响应性
网站通常具备响应性，在桌面设备和移动设备上都能良好运行，但相关的电子邮件却不具备响应性。结果，移动用户在查找实际购买的商品之前，难以查看订单详情或浏览电子邮件中的推荐商品列表。
电子邮件是客户接触的关键触点。它们应成为响应式设计和测试流程的一部分。保持电子邮件简洁，只包含最相关的信息。