很久很久很久以前，每个人都只有一件衣服（ Website ），不管你有钱没钱大家每天都只穿这一件。
后来有人发明了舞会（移动互联网），大家都争先恐后地想要参加，于是一个做「开发」的裁缝忽悠人们说进舞会最好订做一件专门的礼服（ Mobile Site ），大家想想也对，上班和出去哈皮都穿同一件衣服多无聊啊，舞会就要有舞会的样子。于是乎只要有点闲钱的人都做了礼服，他和原来那件叫做 Website 的衣服是完全不一样的，面子不一样，里子也不一样。
后来舞会的种类越来越多了，很多人被迫做了好多好多件礼服，于是又有一个叫做「前端」的裁缝站出来说你们每年要新做那么多衣服，多费钱啊，而且一出门钥匙啊皮夹子啊名片都要在不同衣服里换来换去多麻烦。你看，我们新发明了一个手艺叫做「Responsive Design」，只要把你原来那件衣服稍微那么一改，以后去哪个舞会都可以只穿这一件衣服，衣服的里子永远都差不多，但面子可以按照要求自适应不同的舞会。
于是所有人都开始换上这种响应式的衣服了。。。
分享
屹峰 ，有空可以来看看我专栏。现在回答少了是因…
起因 因为越来越多的智能移动设备（ mobile, tablet device ）加入到互联网中来，移动互联网不再是独立的小网络了，而是成为了 Internet 的重要组成部分。响应式网络设计 （ RWD / AWD）的出现，目的是为移动设备提供更好的体验，并且整合从桌面到手机的各…
显示全部
起因
因为越来越多的智能移动设备（ mobile, tablet device ）加入到互联网中来，移动互联网不再是独立的小网络了，而是成为了 Internet 的重要组成部分。响应式网络设计 （ RWD / AWD）的出现，目的是为移动设备提供更好的体验，并且整合从桌面到手机的各种屏幕尺寸和分辨率，用技术来使网页适应从小到大（现在到超大）的不同分辨率的屏幕。
设计
RWD：
· 采用 CSS 的 media query 技术
· 流体布局（ fluid grids ）
· 自适应的图片/视频等资源素材
（为小、中、大屏幕做一些优化，目的是让任何尺寸的屏幕空间都能得到充分利用）
AWD：
· CSS media query 技术（仅针对有限几种预设的屏幕尺寸设计）
· 用 Javascript 来操作 HTML 内容
· 在服务器端操作 HTML 内容（比如为移动端减少内容，为桌面端提供更多内容）
设计思路
Mobile First（从移动端开始，RWD ）：
一切从最小屏幕的手机端开始（比如 iPhone 的 320px ），先确定内容，然后逐级往大屏幕设计。
不同于原来网页设计，总是从桌面电脑的 1024px 开始的。
作者：屹峰
链接：http://www.zhihu.com/question/20976405/answer/16781171
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
