响应式Web设计(Responsive Web Design – RWD)一般是指那些使用CSS3 Media Query特性制作站点，其可以适应不同视窗尺寸的布局。
虽然很早就已经有了类似RWD的概念，但直到最近一年里才开始变得特别流行，各种文章、例子、工具、模板，不断地从无到有，诸如：
- 响应式Web设计50个例子和最佳实践
- 21个响应式Web设计工具
- 响应式Web设计的模板和框架
这些资源，仿佛都是一下子冒出来似的…这要归功于IE9的发布，从而使得主流浏览器上升到全部支持Media Query的程度。
然而眼花缭乱的资料堆里，可供细细品读的资料其实也就那么几篇：ETHAN MARCOTTE 的 Responsive Web Design，以及其引用的 JOHN ALLSOPP 的 A Dao of Web Design。
无论是在UX角度还是维护角度，RWD的优势都显而易见。虽然很多移动设备都默认就可以缩放页面，但是RWD就意味着最少的缩放，最少的滚动，最少的用户行为。我们不必要求用户拨动他们的手指来调整页面的舒适度，因为这种舒适度是我们一开始就设计好的。
作为设计师，RWD算得上是一种限制，甚至一些设计的权利已经被前端所剥夺。为了达到良好的自适应效果，很多设计点上不得不做出偏向代码的妥协。所以可能单纯的视觉设计师可能并不喜欢RWD。然而对于前端来说，RWD非常迷人：一处代码，却处处不同。开发人员只要开发维护一个版本，就能使页面在不同的设备里均呈现良好的访问性效果，何乐而不为？
一旦牵着到RWD，就不可避免的使得页面设计本身趋向相似。看看那些RWD的页面就会发现，很容找出他们的共同点：流式的布局、网格化的排布以及相对而言死板的布局。之所以如此，是因为对于RWD而言，流体图片(Fluid Images)和流体网格(Fluid Grids)是必须，完善的RWD视觉设计里必须以它们为限制。
而随着RWD的各种或浅或深的应用，一些非常常见的IE trick的弊端也开始显现。
评论