更深了解RWD(自適應(yīng)網(wǎng)頁設(shè)計(jì))

2019-01-28    分類: 網(wǎng)站建設(shè)

RWD(Responsive Web Design)可稱為自適應(yīng)網(wǎng)頁設(shè)計(jì)、響應(yīng)式網(wǎng)頁設(shè)計(jì)、回應(yīng)式網(wǎng)頁設(shè)計(jì)等等,是一種可以讓網(wǎng)頁的內(nèi)容可以隨著不同的裝置的寬度來調(diào)整畫面呈現(xiàn)的技術(shù),讓使用者可以不需要透過縮放的方式來瀏覽網(wǎng)頁,大大的提升畫面的可瀏覽性及使用介面的親和度;然而這對(duì)于行動(dòng)商務(wù)越來越受到重視的現(xiàn)今來說,隨之也越來越倍受重視。

近幾年,隨著行動(dòng)裝置(智慧型手機(jī)、平板)的普及,以及行動(dòng)上網(wǎng)服務(wù)的使用率越來越高,傳統(tǒng)網(wǎng)頁的標(biāo)準(zhǔn)已經(jīng)無法符合這些裝置的需求來呈現(xiàn)了,尤其是以flash制作的動(dòng)畫,受限于行動(dòng)裝置運(yùn)算力不足的限制之下,已經(jīng)沒有行動(dòng)裝置可以直接瀏覽flash制作的網(wǎng)頁了。雖然可透過一些特殊的瀏器APP軟體來觀看,但方便性卻大大的降低。

而RWD又是如何達(dá)到的呢? 主要是以HTML5的標(biāo)準(zhǔn)及CSS3中的media queries來達(dá)到的。

在HTML5的標(biāo)準(zhǔn)中,我們可以指定頁面的寬度可以依照裝置的檢視寬度來呈現(xiàn),再利用CSS3的media queries 來設(shè)定不同寬度下使用不同的CSS來呈現(xiàn)頁面。因此設(shè)計(jì)師在設(shè)計(jì)網(wǎng)頁時(shí),就必須要針對(duì)不同的寬度下的畫面編寫不同的CSS檔案供瀏覽器來讀取。

RWD的優(yōu)點(diǎn):

1. 可使用同一套原始碼來撰寫CSS,可以減少版面重新制作的時(shí)間。

2. 可同時(shí)針對(duì)不同的解析度來設(shè)定,增加頁面的可用性。

3. 對(duì)于搜尋引擎的收錄不會(huì)造成影響,不影響SEO的結(jié)果。

4. 開發(fā)時(shí)間較APP來說可以快速很多。

5. 學(xué)習(xí)門檻較低,對(duì)于已經(jīng)從事網(wǎng)頁設(shè)計(jì)的人員來說,此技術(shù)只是建構(gòu)在原本的DIV+CSS之上的一門技術(shù),因此學(xué)習(xí)起來相對(duì)容易。

RWD的缺點(diǎn):

1. 因?yàn)樵谕豁撁鏁?huì)置入多種解析度的CSS檔案會(huì)增加頁面?zhèn)鬏斄?,載入的時(shí)間也會(huì)加長(zhǎng)。

2. 若在各種解析度下的畫面都需校槁的話,在制作版面的時(shí)間會(huì)大大的增加。

3. 無法提供像APP般功能強(qiáng)大的功能,或是各種酷炫的拖拉效果。

4. 開發(fā)時(shí)程較傳統(tǒng)網(wǎng)頁需相對(duì)多的時(shí)間。

以上提供RWD的各項(xiàng)優(yōu)缺點(diǎn)分析。

最后,想要可以體驗(yàn)RWD的功能前,還有一項(xiàng)最重要的基本要素,那就是瀏覽的支援度。由于RWD是建立在CSS3的基礎(chǔ)之下,因此要支援RWD也必須要支援CSS3的瀏覽器才行,以下列出各大瀏覽器支援的版本:

Internet Explore 9以上

Chrome、Firefox、Opera 使用自動(dòng)更新至最新版本即可

雖然還有些人撰寫了JS來讓IE8以下的版本來支援CSS3等語法,但目前還是支援度不佳,且IE8的使用者還在不斷的減少中,因此使用新的瀏覽器才是真正體驗(yàn)RWD的最好辦法。

標(biāo)題名稱:更深了解RWD(自適應(yīng)網(wǎng)頁設(shè)計(jì))
鏈接URL:http://www.muchs.cn/news42/79092.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供Google小程序開發(fā)、網(wǎng)站營銷、App設(shè)計(jì)、做網(wǎng)站、網(wǎng)站建設(shè)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

成都網(wǎng)頁設(shè)計(jì)公司