响应式网页设计和自适应网页设计之间的差异

响应式布局
响应式布局是Ethan Marcotte在2010年5月份提出的一个概念，简而言之，就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这个概念是为解决移动互联网浏览而诞生的。
响应式布局可以为不同终端的用户提供更加舒适的界面和更好的用户体验，而且随着目前大屏幕移动设备的普及，用“大势所趋”来形容也不为过。随着越来越多的设计师采用这个技术，我们不仅看到很多的创新，还看到了一些成形的模式。

自适应  
本词条由“科普中国”百科科学词条编写与应用工作项目 审核 。
自适应就是在处理和分析过程中，根据处理数据的数据特征自动调整处理方法、处理顺序、处理参数、边界条件或约束条件，使其与所处理数据的统计分布特征、结构特征相适应，以取得最佳的处理效果的过程。
自适应过程是一个不断逼近目标的过程，它所遵循的途径以数学模型表示，称为自适应算法。通常采用基于梯度的算法，其中最小均方误差算法(即LMS算法)尤为常用。

响应式网页设计和自适应网页设计都是制作方法多设备友好的网站工作上的各种屏幕尺寸。而响应式网页设计谷歌推荐的是比较受欢迎的方法，这些方法都为多设备网页设计都有各自的优点和缺点。

让我们响应和自适应网页设计之间的差异看，专门针对这些关键领域：

易开发
控制你的设计水平
设备/屏幕支持的广度
未来的友好的解决方案
整体的下载速度和网站性能

一些定义
在我们进入我们的并排比较敏感和自适应的网页设计，让我们来回顾一下这两种方法的一个高层次的定义。
网站响应有一个流体布局，适应变化，无论屏幕大小使用。媒体查询让敏感的网站，甚至改变“对飞”，如果浏览器大小。
自适应设计中采用基于预先确定的固定大小的断点提供最适当的布局版本的屏幕尺寸时检测到的页面第一次加载。
在这些宽泛的定义，让我们把我们的重点关注领域。

易开发
最显着的差异响应和自适应网页设计，这些解决方案被应用到一个网站的方法。因为响应式设计创造了一个完全的流体布局，最好用在你那里的项目重新设计的网站，从地上爬起来。

试图改造一个现有的网站的代码的反应往往是一个折磨人的事情因为你根本没有，你会如果你开发代码从无到有，以响应的设计考虑到这一过程的早期阶段有控制的水平。这意味着当你改造网站是有求必应，你不得不为了保持在现有代码库做出妥协。

如果你是一个现有的固定宽度的网站，一个自适应的方法意味着你可以离开大小，站点的设计和添加额外的完整需要自适应的断点。在某些情况下，如果一个项目的预算是小的，如果它只能容纳少量的开发工作，你可以选择只为更小的屏幕大小/移动为中心添加新的自适应断点。这意味着你将允许更大的屏幕都使用相同的布局-也许一个断点960版本是什么，可能是最初设计的网站。

上行自适应的方法是，你可以更好地利用现有网站的代码，但一个缺点是，你的每个断点你选择支持创建不同的布局模板。这将需要开发和维护这一解决方案在长期的工作量的影响。

设计控制

一个网站的响应的长处在于它们的流动性使它们适应和支持所有的屏幕尺寸相对于只有预先设置的断点在自适应方法确定。然而现实，是响应网站看起来伟大在某些关键的屏幕尺寸（一般尺寸符合流行的设备在市场上可用的），但视觉设计往往打破了那些流行的决心之间。

例如，一个网站可能看起来伟大在1400像素的宽屏幕布局，960像素中的屏幕尺寸，以及小屏幕看480像素，但对于在这些大小州之间的？作为一个设计师，你将没法控制这些尺寸，这些尺寸的页面视觉效果往往不太理想之间。

自适应网站，你有更多的设计在不同的版面被使用因为它们是基于你建立的断点固定尺寸控制。那些尴尬的各州之间是不成问题的任何更长的时间因为你精心设计的每一个“看”（即每个断点的显示），将提供给游客。

作为这一级别的设计控制的吸引力可能声音，你必须意识到它是有代价的。是的，你必须在每个断点神色的完全控制，但这就意味着你必须投资要求每个人独特的布局设计时间。更多的断点，你选择的设计，更多的时候你需要花上 过程。

广泛的支持

响应和自适应网站设计欣赏漂亮的强大的支持，尤其是在现代浏览器。

