|
您的位置: 首頁 > 網(wǎng)站資訊 > 更深了解RWD自適應(yīng)網(wǎng)頁設(shè)計(jì) |
更深了解RWD自適應(yīng)網(wǎng)頁設(shè)計(jì)發(fā)布日期:2017/8/24
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)頁,大大的提拔畫面的可欣賞性及使用介面的親和度;然而這對于舉措商務(wù)越來越受到正視的現(xiàn)今來說,隨之也越來越倍受正視。 近幾年,隨著舉措裝配(伶俐型手機(jī)、平板)的普及,以及舉措上網(wǎng)服務(wù)的使用率越來越高,傳統(tǒng)網(wǎng)頁的標(biāo)準(zhǔn)已經(jīng)無法吻合這些裝配的需求來呈現(xiàn)了,尤其是以flash制作的動(dòng)畫,受限于舉措裝配運(yùn)算力不足的限定之下,已經(jī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í),就必須要針對不同的寬度下的畫面編寫不同的CSS檔案供欣賞器來讀取。 RWD的好處: 1. 可使用統(tǒng)一套原始碼來撰寫CSS,可以削減版面重新制作的時(shí)間。 2. 可同時(shí)針對不同的解析度來設(shè)定,增長頁面的可用性。 3. 對于搜尋引擎的收錄不會造成影響,不影響seo的效果。 4. 開發(fā)時(shí)間較APP來說可以快速許多。 5. 學(xué)習(xí)門檻較低,對于已經(jīng)從事網(wǎng)頁設(shè)計(jì)的人員來說,此技術(shù)只是建構(gòu)在本來的DIV+CSS之上的一門技術(shù),因此學(xué)習(xí)起來相對容易。 RWD的瑕玷: 1. 由于在統(tǒng)一頁面會置入多種解析度的CSS檔案會增長頁面?zhèn)鬏斄浚d入的時(shí)間也會加長。 2. 若在各種解析度下的畫面都需校槁的話,在制作版面的時(shí)間會大大的增長。 3. 無法提供像APP般功能壯大的功能,或是各種酷炫的拖沓結(jié)果。 4. 開發(fā)時(shí)程較傳統(tǒng)網(wǎng)頁需相對多的時(shí)間。 以上提供RWD的各項(xiàng)優(yōu)瑕玷分析。 網(wǎng)站關(guān)鍵詞優(yōu)化,想要可以體驗(yàn)RWD的功能前,還有一項(xiàng)緊張的基本要素,那就是欣賞的支援度。因?yàn)镽WD是建立在CSS3的基礎(chǔ)之下,因此要支援RWD也必須要支援CSS3的欣賞器才行,以下列出各大欣賞器支援的版本: Internet Explore 9以上 Chrome、Firefox、Opera 使用主動(dòng)更新至版本即可 雖然還有些人撰寫了JS來讓IE8以下的版原本支援CSS3等語法,但目前照舊支援度不佳,且IE8的使用者還在賡續(xù)的削減中,因此使用新的欣賞器才是真正體驗(yàn)RWD的辦法。
百度關(guān)鍵詞排名 |
其他相關(guān)文章 |
|
|
|
||||||||
Copyright 2012-2025 上海蒙狼網(wǎng)絡(luò)科技有限公司 www.jnjiaoyu.cn All Rights Reserved |