谨记这7个最佳实践 设计移动应用

近3年间，桌面互联网的使用从90%下降到60%，而移动应用则提高到40%。按照这一趋势，用不了多长时间移动设备将会迅速抢占桌面互联网的市场

近3年间，桌面互联网的使用从90%下降到60%，而移动应用则提高到40%。按照这一趋势，用不了多长时间移动设备将会迅速抢占桌面互联网的市场。

很多设计师设计移动设备的默认方法依然是按比例缩小（桌面）网站，再使其响应。这种方法真的是一种很糟糕的移动设计策略。你不能仅仅只是缩小一个网站，你还需要检查你的客户业务，并针对特定业务评估移动接入的重要性。

如果你的客户的顾客主要是台式机/笔记本电脑用户，那么你不需要理会移动接入。但是，如果你的客户需要一个在线商店或者根据顾客所在的位置提供本地化的信息――那么你最好不要使用上述的移动设计方法。为了尽可能地提高访问容量，扩大你的（客户）业务，你的网站需要能够匹配多种设备的访问。所以先设计一个移动网络策略吧。

关于移动设备的设计难点是，存在着许多变体，尺寸大小和风味。就像20世纪90年代的浏览器大战！

为了提供更好的，更直观的，更人性化的移动体验，让我们先来看看一些你应该谨记的移动设计最佳实践：

1、明确、重点突出的内容

▲反面例子

许多人通常是在室外使用他们的移动设备――在一种匆匆忙忙的状态下。由于是小型的触摸屏，所以做起搜索和导航功能来并不容易。故而移动设计的体验之一就是简约原则。将干扰保持到最低限度。每个页面包括首页应该只有一个关注的重点。不要期待用户会接受任何非典型的手势，如滑动到下一个页面或者水平滚动。总之要让用户感觉怎么简单怎么来。可以通过小箭头或者悬浮消息来说明功能，不惜一切代价地要让用户更方便地找到他们想要的东西。

2、菜单和导航：保持简单化

传统的桌面网页会在页面顶部突出显示菜单栏。但是在移动设备上这会占用宝贵的屏幕空间。要解决这个问题，可以使用手风琴式下拉菜单，或者在手机屏幕的左上角或右上角显示菜单图标。

另一个不适用于移动设备的桌面习惯是，悬停显示拥有子菜单的多级菜单。在移动设备上，如果用户需要通过4级菜单才能找到想要访问的内容，那他们很有可能在第二次点击之后就关闭页面。所以在移动网站上应该尽可能地避免多级菜单。这一点和台式机设计有着本质的区别。

3、流式的布局

移动设备的尺寸种类很多。但千万不要偷懒只设计了一个320像素的宽度。不管你承认与否――176、240、320、360，~480-600（横向）都是常见的设备宽度。灵活和流式的布局方可确保网页正确展示在不同的屏幕尺寸上。

4、触屏设计

只需要用键盘和鼠标事件就能与网站互动的美好时光一去不复返了。在移动设备上，互动的主要方式通常是触屏。触屏设计需要关注光标的精确，必须考虑所有形状和大小的手指产生各种类型的压力，在触碰屏幕时产生的不同响应。您需要确保表单、按钮和其他需要触摸或手势输入的元件足够大，以避免与相邻元件的重叠，或者误解触摸事件。

不要仅仅依赖于触摸输入。有迹象表明，有很多移动设备是使用触屏笔的，甚至一些老款的旧手机依然在使用方向键板。有许多移动设备/浏览器并不完全支持JavaScript的触摸事件。此外有的用户会使用组合设备输入，例如，使用鼠标连接到平板的情况。尽管这种情况不太常见，也应该评价他们对网站的重要性，并采取适当的处理措施。

5、表单最小化

小小的触摸屏，更小的虚拟键盘――仅仅5mmx 5mm大小，使得打字体验变得不那么美好。表单应该既小又简单。如果需要的话，可以构建独立的表单，用最少的字段来获取所需要的数据。尽可能预填充有默认值的字段。自动填充常用字段。

例如，使用可视化的日历，而不是让用户键入日期。对于那些不止一屏的长表单，最好设置进度条，用来说明用户已经完成了多少步骤，还需要多少步骤才能结束。

说到表单，那怎么能漏掉标签布置呢？你知道如果是顶部对齐的标签用户填写表单更快吗？即使设备可以在你打字的时候放大输入字段，也应该将标签保持在输入字段之上以确保它的可见。顶部对齐的标签也更方便用户在滚动到下一页时浏览字段和保持跟踪。

6、放弃图片

规模和速度是移动网站两个最为重要的性能。不要使用图片来实现如渐变和阴影的奇特效果。了解CSS的基础知识，并应用到网页设计中。使用图片来实现特殊效果越少越好。但是，并非所有的CSS3特效都可以在旧版的移动浏览器中实现，不过这没关系。网站的像素也没必要达到100%的完美无暇。

如果你喜欢在你的设计中使用花哨的文字作为图像，那么你最好放弃这种要不得的习惯。文本就作为为文本保存。虽然使用花哨的字体可以达到你想要的效果，但是这会占用网站的空间，增加页面的加载时间。

7、充分利用手机的特定功能

▲iPhone的滑动解锁

移动设备有许多功能，如GPS，Gyrometers和其他桌面设备不具备的感应器，如“滑动解锁”，以及打电话的功能。弄清楚如何使用这些功能，可以提升网站的移动体验。你也可以添加简单的功能，例如在联系人页面“点击”电话号码“通话”，共享整个社会媒体平台，通过GPS提供的位置提供具体的信息和服务等。这些都是你可以利用的手机特定功能，在它们的基础上打破陈规来实现更好的移动体验。

最后，大家有什么其他好的实践方法欢迎指出。