响应式与自适应设计

两者的区别？

首先，响应式和自适应最为关键的区别是什么呢？

简而言之，响应式（百分比）就相当于液体，它可以自动适应不同尺寸的屏幕，无论你的设备尺寸多么奇葩。响应式使用CSS media queries的方法，根据目标设备自动改变风格如显示类型,宽度、高度等，这能很好解决不同屏幕尺寸的显示问题。

而自适应设计是基于断点使用静态布局，一旦页面被加载就无法再进行自动适应，自适应会自动检测屏幕的大小来加载适当的工作布局，也就是说，当你要采用自适应设计网站时，你得一个一个设计6种常见的屏幕布局。

1.320
2.480
3.760
4.960
5.1200
6.1600.

显然，自适应设计需要做更多的工作，你必须至少设计6种常见的布局。而响应式设计可以更好地适应复杂的媒体设备要求，能很好地解决显示和性能问题。

特别是后者，这几年有着诸多的争议。因为许多网站提供的是完整的桌面模型，即便没有在移动端加载，但也会明显拖慢网站的速度。为了解决这一问题，我们可以用CSS3
的media queries解决方案，但会有一些折衷，因为响应式网站无法达到专门的移动网站那样快。

至于为什么使用响应式设计，上面就是一个很好的例子。然而流行并不代表是最好的。在最好的东西出现之前，我们很难知道我们能做什么，除了学习如何正确的代码规范和实现一个很好网站。

结论：

响应式设计将会保持受欢迎的趋势，这可能是因为我们还没有找到一个更好解决重大维护和适应性要求。自适应设计也还没有灭亡，尽管不太受程序员的待见。有一点是肯定的，我们将会看到一些改进，完善现阶段所出现的问题。替代响应式设计的技术也在不远将来浮出水面。