桌面网站的一些设计原则是大家广泛认可，并积极付诸实践的。例如：系统状态保持可见，避免错误信息，在错误发生时，应该提供一些具体的指南帮助用户解决这些问题等。
很多人认为这些适合网页设计的原则和指南也同样适用于移动平台。毕竟，网页设计是从一些基础的，基于文本的HTML出发，才发展成为今天的WEB标准的。因此，我们也可以想象依靠这些原则，手机站点的设计也会和网页站点的设计一样，获得巨大的成功。
然而，移动站点的设计仍处于初步阶段。Jakob Nielsen在2009年移动可用性调查时指出，相比与网页站点80%的成功率，用户使用移动设备查看移动站点时平均成功率只有64%， 形式要素的差 异对用户交互成功率的影响是巨大的，因此，在进行移动站点的设计时要充分考虑移动设备的形式要素，
随着手机站点设计的持续增长，一些新的原则，以及一些好的设计实践将会浮出水面。作为前进的第一步，本人通过分析一些成功的手机站点来研究两者的不同。在我的研究中，涵盖了航空，电子商务，社交网站，娱乐等一些较成功的站点，并得出了至少10个区别。
1. 内容优先
桌面站点可以有1024*768的分辨率，而智能机仅有320*480分辨率，如何在如此小的分辨率中，在不降低用户体验效果前提下进行设计是很有 挑战性的。桌面站点常常包涵更广的内容，而移动站点仅包涵一些符合使用情境的主要功能和特征，如图1、图2所示Orbitz的桌面站点和移动站点。移动站 点应该通过移动设备将用户最需要的内容和特征展现给用户。一些站点内容，信息架构和屏幕布局都是在深度理解客户需求的前提下设计的。
图 1—Orbitz桌面站点特征
图 2—Orbitz移动站点特征
2. 垂直浏览取代水平浏览
如图三Urban Outfitters站点所示的那样，在呈现数据结构和数据内容时，水平导航是一种广泛采用的导航方式。用户可以从左到右，点击不同的站点链接来浏览。Joshua Porter在一篇名为“The Challenge of Moving to Horizontal Navigation“的 博客中，讨论了在页面顶端而不是页面两侧使用水平导航的好处。至于顶端时，用户可以更容易聚焦于页面的内容，而在两侧时，会很容易干扰用户视线。在我的研 究中，90%的移动站点采用垂直导航的方式取代水平导航，包括如下图所示的Urban Outfitters移动站点。
图 3—Urban Outfitters桌面站点中的水平导航
图 4—Urban Outfitters移动站点的垂直导航
3. 导航条，标签和超文本
如图5所示，超链接是因特网站点的主要组成部分，然而，在移动站点中，我们则很少看到超链接。并不是在移动站点中没有超链接，而是被一些导航条，标签和按钮等取代了，如图6所示。用户使用手指来操作移动设备是产生垂直导航方式的原因之一。
在电脑上，移动鼠标，点击超链接是很理想的查看信息的方式，但是在移动设备中，通过手指触摸屏幕来打开超链接就不那么容易了。用户可以很容易激活一 个链接，进入一个新页面，但，这并不是用户期望的页面，如果这样的话，会产生非常差的体验效果。Fitts定律告诉我们使用指点设备达到一个目标的时间与 设备当前的位置和目标位置的距离，以及目标的大小有移动的关系。在一些大的手机站点中，导航条，标签和按钮会吸引更多的注意力。
图 5—Kayak 网页链接
图 6—Kayak 手机页，没有链接
4. Text and Graphics文本和图形
在网页中，我们经常会看到一些促销，营销或者导航的图形信息。如图7所示的dell站点，设计者经常需要设计一些促销或营销的图形，如图8所示、公 司LOGO始终保持着导航的目标，通过它，用户可以进入主页。而在移动站点设计中，应该减少这些图形，原因有二：其一，一些移动设备并不支持和传统网页站 点一样显示方式；其二，移动屏幕较小，显示内容有限，除此之外，过多的显示内容会降低移动设计的运行速度。
图 7—Dell首页，有图形
图 8—Dell 移动页，只有较少的图形
5. 全局导航与情境导航
桌面站点提出使用多种导航方式，如图9 Best Buy 站点。一些全局性的导航可以保持站点的一致性，而其他一些情境导航会随着用户使用站点的不同而不同。在移动站点中，全局导航是最常见的导航方式，如图10 Best buy的移动站点就是非常典型的例子。
在移动站点中，移动设备有限的屏幕决定了应该减少全局导航和情境导航。然而，缺少全局导航和情境导航则会让用户迷失，为此，在构建移动内容时，应该尽量减少层级关系，这样，用户无需挖得太深就可以找到自己所需的信息，作为设计师，应该让用户在迷失之前找到自己的信息。
图 9—在Best Buy桌面站点中各式各样的情境导航
图 10—在Best Buy 移动站点中，没有情境导航
6. 页脚
在桌面站点设计中，有两种典型的页脚，第一种页脚提供了一些内容的连接，用户可以查看主页，或其他一些较低优先级的内容，如“人才招聘”和“站点地图”。第二种脚注，则提供了用户想看的所有内容结构，如图11所示，在页脚中列出一些快速入口，用户就可以纵观整个站点。在移动站点中，通过页脚，用户可以查看首页，但尽量保持最少连接数，如图12所示，在页脚中，不包含全部快速链接。
图 11—Dell 桌面站点的页脚
图 12—Dell 移动站点，较少的页脚
7. 面包屑
如图13所示，在桌 面站点中，面包屑导航可以有效地标明用户所在的位置，查看自己的导航路径，但通常会让用户产生站点内容多，层级关系深的感觉。面包屑导航方式很少出现在移 动站点中，通常也是没有必要的。有限的空间结构是原因之一，另外，这种方式使得用户需要经过很深的途径才能找到所需要的信息。同样，我们应该让用户在有迷 失感之前获取想要的信息。
图 13—Amazon移动站点的面包屑
8. 进度条
在桌面站点中，如果用户需要通过多种步骤才能完成某一过程，如购买过程或者填写较长注册表过程，如表14所示， 在页面的顶端经常会给出一个进度条，指导用户完成这个过程，这种进度条在移动站点中还没有出现。
采用一些替代的方法，让用户无需进度条，就可以表明当前所在的位置。如，不使用一些暗含用户操作“下一步”或“继续”的按钮，使用明确的标签按钮，告知用户的下一个步骤，如“前往收银台”“指定送货及付款”。这样，用户不仅知道当前的过程，还期待下一步的信息。
图 14—Amazon 站点的进度条
9. 集成手机功能
智能机是通信设备，打电话是其基本功能。尽管移动平台的设计和内容都是有限的，但仍具有一些桌面平台无法比拟的新机会，例如，可以使用直接拨打电话 或短信的方式订购物品，如图15所示，将促销短信与产品功能进行整合，用户只需选择一个手机号码，然后通过这个号码来打电话或发短信，无需输入数字。
图 15— Best Buy 移动站点，电话购物
10. 本地化和个性化搜索
基于地理位置的服务是移动站点独一无二的优势。仅在5年前，地理位置服务才和消费市场结合起来，现在，在一些移动程序和网页站点中，地理位置服务作为增值服务的一部分而广泛使用。
很多移动设备可以自动检测用户的地点，并给出一些本地化的检索结果。如图16，Best Buy本地商店搜索功能，Yelp的餐厅搜索，Kayak的班机搜索，通过了解用户的交易地点以及一些临时服务，商家就可以有针对性地推广自己的产品或服务。
图 16—在Kayak中，自动监测地理位置并给出一些检索建议
小结
基于我们的研究，我们总结了移动站点和桌面站点设计10大不同点：
- 桌面站点可以包含更丰富的信息，而移动站点包含一些在大部分时间，地点中使用的典型功能和特征。
- 桌面站点采用顶端的水平导航方式来呈现站点结构和内容，而90%的移动站点采用垂直导航的方式。
- 桌面站点通常使用超链接，移动站点极少使用超链接
- 桌面站点会根据促销，营销，导航目的的不同设计不同的图形，移动站点应避免一些促销或营销的图形，较少使用导航图形。
- 在桌面站点中，可以使用各种各样的导航方式，如全局导航和情境导航。移动站点采用全局导航，情境导航极少。
- 在桌面站点中，用户可以通过页脚查看站点内容，或查看一些快速链接。移动站点较少采用一些页脚，更不会使用页脚来包含一些快速链接。
- 在桌面站点中，面包屑导航可以帮助用户找到需要的页面，或者返回查看一些导航路径。而在移动站点设计中，由于自身的一些平台结构的限制，面包屑导航的方式是没有必要的。
- 桌面站点通常在页面顶端增加进度条来引导用户完成某项进程。移动站点并不出现进度条。
- 移动站点可以更好地整合手机功能，如电话直接订货或发送促销信息。
- 移动站点可以使用一些技术手段自动检测获取本地搜索结果。根据用户的一些喜好提供个性化的搜索结果，对用户来说更加重要
原文地址：http://www.iptu.net/index.php/archives/3059.iptu
