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

RWD（Responsive Web Design）可称为自顺应网页设计、响应式网页设计、响应式网页设计等等，是一种可以让网页的内容可以随着差别的装置的宽度来调整画面出现的手艺，让使用者可以不需要透过缩放的方式来浏览网页，大大的提升画面的可浏览性及使用界面的亲和度；然而这对于行动商务越来越受到重视的现今来说，随之也越来越倍受重视。

近几年，随着行动装置（智慧型手机、沈阳APP软件

平板）的普及，以及行动上网服务的使用率越来越高，传统网页的尺度已经无法切合这些装置的需求来出现了，尤其是以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.hvihi.com）整理简朴的先容了RWD的基本看法，并剖析其优弱点，让有意使用RWD的人们对于此手艺有更多的相识。