响应式设计与自适应设计有何区别？

Posted 2021-04-30 金猪网络

响应式与自适应有什么不一样？

 

响应式是流布局，它会自动适应屏幕大小，不管是什么设备。响应式使用CSS完成设备判断。这种基于网格的流布局会自动调整网页的高度和宽度来使用不同尺寸的屏幕，并让其现实正确。

 

自适应则采取多个不同的布局设计，多个屏幕的尺寸，使用哪个布局取决于屏幕类型。自适应作品用屏幕尺寸来决定用哪套布局。

如何比较响应式和自适应?

 

响应式网页会是一个更难的选择，因为它需要用CSS和结构来确保网页能再任何大小上现实，让一套布局能在任何屏幕上使用是一件令人生畏的事情。

 

自适应的设计不太灵活，它只能在其预先设计好的屏幕上正常显示，如果市面上出现了一个新的尺寸，你可能就要修改你的设计了，活着干脆重设计一个，响应式网站在这方面更灵活些，自适应的网站会经常需要一些例行公事的维护。

 

我们的设计到底是使用响应式还是自适应呢？

 

在大多数情况下，响应式网站是个安全的选择。无论屏幕大小，它都能有很好的现实性能，而且早起设计的时候也会解约很多时间。

 

但是，最终还是要看内容，如果内容太多，页面信息复杂，建议使用自适应的模式，因为这样设计移动端要考虑的会简单一些，而且更容易做适配。如果内容少，当然首选响应式。市面上也有一些典型的例子，比如“淘宝”，因为首页内容太多，所以只能选择自适应的模式，PC端和移动端的内容差别很大。再如“36kr”他们就是典型的响应式，因为信息架构简单。