響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)

響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)

所謂“響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)(Responsive Web Design)”也就是自適應(yīng)，就是可以自動(dòng)識(shí)別屏幕寬度、并做出相應(yīng)調(diào)整的網(wǎng)頁(yè)設(shè)計(jì)。目前這種設(shè)計(jì)已經(jīng)出現(xiàn)在越來(lái)越多的國(guó)內(nèi)網(wǎng)站上，目前Google已經(jīng)明確表明鼓勵(lì)響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)。

(圖一:響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì))

通常在瀏覽網(wǎng)頁(yè)時(shí)，手機(jī)上和電腦上無(wú)法顯示同一個(gè)網(wǎng)頁(yè)，這也導(dǎo)致許多網(wǎng)頁(yè)設(shè)計(jì)會(huì)自動(dòng)轉(zhuǎn)到特定的鏈接上，如上圖所示，無(wú)論在PC端還是移動(dòng)端，網(wǎng)頁(yè)的顯示其實(shí)都是一個(gè)版本，會(huì)隨著屏幕的大小網(wǎng)頁(yè)而改變。

(圖二：響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)例子)

(圖三：迪士尼公司的網(wǎng)頁(yè))

使用自適應(yīng)網(wǎng)頁(yè)設(shè)計(jì)有5個(gè)好處：

1、隨著移動(dòng)設(shè)備越來(lái)越多，可以提升用戶體驗(yàn)。

2、該設(shè)計(jì)沒(méi)有網(wǎng)頁(yè)版本區(qū)分，所以SEO的策略保持一致。

3、可以避免重復(fù)內(nèi)容，專(zhuān)心維護(hù)這一個(gè)網(wǎng)頁(yè)。

4、保持網(wǎng)頁(yè)的原有鏈接。

5、Google也建議優(yōu)先采用響應(yīng)式設(shè)計(jì)，因?yàn)闊o(wú)論是什么網(wǎng)頁(yè)版本都是相同的HTML、相同的內(nèi)容，Google最容易處理。

更多網(wǎng)站建設(shè)資料：