响应式设计、移动端网站与原生应用的优点和缺点

本文由大漠根据Armen Ghazarian的《The Pros and Cons of Responsive Web Design vs. Mobile Website vs. Native App》所译，整个译文带有我们自己的理解与思想，如果译得不好或不对之处还请同行朋友指点。如需转载此译文，需注明英文出处：http://designmodo.com/responsive-design-vs-mobile-website-vs-app，以及作者相关信息

——作者：Armen Ghazarian

——译者：大漠

让你的企业业务进入移动领域的最佳方式是什么呢？

移动端的优化最近成了一个时髦的话题，将来也会有更多关于这方面的讨论。根据Mashable在2013年8月份发布的统计，可以得知，全球所有网站流量的17.4%都是通过移动设备来的，而这个数字在2014年将会继续增长。所以，你如果不想失去一杯羹的话，是时候步入移动端的领域了。

仅希望像Google和苹果这样的行业巨头公司网站适应移动设备往往是不够的，除非您不介意丢失几乎五分之一的游客到您的网站。

下列哪一种方案最适合您的业务呢？

• 响应式设计(Responsive Web Design)
• 移动网站(Mobile Website)
• Native App

要回答这个问题，我们通过了解他们各自的优点和缺点来作为回答。

响应式设计(Responsive Web Design)

响应式设计让你的网站可以自适应的适配浏览他的设备屏幕大小。这是基于桌面网站自适应网站的内容，设计和导航的方法，让使用移动设备的用户浏览网站更具舒适性和使用性。

有关于响应式设计的相关内容，如果您感兴趣的话，可以点击《Responsive教程》更深入的了解他。——@大漠

这意味着，你有一个网站可以同时适配所有的设备。

Codrops大屏幕

Codrops中等屏幕

Codrops小屏幕

响应式设计的优点

• 一个网站：适应所有设备，他更容易管理。
• 一个URL：让你的用户在移动设备上更容易找到，而且不需要任何的重定向，这在较慢的网速下特别的有用。
• 容易做搜索引擎优化：不需要为移动设备创建特定的内容，可以让移动设备使用桌面网站的搜索引擎优化的好处。
• 易于营销：网站在移动设备上显示，对于营销部门来说不需要增加额外的工作量。
• 成本低：简单的数学运算，一个网站比两个网站要便宜吧。

响应式设计的缺点

• 一个网站：让一个网站适配所有网站，对于你来说很容易，但不一定适合你的用户。你需要在同一个页面上展示不同的侧重点，以便使用该平台的最大优势，最大限度的提高你的转化率。
• 技术：响应式设计他是一种较新的技术，在一些老的设备和浏览器中加载页面速度过慢，甚至是完全不支持。
• 用户体验：移动端和PC机上的用户体验是完全不同的。所以一个网，甚至是响应式设计，在两个平台上都会损害您整体的UX。如果你试图使用相同的界面来满足移动和桌面的两个平台的用户使用，到最后可能谁都无法满足。

响应式设计在某些情况之下，他可以是一个强大的工具，但不是一个最终解决的方案。

Mashable大屏幕

Mashable中等屏幕

Mashable小屏幕

Smashing Magazine大屏幕

Smashing Magazine中等屏幕

Smashing Magazine小屏幕

Mobile网站

移动网站是考虑平台的有限性和机遇，为移动设备专门设计的。在开发移动网站，你需要注意小屏幕尺寸和交互方式（触摸）和有限的网速(2G/3G)。内容必须是方便，快速加载和可读性。因为有一堆不同屏幕和交互的移动设备，不可能为每个设备类型创建不同的网站。因此，即使您的移动网站具有响应效果，适应所各种屏幕，这也成为一个大家观注的问题。

开发移动网站的时候也有几个原则，像组织你的内容使他更符合人体工程学的用户界面，需要遵循一列布局。

Meetup web

Meetup mobile

Meetup app

移动网站的优点

