更深了解RWD(自习气网页设计)

阅读  ·  发布日期 2020-05-30 15:31  ·  admin



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是建立在的基础之下,因此要支援RWD也有必要要支援CSS3的阅读器才行,以下列出各大阅读器支援的版本:

Inter Explore 9以上

Chrome、Firefox、Opera 使用主动更新至最新版本即可

虽然还有些人撰写了JS来让IE8以下的版本来支援CSS3等语法,但现在仍是支援度欠安,且IE8的使用者还在不断的减少中,因此使用新的阅读器才是真正体验RWD的最好方法。



» » 转载请注明出处,谢谢。
您需要我们为您提供网站建设效劳吗?

我们将在24小时之内与您取得联络
或致电 咨询