编者按：九月时，我们发表了《志愿者免费获得移动优化电子商务网站》一文，邀请商家参与一项移动优化案例研究，我们将逐步跟踪创建移动网站的过程。数十家商家提交了他们的网站，经过审核流程后，我们将选择范围缩小至DecalGirl.com。以下是该案例研究的第三部分。
第一期 《为移动设备优化电子商务网站，第一部分：入门》 我们于11月发布，当时 MobilizeToday.com，一家移动开发公司，以及 DecalGirl.com，一家销售移动设备“皮肤”的电子商务公司，开始探索如何最好地着手进行该项目。
我们在十二月初发表了第二部分，《第2部分：布局与设计》，这是在为DecalGirl.com开发移动首页初始原型之后发布的。
现在，我们回顾他们迄今为止的进展，因为他们从11月到12月一直扎实地工作。
内页设计与开发
在“第二部分”中，Peters 制作了自己的主页设计，这与 Trugbild 设计的原始原型相反。双方都更喜欢 Peters 自己的设计。
Peters 的主页设计。
现在，随着主页的美学方向和功能基本达成一致，内页设计——包括导航以及与不同移动设备的兼容性——成为下一个开发阶段。
Peters 希望将从主页到内页的导航尽可能简化，使用三个主要按钮：“购买皮肤”、“浏览设计”和“浏览艺术家”。
Peters 的目标是让消费者能够通过几个简洁直观的选项进行层层深入。他希望消费者首先选择，例如，“购买皮肤”。这将把消费者带到一个设备制造商列表页面，用户可以在那里选择，比如，“Apple”，并获得 Apple 生产的设备类型列表。然后，用户可以购买针对该特定 Apple 设备类型的皮肤。
考虑到 Peters 的目标，Trugbild 提供了以下初始内页设计。
用户在主菜单中选择一个选项后，会出现子菜单项列表。该列表填满移动设备的整个屏幕，并自动适应横向或纵向视图。内页子菜单上的每个选择都进一步聚焦消费者的搜索范围，正如 Peters 所期望的那样。每页都有简化的导航，仅在每页底部设有类别按钮和一组“上一页/下一页”按钮。
Trugbild 的分页内页原型图。
在美学方面，Peters 觉得橙色选择过于强烈，并要求将内页菜单的背景颜色改为更深的色调，而将橙色作为高亮色以指示已做出选择。
在导航方面，Peters 还认为“上一页/下一页”按钮需要消费者进行过多的操作，因此他要求采用滚动式列表——这一功能由 Apple 的 iOS 普及——而不是分页跳转。
Peters 还要求在所有内页上都显示一个“搜索”字段，以便通过长长的产品列表进行另一层筛选。Trugbild 立即将“搜索”框添加到设计中，并继续完善内页的滚动列表和调色板。
Trugbild 添加的“搜索”框。
应针对哪些设备以确保兼容性
Trugbild 表示，移动市场的领导者是 iPhone 和 Android，必须确保 DecalGirl.com 的移动网站与这些设备兼容。Trugbild 请 Peters 利用 DecalGirl.com 的网站流量人口统计数据，以帮助确定访问 Peters 网站最常用的移动设备。
然而，Trugbild 提出了这一注意事项。他表示，重要的是还要考虑到 Peters 获得的访客统计数据是基于网站的桌面版本，并且由于移动优化，这些统计数据可能会发生巨大变化，可能会吸引更多移动用户。因此，一旦移动网站上线，就很重要要监控访客统计数据，并跟上其移动设备、浏览器和操作系统的变化，以保持良好的兼容性。
移动优化平台提供商支持的设备各不相同。Trugbild 的 MobilizeToday.com 提供与以下设备和操作系统兼容的移动平台。
- iOS：iPhone 和 iPod Touch
- Android OS 设备
- BlackBerry OS 5 及以上版本
- Palm webOS 1.4 及以上版本（Pre 和 Pixi）
- Windows Phone 6.5 及以上版本
- Symbian S60
Ryan Peters
Trugbild 表示，Android 和 iPhone 的兼容性是 MobilizeToday 提供最具成本效益的方案，因为他的公司在这些主流品牌上进行了最多的开发和测试。如果 Peters 希望将其他移动设备添加到兼容性列表中，由于 MobilizeToday 对市场份额较小的设备进行的开发和测试较少，成本将会增加，Trugbild 说道。
DecalGirl.com 桌面站点的用户人口统计数据向 Peters 表明，针对 iOS 和 Android 设备是最理想的。iOS 和 Android 用户合计占 Peters 网站流量的最大比例：总计 5.5%。Peters 指出，尽管 BlackBerry 设备用户仅占桌面站点流量的 0.43%，但这每月仍有数千次访问，他也希望看到 BlackBerry 的兼容性。
Trugbild表示同意，他和Peters决定将兼容性重点放在DecalGirl.com用户最常用的三种设备/操作系统上：iOS（包括iPhone和iPod Touch）、Android OS以及BlackBerry OS 6。
针对移动端的进一步适配与删减
随着DecalGirl.com网站内页设计的持续推进，Trugbild列出了DecalGirl.com桌面版网站中各种特有的问题点。这些丰富的桌面端功能在移动端要么尽可能进行适配，要么在无法适配的情况下完全舍弃。
Trugbild指出，这些特定功能之所以棘手，是因为在桌面版网站上用于创建它们的JavaScript代码会导致移动设备上的加载时间变长：
- 实时帮助。DecalGirl.com桌面版上提供的实时客户支持聊天选项由外部第三方服务提供，在移动视图版本中将被省略。
- 产品图像。产品列表页面图片密集，Trugbild担心在移动设备上加载这些图像会导致加载缓慢并造成整体用户体验不佳。不幸的是，这些图像不能丢弃，因为它们是DecalGirl.com产品的主要卖点。必须对图像进行适配以适用于移动视图，Trugbild建议使用各种JavaScript编码技术来减少加载量。
- 图像预览。Trugbild指出，当顾客在DecalGirl.com购物车的桌面版上购物时，所选产品和变量会通过JavaScript代码触发显示带有图像或更多产品详情的各种“弹出”框。但正如Trugbild所说，这种风格再次被认为“加载过重”。Trugbild计划提出不同的解决方案来展示这些变量。
- 幻灯片展示。网站的桌面版使用JavaScript实现了产品幻灯片展示功能，由于加载时间问题，Trugbill建议将其从移动视图版本中省略。
- 用户评论表单。Peters的网站有一个基于JavaScript代码的用户评论表单，供用户留下关于产品的评论并进行评分。Trugbill担心这在定制移动网站时可能会带来问题，因此建议将其省略。
总结
Peters再次明确表达了他希望自己的移动端网站呈现的外观和功能：界面精简，消费者导航简单明了。基于此，Trugbild提供了内页的初始设计稿。Peters希望看到库存以滚动列表的形式展示，而不是分页列表。Trugbild开始按照Peters的要求修改内页，并额外增加了一个搜索功能。
Peters发现访问其网站的主要移动操作系统——也是Trugbild重点兼容的对象——为：iOS（iPhone和iPod Touch）、Android OS设备以及BlackBerry OS 6设备。Trugbild还列出了一些可能无法适配、在双方准备最终确定移动端平台设计时可能需要舍弃的桌面端功能。
在下一期中，我们将关注DecalGirl移动端菜单及购物车针对移动端使用的最终内页设计。