响应式与自适应的区别

什么是响应式(RWD)
Ethan M. 的文章最早提出 RWD 的概念，现在公认为RWD的起源。他提出的 RWD 是采用 CSS 的 media query 技术，配合流体布局（ fluid grids ）和同样可以自适应的图片/视频等资源素材。说人话的话，就是把一行分为12个格子，PC上显示12个一行，而手机上显示2个或者1个一行。所以一般响应式设计都是先画格子，再放内容。和直接上来就绝对定位的不一样。以上所说的各种，在技术上都是通过 HTML 和 CSS 就能完成的，当然偶尔也会用到一点点JS。但是只要用的不多就好。一般来说，RWD 倾向于只改变元素的外观布局，而不大幅度改变内容。 Jeffrey Z. 总结非常好，把 RWD 定义为一切能用来为各种分辨率和设备性能优化视觉体验的技术吧。（其实等于没总结，人家本来就是这个意思么）简单的概括，服务器不知道来访的设备是什么，所有的设备都是用的同一套逻辑。纯正的RWD非常适合CDN，这个可不是盖的。

什么是自适应(AWD)
Adaptive Design 是 Aaron G. 的一本技术书的标题，时间要比RWD晚一些。他认为 AWD 在包括 RWD 的 CSS media query 技术以外， AWD 有可能会针对移动端用户减去内容，减去功能。AWD 可以在服务器端就进行优化，把优化过的内容送到终端上。意思就是，服务器知道用户是从手机上访问的，所以就发送手机上专用的资源给手机，这样打开会更快些。AWD其实是CDN不友好的，因为CDN不会识别访问设备哦，至少目前还没有一个支持。

用苹果官网来当示例图，理解一下自适应