vlambda博客
学习文章列表

响应式网页设计和自适应网页设计是根据开发方式提出来的分类。

1：什么是响应式设计

响应式布局就是通过检测视口分辨率，针对不同的客户端在客户端做代码处理，来展现不同的布局和内容。实现在不同屏幕分辨率的终端上浏览网页的不同展示方式。

通过响应式设计能使网站在手机和平板电脑上有更好的浏览阅读体验。可以智能的跟进用户行为已经使用的设备环境进行相对于的布局。换句话说就是一个网站能够兼容多个终端，而不是为了每一个终端做一个特定的版本。

响应式网站的几个标志：

1、同时适配PC + 平板 + 手机等；

2、标签导航在接近手持终端设备时改变为经典的抽屉式导航；

2：什么是自适应

自适应布局就是自适应布局通过检测视口分辨率，来判断当前访问的设备是：pc端、平板、手机，从而请求服务层，返回不同的页面；

指能忘了使网页自适应的显示在不同大小终端设备上的新网页设计方式及技术，它需要开发多套界面来适应不同的终端。

自适应布局的几个标志：

1、大多只是适配单个终端的主流N个主流视口；

2、当视口大小低于设置的最小视口时，界面会出现显示不全，并且出现横向滑动条；

3、总体框架不变，横线布局的版块太多会有所减少。

综上所述，在开发的时候，要从实际的项目出发。

采用响应式布局：对于内容较少、主要为展示类网站。缩小浏览器就能看到，开发一套网站。（适合企业站）。例如优设，腾讯的ISUX，苹果官网，掘金，神舟顶联www.toplion.com.cn

采用自适应布局：对于内容多，布局较为复杂的情况，管理类的网站采用分开开发的方式。开发多套网站。通过2-3个网站完成适配（大型网站，商城）俩套代码，例如：虎课，京东。缩小时候有一点响应，但是没有适配手机，手机单独开发的。