比较两种不同的多设备网页设计方法
响应性和自适应网页设计都是创建多种设备友好的网站的方法，这些网站可以在各种屏幕尺寸上很好地工作。 虽然响应式网页设计是由Google推荐的，并且是两种方法中较为流行的方法，但这些用于多设备网页设计的方法都有其优点和缺点。
让我们来看看响应式和自适应网页设计之间的差异，特别关注这些关键领域：
- 易于开发
- 您对设计的控制程度
- 设备/屏幕支持的广度
- 解决方案未来友好如何
- 总体下载速度和网站性能
一些定义
在我们对响应式和自适应网页设计进行并排比较之前，让我们花点时间看看这两种方法的高级定义。
无论使用的屏幕大小如何，响应式网站都有一个流畅的布局，可以进行更改和调整。 如果浏览器调整大小， 媒体查询允许响应式网站甚至“即时”更改。
自适应设计使用基于预先确定的断点的固定尺寸来为页面第一次加载时检测到的屏幕尺寸提供最合适的版面版本。
有了这些广泛的定义，让我们转向我们关注的重点领域。
发展的便利
响应式和自适应式网页设计之间最显着的区别在于这些解决方案适用于网站。 由于响应式设计会创建完全流畅的布局，因此最适合用于从头开始重新设计网站的项目。 试图改进现有网站的代码以提高响应速度通常是一件棘手的事情，因为如果您从头开始编写代码并在该过程的最早阶段考虑响应式设计，那么您根本没有控制级别。 这意味着，当您对网站进行改造以响应时，您必须做出妥协才能保留在现有的代码库中。
如果您正在使用现有的固定宽度网站，则适应性方法意味着您可以保留网站的完整设计大小，并根据需要添加其他自适应断点。 在某些情况下，如果一个项目的预算很小，并且它只能适应少量的开发工作，那么您可以选择仅为小屏幕/以移动为中心的大小添加新的自适应断点。 这意味着你会允许更大的屏幕都使用相同的布局 - 可能是960断点版本，这是该网站最初设计的版本。
自适应方法的优点是您可以更好地利用现有网站的代码，但其中一个缺点是您要为您选择支持的每个断点创建不同的布局模板。 这将对长期开发和维护此解决方案所需的工作量产生影响。
设计控制
响应式网站的优势之一是它们的流畅性使其能够适应并支持所有屏幕尺寸，而不是仅适应性方法中确定的预设断点。 然而，现实情况是，响应式网站可能在某些关键屏幕尺寸（通常与市场上流行的设备相对应的尺寸）方面看起来不错，但视觉设计往往在这些流行的分辨率之间出现中断。
例如，一个网站在1400像素的宽屏幕布局，960像素的中等屏幕尺寸和480像素的小屏幕时可能看起来很棒，但这些尺寸的中间状态又如何呢？ 作为一名设计师，你几乎无法控制这些中间尺寸，而这些尺寸的页面视觉效果往往不尽如人意。
通过自适应网站，您可以对使用的各种布局进行更多的设计控制，因为它们是基于您建立的断点的固定大小。 那些尴尬的中间状态不再是问题，因为你仔细设计了每个“外观”（意思是每个断点的显示），这些外观将被传递给访问者。
尽管这种级别的设计控制听起来很有吸引力，但您必须意识到它的价格。 是的，您可以完全控制每个断点的外观，但这意味着您必须投入设计时间来为每个独特布局进行设计。 您选择设计的断点越多，您需要花费的时间就越多。
支持的广度
响应式和自适应网页设计都享有非常强大的支持，特别是在现代浏览器中。
自适应网站需要服务器端组件或Javascript来进行屏幕大小检测。 显然，如果一个自适应网站需要Javascript，这意味着浏览器需要启用它才能使该网站正常工作。 这可能不是你主要关心的问题，因为大多数人在他们的浏览器中都会使用Javascript，但是任何时候一个站点对任何事物都有严格的依赖性，应该注意。
响应式网站和支持它们的媒体查询在所有现代浏览器中都能很好地工作。 自8版及更低版本以来，唯一的问题是使用最旧版本的Internet Explorer，因为它们不支持媒体查询 。 为了解决这个问题，经常使用Javascript polyfill ，这意味着在这里也存在对Javascript的依赖，至少对于那些过时的IE版本。 再说一次，这可能不是您关心的问题，特别是如果您的网站分析显示您没有收到许多使用这些旧浏览器版本的访问者。
未来友善
响应式网站的流畅性使其在适应性网站方面具有优势，在涉及未来友好性时更具优势。 这是因为这些响应站点不是为了仅适应先前建立的一组断点而构建的。 他们适应所有屏幕 ，包括那些今天可能实际上不在市场上的屏幕 。 这意味着如果新的屏幕分辨率突然流行，那么响应式网站将不需要“固定”。
考虑到设备领域令人难以置信的多样性（截至2015年8月，市场上有超过24,000种不同的Android设备），拥有一个能够适应这种广泛屏幕的网站对于未来友好性至关重要。 这是因为未来景观不可能变得更加多样化，这意味着如果我们还没有达到这种现实，那么针对特定屏幕或尺寸的设计将变得不可能。
在这种比较方案的另一方面，如果一个网站具有适应性，并且不适应可能在市场上变得重要的新决议，那么您可能会被迫将该断点添加到您创建的网站上。 这增加了项目的设计和开发时间，这意味着必须持续监控那些适应性网站，以确保没有新的断点被引入到必须添加到网站上的市场中。 同样，随着设备多样性的不断变化，必须不断检查新的尺寸，并可能为它们提供新的断点，这是一个持续的挑战，它将对您必须支持的网站以及维护的成本产生影响该网站所针对的公司或组织。
性能
从下载速度/性能角度来看，响应式网页设计长期以来一直被认为是一个糟糕的解决方案（在许多情况下是不公平的）。 这主要是因为在这种方法的早期阶段，许多网页设计师只是将小屏幕媒体查询加入到网站现有的CSS中。 这就强制将用于较大屏幕的图像和资源传送到所有设备，即使这些较小的屏幕在最终布局中并未使用它们。 自那时起，响应式设计已经走过了很长的一段路，现实情况是，质量响应型网站今天不会遇到性能问题。
下载速度慢，网站臃肿不是一个敏感的网站问题 - 这是一个可以在所有网站上找到的问题。 过于沉重的图像，来自社交媒体，过多的脚本和更多的内容，以及网站的权重，但响应式和自适应网站都可以构建为快速加载。 当然，它们的构建方式也不会使性能成为重中之重，但这不是解决方案本身的特点，而是对参与网站开发的团队的反映。
超越布局
自适应网页设计最引人注目的方面之一是，您不仅可以控制设置断点的网站设计，还可以控制为这些网站版本提供的资源。 例如，这意味着视网膜图像只能发送到视网膜设备，而非视网膜屏幕可以获得更小的文件尺寸的更合适的图像 。 其他网站资源（Javascript文件，CSS样式等）只有在需要时才能巧妙地提供并将被使用。
这种自适应网页设计的使用远远超出了“如果您正在改造网站，自适应可能是更简单的使用方式”的简单等式。“所有网站，包括完整的重新设计，都可以从更智能的方法中受益，从而获得更加个性化的体验。
这种情况表明了这种“响应与适应”辩论的细微差别。 虽然自适应方法可能比现场改造更适合，但它也可以成为全面重新设计的绝佳解决方案。 同样，在某些情况下，可以将响应方法添加到现有网站的代码库中，从而为该网站提供完全响应方法的所有好处。
哪种方法更好？
当谈到响应式与自适应式网页设计时，没有明确的“赢家”，尽管响应式肯定是更受欢迎的方法。 事实上，“更好”的方法取决于具体项目的需求。 此外，这并不需要是“任何/或”的情况。 有许多网站专业人士正在构建将最佳响应式网页设计（流体宽度，未来支持）与自适应设计（更好的设计控制，智能加载站点资源）的优势相结合的网站。
这种方法通常被称为RESS（具有服务器端组件的响应式网页设计），这表明实际上没有“一刀切”的解决方案。响应式网页设计和自适应都有其优势和挑战，因此您需要确定哪一个将最适合您的特定项目，或者如果混合解决方案实际上最适合您。