自适应网站需要的服务器端组件或JavaScript的屏幕尺寸检测。显然，如果自适应站点需要JavaScript，它意味着一个浏览器需要有该网站的正常工作，使。这可能不是一个主要关注你因为大多数人会在他们的浏览器的JavaScript，但任何时候一个网站有什么关键的依赖，应该注意。

响应式网站和媒体查询，他们的权力将在所有现代浏览器的工作。唯一的问题是你会最早版本的IE自从版本8及以下的不支持媒体查询。在这个工作一个JavaScript polyfill是经常使用的，，这意味着有一个依赖于JavaScript的这里，至少对那些过时的版本的IE浏览器，这可能不是很关心你，特别是如果你的网站分析表明你不使用这些老版本的浏览器收到许多游客。

未来的友好

响应网站的流体性质，让他们在自适应网站的优势，当谈到未来的友好。这是因为那些敏感的部位不是用来容纳只有先前建立的设置断点。他们适应所有屏幕，包括那些不可能真的在今天的市场。这意味着响应的网站将不需要“固定”如果一个新的屏幕分辨率突然变得流行。

在装置的景观令人难以置信的品种（截至8月2015，有超过24000个不同的Android设备市场上，有一个网站）不适应这种大范围的屏幕未来的友好是非常重要的。这是因为，景观是不太可能在未来获得更多元化，这意味着特定的屏幕大小设计将成为可能，如果我们尚未达到现实。

在这个对比场景的另一面，如果一个网站是自适应的，它不适应新的决议，可能会成为市场的重要，那么你可能被迫添加断点到你的网站了。这增加了设计开发的时间到项目，这意味着那些自适应网站必须持续监控以确保没有新的断点已被引入市场，必须添加到网站。再次，与设备的多样性是什么，要不断检查新的大小和可能的适应他们新的断点是一个持续的挑战，会影响你的工作必须支持网站为公司或组织，维护的成本为他们的网站是。

性能

响应网页设计一直被指责（在许多情况下是不公平的，是一个贫穷的解决方案）下载速度/性能的角度来看。这主要是由于这种方法的早期，许多网页设计师只是在小屏幕媒体查询到一个网站的现有的CSS。这迫使大屏幕将所有器械的图片资源，即使那些较小的屏幕，没有使用他们的最终布局。响应式设计现在的和现实的走过了漫长的道路，质量可靠的网站今天不遭受性能问题。

下载速度慢和臃肿的网站是不是一个敏感的网站问题-这是一个问题，可以在所有的网站找到。太大的图像，从社会媒体供稿，过度的脚本和更重的网站，但响应和自适应网站可以建立能快速加载。当然， 他们可在不使绩效优先，但这不是一个特点的解决方案本身，而是反映了团队参与开发的网站本身。

除了布局        

一种自适应的网页设计中最引人注目的方面是，你不仅在设置断点设计网站的控制，而且已经交付这些网站版本资源。例如，这意味着视网膜图像可以只发送给视网膜设备，而非视网膜屏获得更合适的图像这是更小的文件大小。其他网站的资源（JavaScript文件，CSS样式，等等）可以灵活地交付只有当他们需要时，将使用。

使用自适应网页设计远远超出了简单的方程，“如果你正在更新网站，自适应可能是一个更简单的方式。”所有的网站，包括完整的重新设计，可以从一个更聪明的方法有利于更有针对性的经验。

这种情况表明微妙的性质这一“响应与适应”的争论。诚然，一个自适应的方法可能更适合于敏感部位的改造，它也可以是一个伟大的解决方案，完全重新设计。同样的，在某些情况下，一个积极的方法，可以添加到现有网站的代码库，让现场的充分响应方法的所有好处。

哪种方法更好？

说到响应和自适应网页设计，没有明确的“赢家”，虽然反应肯定是更受欢迎的方法。事实上，“更好”的方法依赖于一个特定的项目需求。此外，这并不是一个“非此即彼”的情况。有许多网络专业人员谁是建筑工地，结合最好的响应式网页设计（流体的宽度，未来支持）和自适应设计的优势（网站资源更好的设计控制，智能加载）。

俗称RESS（与服务器端组件的响应式网页设计），这种做法表明，真的是没有“一刀切的解决方案。“响应式网页设计和适应性都有各自的优点和挑战，所以你需要确定哪一个更适合你的特定的项目，或者一个混合的解决方案可能适合你。

牧羊人设计文章推荐：

网页设计师如何找到客户

网页制作中移动文字6个规则

如何完善你的网站收益

网页设计师提高个人品牌