移动网页设计9大原则——第1部分（网页设计的基本原则）

移动网页设计9大原则——第1部分（网页设计的基本原则）

有了谷歌的移动友好算法，你或许以为当代的所有网页都具备移动兼容性。但实际情况却是：近50%的市场营销者没有将网页优化使之兼容移动设备，虽然这些网站的搜索流量和排名都在增长。导致这种现象的原因是什么呢？是因为移动友好算法的影响不足以促进网页重新设计？还是移动网页并没有给这些网站带来用户？

这些数据对于我们了解移动用户的行为十分重要，不容小觑。因为移动设备的屏幕较小，而用户通常在忙碌的情况下使用移动设备，所以他们更偏向于完整清晰显示的网站。如果用户无法快速从某个网站上获取所需信息，他们就会转向另一个网站。这就意味着，网站必须迅速向用户提供他们所查找的信息，一刻也不能耽误。

基于这一点，许多网页设计者在搭建网站时，会遵循移动第一的原则，确保网页加载时间短，图表数量少，或者内容大小适中，不需要用户去放大缩小。如果你的网页还不兼容移动设备，别惊慌，改造网页使其符合响应性设计，或另外设计移动版网页并没有你想的那么复杂。现在已经有许多网站搭建平台可供使用，而且他们与旧网站使用的搭建平台类似。

无论你是否已经完全采用移动策略，还是仍然在寻找最佳方案，在设计移动网页时，请牢记以下原则：

1）菜单简洁明了

在这家餐厅的移动网页上，企业标志下方有一个简单的下拉式列表，展开后有5个选项。因为 “菜单”和“位置”按钮已经在页眉显示，所以就不需要再放入列表。这样的菜单栏虽然简单，却在网站前端和中心位置显示了最重要的信息。

当用户访问餐厅的网站时，可能会查看菜单、寻找餐厅位置，或者在线下单。Carrabba’s的网站能让用户迅速快捷地完成以上所有事情，而不至于陷入满是开胃菜、意大利面以及欢乐时光特惠的子菜单中。

2）表单简短贴心

当需要在网页上填写联系信息时，用户可不想没完没了地填很多内容。他们往往倾向于台式电脑或笔记本，而不是移动设备来完成此类操作。因此，在设计用户信息表单时，请省略掉不必要的字段。

如果联系表单只是用来订阅电子报，那么仅需登记用户姓名和邮箱即可。即使是支付表单，也请将字段数减到最少。用户明白在线购物需要填写更多的信息，但网页设计者必须体谅用户的时间，尤其是当网站的移动流量不断增加时。

我们可以用A/B测试来决定表单的理想字段数，即每次改变或移除表单中的一个字段，然后评估表单的完成比例。比如，用户更愿意填写无需登记电话号码的表格，所以在测试时，比较一下有无该字段以及该字段为可选或必填项时的不同效果，然后将这些结果与实际获得的投资回报率做对比，决定是否在表单中保留该字段。

万事达卡（MasterCard）在设计联系表单时，就十分周到地考虑到了移动端用户的时间。用户在他们的网站上只需填写姓名、邮箱、主题和评论，就能与卡片的支持团队取得联系。这些信息足以让工作人员查询到用户的账户信息，然后将用户的需求转给合适的支持部门，整个过程并不需要耗费太多时间。

同时，表格中诸如电话号码、卡片类型和发卡机构是可选项，用户可根据自身情况选择填写。即使用户不提供这些信息，也不影响问题的解决和需求的满足。用户对于自己的财务信息的保护意识非常强，所以请给他们一些空间，不仅要满足用户的需求，还要建立起他们对网站的信任。

3）简化表单字段

除了要考虑到表单的字段数，还需要减少用户输入的字数。表单字段可以采用多种类型，如下拉式、复选框式以及日历式。当用户输入支付信息、物流信息以及预订行程时，这些类型的字段就能派得上用场。

同时，尽量将表单做得清晰明了，使必填项和可选项一目了然。让回头用户更便捷地应用自动填写功能，缩短购物的过程，并为那些不愿注册账号的新用户提供访客支付选项。

对于旅游公司而言，利用简洁的表单为潜在客户提供便捷的搜索是关键。全球最大的网络旅游公司Expedia在这方面堪称完美典范——网站上的按钮一目了然，用户搜索时也只需填写很少的字段。

4）通过行为召唤组件（CTAs）吸引用户眼球

行为召唤组件对任何网站设计而言都是必要的，在移动网页中尤为重要。和电脑端用户相比，移动端用户访问网站的目的更加明确。所以在设计移动网页时，尽可能将行为召唤组件放在最显眼的黄金位置。

理想情况下，将行为召唤组件放置在页眉上方，用突出的颜色或字体显示，在合理的范围内让它们更加醒目，并清晰地表达其内容。后续的操作步骤则需要非常清晰，这样用户就不用花时间去考虑接下来应该做什么。