App网页设计与web网页设计的主要区别是什麽？ 。

App网页设计与web网页设计的主要区别是什麽？

这个问题我在刚接触互动设计的时候也疑惑过，我觉得在知道“该怎麽设计”之前，需要明确的是它们各自到底“是什麽”？

现在关於行动应用的概念有许多：Native App, Responsive Web, Web App, Hybrid App，这几个概念的区别和各自的优劣对於设计师来说很重要，这篇文章较为全面地探讨了这几个概念，值得初学者阅读，也欢迎大家提出自己的观点。

在中文描述中，一些英语名词是直接拿来使用，并无统一标准的中文翻译，只为传达大致的意思，并不一定是标准化的名称，有翻译不到位的地方也请大家多多包涵。

App：应用（程式）Mobile App ：行动应用（程式）Mobile Responsive Web：行动响应式网页Web Applications（也可称为Web App)：网页应用（程式）

App网页设计与web网页设计的主要差异：

需求场景，两者对应的需求场景不同，这会相应地导致功能点的优先级变动，进而影响到界面控件和讯息元素。比如，美食评论的传统网页端，肯定优先考虑让用户写评价，而手机端更偏向於找到周围的餐馆。手机界面元素更精简手机端显示面积有限，需要对用户需求有更精准的把握，每个页面上呈现的元素更加精确。手机端更讲究“藏”web端可以隐藏用户不太关注的元素，仅在滑鼠游标hover时才展示出来。而手机没有hover的模式，同时面积又小，使得设计师必须学会更多藏讯息的方法。手机端的手势操作更自然有些web端也在用滑鼠游标模仿手势，但毕竟不太自然。而手机端可以使用单个及多个手指进行自然的控制，是web端不可匹敌的。

行动应用及行动响应式网页应用

行动应用程式是在新平台上连接市场、收集客户数据、提供服务的强有力工具。但，到底什麽才是行动应用? 从本质上来说，行动应用是运行在智慧手机、平板电脑或者其他行动设备上的电脑程式。

他们可以通过应用市场获得，例如Google Android的Google Play或者苹果手机的App Store。这些平台现在都运行在云端（Cloud-based Solutions），意味着如果你的手机被卡车撞了或者掉进水里了，你可以买个新手机，登入，然後所有你的应用都会自动被重新安装好。

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

应用程式与行动响应式网页 把移动应用程式和行动响应式网页相比其实并不成立，他们完完全全是不同的概念。

在行动平台使用网路，已经成爲了一种稳定增加的趋势。用户越来越习惯於在他们的智慧手机上搜寻和浏览网页。爲了迎合这种需求，各种机构正花钱雇佣网页工程师来提升用户在行动设备上的线上使用体验。你可能见过这种区分，比如亚马逊网站在你的智慧手机上和桌上电脑上显示得就不一样。

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

事实上，行动响应式网页和移动应用程式是苹果和橘子的关系（注：也就是两者八竿子打不着）。行动网站是在浏览体验上的一种变体。行动响应式网站改变了你浏览网页的方式。更加准确的对比其实是强调移动应用程式和网页应用程式的区别（想一想Pandora, Spotify, Google Docs, Facebook）。这些就是那种表现得像电脑程式一样的网站，因为，他们确实是。网页应用就是互动式的（网页的）电脑程式（应用程式）。

行动应用程式的优点

单机（Internet Independent）和缓存（Caching）

即使没有网路连接，也可以运行，这是行动应用的最主要的优点之一。也就是说，如果你想要制作一个应用，它可以让用户在一个数据库里面搜索讯息、玩游戏、或者拍照片，都可以通过移动应用程式来完成。数据可以存储在行动设备中直到网路恢复连接，之後讯息被重新输送回网路中。

互动（Interactivity）和游戏（Gaming）

虽然浏览器在互动和游戏方面一直在进步，但是与计算和行动设备的原生程式语言相比，它们仍然处於落後状态。因此，如果你准备制作一个有着超强互动体验的産品，比如一个游戏，行动应用程式可能是更好的选择。

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

SalesForce的一项研究显示：85%的使用者说行动设备是他们每天生活的重心，这些人中90%的年纪在18-24岁。91%的消费者说能够通过任何方式来开启内容很重要。很明显的，以行动平台爲中心是个明智的策略。 锦上添花的小功能——不可否认的是，Chrome已经宣布了在浏览器和行动设备上推送通知的功能。但是行动设备本身可以提供多得多的功能：蓝牙、信标系统（Beacon）、地理定位（geofencing）、WiFi、通知推送、应用程式内付帐（Google的Google Play支援应用内购买）等等。

行动响应式网页应用程式的优点

网页应用的程式设计已经完成

由於很可能你已经完成了桌面端网页应用的程式编写，剩下来的只是审查行动平台的用户体验，然後量身定做用户界面，使得它对行动平台更加友好（Mobile Friendly）。这意味着通过调整导览选单、按钮和字体尺寸以及输入框，来创造出更好的行动平台体验（实际操作起来不仅仅是调整以上这些这麽简单，讯息架构、互动方式得也需要做一定的调整来更好地适应行动平台浏览器）。

不依赖任何设备平台

网页应用程式不依赖於作业系统（比如针对iOS和Android需要不同的应用）。现在有一种混合技术，可以让行动应用开发者仅用一套代码来让应用程式同时适用这两种作业平台。但目前爲止这还是一项新型技术，且十分昂贵。而对一个网页应用程式来说，开发者会针对最常见的网页浏览器来进行设计。一旦完成，它可以在任何使用那些浏览器（如Chrome，Firefox，IE）的设备上运行。

内容不受应用商店规定的限制

网页应用程式存在於苹果的App Store和Google的Google Play的规定之外，因此他们可以自己订下自己的规则。没有额外的条件来进入市场，没有繁复缛节的束缚。 

网页或应用可以互相链接

这在行业中还属新概念，意思是你可以把不同的应用链接起来达到1加1大於2的效果，或者把同属於一个公司的産品串联起来。

考虑WebGL的限制

WebGL是网页浏览器的图像引擎。虽然它可以实现很多功能，但它还不是最好的用来实现行动平台CPU密集型，及图像密集型应用程式的引擎。

App网页设计与web网页设计：两者共有的优点

(图片来源:Pixabay)

获利

不管你采用两者中哪种，你都可以设计出付费订阅，然後通过应用程式来赚钱。想让用户每人每月付100元？或者付一次性499元？没问题。就算你想要它变成消耗品（在应用内下载所付的钱），这两种平台都可以做到。

整合

这两种技术都可以保证你可以从手机上得到想要的讯息。但是，取决於你想让你的应用，你甚至可以考虑设计一个混合型的应用，把网页应用开发和行动应用开发整合。

应该如何决定使用何种平台？做出一个明智决定的最好方法是咨询专家。你的开发者将会问你许多问题，甚至比上述提到的概念还要多，爲了理解你的应用如何才能最好地执行，以及建立在什麽样的平台和技术之上。当然你可以同时咨询多个开发者。

不管用哪种方式，应用开发是一个漫长的过程，需要合理的预算。因为报价上多半比传统网页设计高出许多，并且在开始开发前弄清楚投资回报率和对用户的价值，以决定应用程式是否可行。