App网页设计和web网页设计的主要区别是什么？

我刚接触交互设计的时候也在想这个问题。我想我现在知道了& ldquo如何设计它& rdquo之前，需要明确他们到底& ldquo是什么& rdquo？

目前关于移动应用有很多概念:原生App、响应式Web、Web App、混合App。这些概念之间的区别以及各自的优缺点对于设计师来说是非常重要的。本文全面论述了这些概念，值得初学者阅读，欢迎大家提出自己的看法。

在中文描述中，直接使用了一些英文名词，没有统一标准的中文翻译。它们只是用来传达大概的意思，不一定是规范的名称。如果翻译中有任何不足之处，请多包涵。

App:应用(程序)移动App:移动应用(程序)移动响应式Web:移动响应式Web应用(也叫Web App): web应用(程序)

App网页设计和网页设计的主要区别:

需求，两种场景对应的需求不同，会相应的导致功能点优先级的变化，进而影响界面控件和消息元素。比如传统的美食点评网页肯定是优先让用户写点评的，而手机更倾向于寻找周边的餐厅。手机的界面元素更加精简，手机的显示区域有限，需要对用户的需求有更准确的把握，每个页面呈现的元素更加精准。手机更精致& ldquo藏语& rdquoWeb可以隐藏用户不太注意的元素，只在鼠标光标悬停时显示。而手机没有悬停模式，面积小，让设计师不得不学习更多隐藏信息的方法。在手机上手势操作更自然。一些web终端也在用鼠标光标模仿手势，但毕竟不自然。而手机可以用一个或多个手指进行自然控制，这是web无法比拟的。

[div][div]

移动应用和移动响应web应用

移动应用是在新平台上连接市场、收集客户数据和提供服务的有力工具。但是到底什么是移动应用呢？本质上，移动应用程序是运行在智能手机、平板电脑或其他移动设备上的计算机程序。

可以通过应用市场获得，比如谷歌安卓的Google Play或者苹果手机的App Store。这些平台现在都运行在云端(基于云的解决方案)，也就是说如果你的手机被卡车撞了或者掉到水里了，你可以买个新手机，登录，然后你所有的应用都会自动重装。

图：当你需要设置一个新的iOS设备或者在一个已有的设备上恢复数据，你的iCloud备份可以让你轻松实现。(图片来源：Pixabay)
图:当你需要设置新的iOS设备或者恢复现有设备上的数据时，你的iCloud备份可以让你轻松搞定。(来源:Pixabay)

[div][div]

应用和移动响应式网页与移动应用和移动响应式网页相比，是完全不同的概念。

在移动平台上使用互联网已经成为一种稳步增长的趋势。用户越来越习惯于在智能手机上搜索和浏览网页。为了满足这种需求，各种组织都在花钱雇佣网络工程师来改善用户在移动设备上的在线体验。你可能已经看到了这种区别。例如，Amazon.com在你的智能手机和台式电脑上的显示是不同的。

图：同样的一个网站，当在不同尺寸的设备上浏览时，看起来是不一样的。(图片来源：Pixabay)
图片:同一个网站，在不同尺寸的设备上看起来不一样。(图片来源:Pixabay)

其实响应式网页和移动应用是风马牛不相及的关系(注:即互不相关)。移动网站是浏览体验的变体。响应式网站改变了你浏览网页的方式。更准确的比较实际上强调了移动应用和网络应用的区别(想想Pandora，Spotify，Google Docs，脸书)。这些网站的行为就像计算机程序，因为它们确实如此。网页是一种交互式计算机程序(应用程序)。

[div][div]

移动应用的优势

互联网独立和缓存

即使没有网络连接，也能运行，这是移动应用最重要的优势之一。也就是说，如果你想做一个应用，它可以让用户在一个数据库里搜索信息、玩游戏或者拍照，这些都可以通过移动应用来完成。数据可以存储在移动设备中，直到网络再次连接，之后消息被重新发送回网络。

互动和游戏

虽然浏览器在交互和游戏方面一直在进步，但与计算和移动设备的原生编程语言相比，仍然处于落后状态。所以，如果你准备做一个超级交互体验的产品，比如游戏，移动应用可能是更好的选择。

人们花在移动设备和移动应用上的时间正在激增

SalesForce的一项研究显示，85%的用户表示移动设备是他们日常生活的焦点，其中90%的用户年龄在18-24岁之间。91%的消费者表示，能够通过任何方式打开内容非常重要。显然，专注于移动平台是一个明智的策略。锦上添花& mdash& mdash不可否认，Chrome已经公布了在浏览器和移动设备上推送通知的功能。但是移动设备本身可以提供更多的功能:蓝牙、信标、地理围栏、WiFi、通知推送、应用内支付(Google Play支持应用内购买)等等。

[div][div]

移动响应Web应用的优势

web应用程序的编程已经完成

可能你已经完成了桌面web应用程序的编程，剩下的就是回顾移动平台的用户体验，然后裁剪用户界面，使其对移动更加友好。这意味着可以通过调整导航菜单、按钮、字体大小和输入框来创建更好的移动平台体验(实际操作不仅仅是调整上面这么简单，还需要调整消息结构和交互方式，以更好地适应移动平台浏览器)。

不依赖于任何设备平台

Web应用独立于操作系统(例如，iOS和Android需要不同的应用)。现在，有一种混合技术允许移动应用程序开发人员仅使用一组代码来使应用程序适用于两种操作平台。但到目前为止，这仍然是一项新技术，而且非常昂贵。对于web应用程序，开发人员将为最常见的web浏览器进行设计。一旦完成，它可以在任何使用这些浏览器(如Chrome、Firefox、IE)的设备上运行。

内容不受App Store规定的限制

Web应用存在于苹果App Store和谷歌Google Play的规则之外，可以自己制定规则。进入市场没有额外的步骤，也没有复杂的限制。[div][div]

网页或应用程序可以相互链接

这是业内的新概念，意味着你可以将不同的应用链接起来，达到1加1大于2的效果，或者将属于同一家公司的产品串联起来。

考虑WebGL的局限性

WebGL是web浏览器的图像引擎。虽然它可以实现很多功能，但它并不是实现移动平台CPU密集型和图像密集型应用的最佳引擎。

[div][div]