响应式网页设计：互联网web产品RWD概念

　　RWD（Responsive Web Design）可称为自适应网页设计、响应式网页设计、响应式网页设计等等，是一种可让网页的内容能够随着不一样的装置的宽度来调整画面呈现的技术，让使用者能够不须要透过缩放的方式来浏览网页，大大的提高画面的可浏览性及使用界面的亲和度；然而这对于行动商务愈来愈受到重视的现今来讲，随之也愈来愈倍受重视。

　　近几年，随着行动装置（智慧型手机、平板）的普及，以及行动上网服务的使用率愈来愈高，传统网页的标准已经没法符合这些装置的需求来呈现了，尤为是以flash制做的动画，受限于行动装置运算力不足的限制之下，已经没有行动装置能够直接浏览flash制做的网页了。虽然可透过一些特殊的浏器APP软件来观看，但方便性却大大的下降。

　　而RWD又是如何达到的呢？

　　主要是以HTML5的标准及CSS3中的media queries来达到的。

　　在HTML5的标准中，咱们能够指定页面的宽度能够依照装置的检视宽度来呈现，再利用CSS3的media queries来设定不一样宽度下使用不一样的CSS来呈现页面。所以设计师在设计网页时，就必需要针对不一样的宽度下的画面编写不一样的CSS档案供浏览器来读取。

　　RWD的优势：

　　1.可以使用同一套原始码来撰写CSS，能够减小版面从新制做的时间。

　　2.可同时针对不一样的分辨率来设定，增长页面的可用性。

　　3.对于搜寻引擎的收录不会形成影响，不影响SEO的结果。

　　4.开发时间较APP来讲能够快速不少。

　　5.学习门坎较低，对于已经从事网页设计的人员来讲，此技术只是建构在本来的DIV+CSS之上的一门技术，所以学习起来相对容易。

　　RWD的缺点：

　　1.由于在同一页面会置入多种分辨率的CSS档案会增长页面传输量，加载的时间也会加长。

　　2.若在各类分辨率下的画面都需校槁的话，在制做版面的时间会大大的增长。

　　3.没法提供像APP般功能强大的功能，或是各类酷炫的拖拉效果。

　　4.开发时程较传统网页需相对多的时间。

　　以上提供RWD的各项优缺点分析。

　　最后，想要能够体验RWD的功能前，还有一项最重要的基本要素，那就是浏览的支持度。因为RWD是创建在CSS3的基础之下，所以要支持RWD也必需要支持CSS3的浏览器才行，如下列出各大浏览器支持的版本：

　　?Internet Explore 9以上

　　?Chrome、Firefox、Opera使用自动更新至最新版本便可

　　虽然还有些人撰写了JS来让IE8如下的版原本支持CSS3等语法，但目前仍是支持度不佳，且IE8的使用者还在不断的减小中，所以使用新的浏览器才是真正体验RWD的最好办法。

　　本篇文章由程序员客栈（www.proginn.com）整理简单的介绍了RWD的基本观念，并分析其优缺点，让有意使用RWD的人们对于此技术有更多的了解。