两者的区别?
首先,响应式和自适应最为关键的区别是什么呢?
简而言之,响应式(百分比)就相当于液体,它可以自动适应不同尺寸的屏幕,无论你的设备尺寸多么奇葩。响应式使用CSS media queries的方法,根据目标设备自动改变风格如显示类型,宽度、高度等,这能很好解决不同屏幕尺寸的显示问题。
而自适应设计是基于断点使用静态布局,一旦页面被加载就无法再进行自动适应,自适应会自动检测屏幕的大小来加载适当的工作布局,也就是说,当你要采用自适应设计网站时,你得一个一个设计6种常见的屏幕布局。
1.320
2.480
3.760
4.960
5.1200
6.1600.
显然,自适应设计需要做更多的工作,你必须至少设计6种常见的布局。而响应式设计可以更好地适应复杂的媒体设备要求,能很好地解决显示和性能问题。
特别是后者,这几年有着诸多的争议。因为许多网站提供的是完整的桌面模型,即便没有在移动端加载,但也会明显拖慢网站的速度。为了解决这一问题,我们可以用CSS3 的media queries解决方案,但会有一些折衷,因为响应式网站无法达到专门的移动网站那样快。
至于为什么使用响应式设计,上面就是一个很好的例子。然而流行并不代表是最好的。在最好的东西出现之前,我们很难知道我们能做什么,除了学习如何正确的代码规范和实现一个很好网站。
结论:
响应式设计将会保持受欢迎的趋势,这可能是因为我们还没有找到一个更好解决重大维护和适应性要求。自适应设计也还没有灭亡,尽管不太受程序员的待见。有一点是肯定的,我们将会看到一些改进,完善现阶段所出现的问题。替代响应式设计的技术也在不远将来浮出水面。