Quiz

响应设计与自适应设计有何不同?

Topics
CSS
在GitHub上编辑

响应式设计和自适应设计都试图在不同的设备上优化用户体验,针对不同的视口尺寸、分辨率、使用环境、控制机制等进行调整。

响应式设计以灵活性原则为基础――一个能够在任何设备上看起来都很好的流畅的网站。 响应式网站使用媒体查询、灵活的网格和响应性图片来创造一个基于多种因素的弹性和变化的用户体验。 就像一个球在成长或缩小以适应几个不同的环。

自适应设计更像是渐进式增强的现代定义。 自适应设计不是一个灵活的设计,而是检测设备和其他特征,然后根据一组预定的视口尺寸和其他特征提供适当的特征和布局。 站点检测所使用的设备类型,并为该设备提供预设布局。 你有几个不同尺寸的球,而不是一个球来穿过几个不同尺寸的环,而是有几个不同的球来使用,这取决于环的大小。

这两种方法都有一些需要加以权衡的问题:

  • 响应式设计可能是相当具有挑战性的,因为你基本上是在使用一个尽管是响应式的布局来适应所有情况。 如何设置媒体查询断点就是这样一个挑战。 您是否使用标准化断点值? 或者,您是否使用对您的特定布局有意义的断点? 如果这种布局改变怎么办?
  • 自适应设计通常需要用户代理嗅探,或 DPI 检测等,所有这些都被证明是不可靠的。
在GitHub上编辑