
课程咨询: 400-996-5531 / 投诉建议: 400-111-8989
认真做教育 专心促就业
首先,响应式和自适应最为关键的区别是什么呢?
简而言之,响应式就相当于液体,它可以自动适应不同尺寸的屏幕,无论你的设备尺寸多么奇葩。响应式使用CSS media queries的方法,根据目标设备自动改变风格如显示类型,宽度、高度等,这能很好解决不同屏幕尺寸的显示问题。
而自适应设计是基于断点使用静态布局,一旦页面被加载就无法再进行自动适应,自适应会自动检测屏幕的大小来加载适当的工作布局,也就是说,当你要采用自适应设计网站时,你得一个一个设计6种常见的屏幕布局。
1.320
2.480
3.760
4.960
5.1200
6.1600
显然,自适应设计需要做更多的工作,你必须至少设计6种常见的布局。而响应式设计可以更好地适应复杂的媒体设备要求,能很好地解决显示和性能问题。
特别是后者,这几年有着诸多的争议。因为许多网站提供的是完整的桌面模型,即便没有在移动端加载,但也会明显拖慢网站的速度。为了解决这一问题,我们可以用CSS3的media queries解决方案,但会有一些折衷,因为响应式网站无法达到专门的移动网站那样快。
哪种技术更优越?
归根结底,最重要的是要考虑你用户属于哪类群体,不管你采用哪种设计方式,一旦你知道他们的习惯,知道他们更倾向于用什么设备访问该网站,你在设计你的网站时该采用哪种方式,哪种布局,想法自然会涌现出来。
很大程度上还取决你是现有的网站还是一个新项目。响应式设计已成为首选的设计技术和思想,现在有1/8的网站采用响应式设计(虽然这数字不及自适应设计)。响应式设计增长迅猛,几乎已经达到作为独立移动网站的相同水平。
记住这点,如果仅仅是考虑屏幕的兼容问题,可以有把握的说,那响应式设计通常是首选技术。
然而,如果客户和公司存在预算,自适应设计可能是更好的选择。根据Catchpoint进行的一个测试,他们在Wordpress创建两个网站,一个使用标准的WP TwentyFourteen响应式主题,另一个使用一个名为Wiziapp的插件。
插件基于他们访问该网站的设备向用户提供了移动主题,还提供了高级的配置选项,这样就可以进一步简化整个流程。
还应该强调一点,这没有进行任何优化。但这确实表明,响应式网站需要下载桌面所需的东西。如此表明,主题并不能提供很好的性能。
再次强调一下,media queries可以克服这个问题。至于为什么使用响应式设计,上面就是一个很好的例子。然而流行并不代表是最好的。在最好的东西出现之前,我们很难知道我们能做什么,除了学习如何正确的代码规范和实现一个很好网站。
结论:
响应式设计将会保持受欢迎的趋势,这可能是因为我们还没有找到一个更好解决重大维护和适应性要求。自适应设计也还没有灭亡,尽管不太受程序员的待见。有一点是肯定的,我们将会看到一些改进,完善现阶段所出现的问题。替代响应式设计的技术也在不远将来浮出水面。