-　用户体验：恭喜！你有一个网站，是专门为移动设备创建的，考虑到平台的所有优点和局限性，让你有一个良好的机会，创造一个漂亮的和可用的UX。 -　速度：您的网站在移动平台上加载更快，更轻松。 -　成本：相对于响应式设计，创建一个移动网站并不便宜，但你仍然可以到一个非常合理的价格价的价值。 -　从本搜索中受益：搜索引擎提供的良好的UX往往不如你做的，所以本二搜索结果优化，移动网站有更好的机会进行排列。 -　立即访问：虽然比响应式设计没有额外的好处，但对于一个需要下载的安装的Native App，仍然发挥着它的作用。

移动网站的缺点

-　多个URL：您的用户必须记住两个URL，或以其他的方式重定向到移动网站，这需要几秒钟的时间。而且移动网站还需要为SEO做额外的工作。 -　维护：您必须得维护两个网站。 -　没有普遍的一致性：你必须考虑到，有两种不同类型的移动设备：触摸屏和键盘导航。一个单一的移动网不以同样的方式在所有类型设备上工作。

Klout web

Klout mobile

Klout app

Native App

Native App是专门为移动设备开发的软件。本机应用程序不是所有的设备共有的，因为它们是为特定的操作系统进行开发。用户必须要从一个特定的操作系统商店下载应用程序，如在Google Play或Apple Store，然后安装到移动设备上。

关于应用程序最重要的是，他们是灵活的和让桌面上的网站不具备这些东西，而且还配有手机特有的功能，比如使用摄像头，语音按钮，GPS数据或NFC，联系人或相册等等。

Native App的优点

• 用户体验：Native App比任何移动优化方案都具有更好的UX。
• 辅助功能和速度：应用程序可以运行，即使没有连接网络也可以访问您的所有信息。如果你足够幸运，拥有一支丰富的团队和良好的编码器，你的运用程序可以加载的更快，更顺利。
• 一切你能想象：在这里你可以和应该考虑的盒子，并得到创造性。移动平台，尤其是带触摸的导航，可以提供更好的UX功能和工作质量。
• 可见性：一旦用户在移动设备上安装了，他就一直会显示在菜单中或在桌面上有一个独特的图标。

Native App的缺点

-　不能在所有设备上访问：你的应用程序是建立只是在一个特定的操作系统，这意味着iOS系统上的应用不能在别的设备上访问。 -　不具灵活性：所有的应用程序更新都必须通过应用程序商店，每次提交都得获得批准，这有可能需要长达几个星期的时间。而且不是每个用户都很乐意与频繁的更新，有些人会一直使用旧的版本。 -　成本高：Native App的开发显然是众多解决方案中最贵的一种。 -　营销和搜索引擎优化：需要一个完全不同的营销策略来推广你的应用程序，你可以需要一个专业的移动营销人员帮忙。

Shazam app

那么哪一种方案最适合你的业务呢？

要回答这个问题，你应该考虑您的业务目标。当然没有任何一个理由，企业为什么不能同时具有一个移动网站和一个原生应用程序。或者你可以选择一个响应式网站，适应台式机，平板电脑，手机网站。具体取用哪个方案，主要还是看你的业务规模和预算，也就是说，你愿意给这个项目花多少钱。

如果你要经常更新内容，那以响应式设计网站很容易更新和管理。如果您的企业需要一个完美的UX和优异的性能，并且可以跨平台，那么原生应用是个可选的方案。

所以，给移动端优化做出最后的选择，记住三个要点：你的业务目标、项目预算和行业特点。

所有这些解决方案都可以在一起的工作，相互补充。但有一点是清楚的：最好的解决方案是给你用户一个最好的效果。

译者手语：整个翻译依照原文线路进行，并在翻译过程略加了个人对技术的理解。如果翻译有不对之处，还烦请同行朋友指点。谢谢！

如需转载烦请注明出处：

英文原文：http://designmodo.com/responsive-design-vs-mobile-website-vs-app/

中文译文：https://www.fedev.cn/css3/responsive-design-vs-mobile-website-vs-app.html

Ultra Boost Uncaged