經(jīng)常有客戶會問響應(yīng)式網(wǎng)站建設(shè)和自適應(yīng)網(wǎng)站會有什么樣的區(qū)別？零度飛易跟大家聊一聊先我們先了解一下什么是響應(yīng)式網(wǎng)站建設(shè)布局和自適應(yīng)布局。

響應(yīng)式網(wǎng)站建設(shè)布局：

      響應(yīng)式網(wǎng)站建設(shè)布局是Ethan Marcotte在2010年5月份提出的一個(gè)概念，簡而言之，就是一個(gè)網(wǎng)站能夠兼容多個(gè)終端——而不是為每個(gè)終端做一個(gè)特定的版本。這個(gè)概念是為解決移動(dòng)互聯(lián)網(wǎng)瀏覽而誕生的。

      響應(yīng)式網(wǎng)站建設(shè)布局可以為不同終端的用戶提供更加舒適的界面和更好的用戶體驗(yàn)，而且隨著目前大屏幕移動(dòng)設(shè)備的普及，用大勢所趨來形容也不為過。隨著越來越多的設(shè)計(jì)師采用這個(gè)技術(shù)，我們不僅

看到很多的創(chuàng)新，還看到了一些成形的模式。

自適應(yīng)布局：

      自適應(yīng)網(wǎng)頁設(shè)計(jì)（Responsive Web Design）指能使網(wǎng)頁自適應(yīng)顯示在不同大小終端設(shè)備上新網(wǎng)頁設(shè)計(jì)方式及技術(shù)。

      隨著智能手機(jī)的普及，越來越多的人使用手機(jī)上網(wǎng)。

     移動(dòng)設(shè)備正超過桌面設(shè)備，成為訪問互聯(lián)網(wǎng)的常見終端。于是，網(wǎng)頁設(shè)計(jì)師不得不面對一個(gè)難題：如何才能在不同大小的設(shè)備上呈現(xiàn)同樣的網(wǎng)頁？

     手機(jī)的屏幕比較小，寬度通常在600像素以下；PC的屏幕寬度，一般都在1000像素以上（目前主流寬度是1366×768），有的還達(dá)到了2000像素。同樣的內(nèi)容，要在大小迥異的屏幕上，都呈現(xiàn)出

滿意的效果，并不是一件容易的事。

      很多網(wǎng)站的解決方法，是為不同的設(shè)備提供不同的網(wǎng)頁，比如專門提供一個(gè)mobile版本，或者iPhone / iPad版本。這樣做固然保證了效果，但是比較麻煩，同時(shí)要維護(hù)好幾個(gè)版本，而且如果一個(gè)網(wǎng)站有多個(gè)portal（入口），會大大增加架構(gòu)設(shè)計(jì)的復(fù)雜度。

     于是，很早就有人設(shè)想，能不能"一次設(shè)計(jì)，普遍適用"，讓同一張網(wǎng)頁自動(dòng)適應(yīng)不同大小的屏幕，根據(jù)屏幕寬度，自動(dòng)調(diào)整布局（layout）。

     那制作網(wǎng)站的時(shí)候“什么樣的網(wǎng)站/項(xiàng)目適合使用自適應(yīng)布局（固定斷點(diǎn)）？什么樣的網(wǎng)站適合響應(yīng)式網(wǎng)站建設(shè)布局？

     理論上來說，響應(yīng)式網(wǎng)站建設(shè)在任何情況下都比自適應(yīng)布局好一些，但在某些情況下自適應(yīng)布局更切實(shí)際。

     自適應(yīng)布局可以讓你的設(shè)計(jì)更加可控，因?yàn)槟阒恍枰紤]了了幾種狀態(tài)就萬事大吉了。但在響應(yīng)式網(wǎng)站建設(shè)布局中你可能需要面對非常多狀態(tài)——是的，大部分狀態(tài)之間的區(qū)別很小，但它們又的確是不同的——這樣一來就很難確切搞清你的設(shè)計(jì)會是什么樣。同時(shí)這也帶來了測試上的難題，你很難有絕對的把握預(yù)測到它會怎樣。換個(gè)角度說，這也是響應(yīng)式網(wǎng)站建設(shè)布局的魅力所在。通過允許表面上的不確定因素存在，你可以獲得更高層次上的確定。雖然你無法在精確到像素級別準(zhǔn)確預(yù)知你的設(shè)計(jì)如何在943px×684px視覺區(qū)域匯中展示，但你能確定的是它們一定能展示的很好——不管是表層特征還是布局結(jié)構(gòu)都有條不紊。

     自適應(yīng)布局有它自己的優(yōu)勢，因?yàn)樗鼈儗?shí)施起來代價(jià)更低，測試更容易，這往往讓他們成為更切實(shí)際的解決方案。自適應(yīng)網(wǎng)站建設(shè)可以看做響應(yīng)式網(wǎng)站建設(shè)布局的“窮兄弟”，在資源有限的情況下就可以讓

它出馬。特別是改進(jìn)現(xiàn)有網(wǎng)站的時(shí)候尤其奏效，因?yàn)槿恐貙懘a在這時(shí)并不可行。這種案例中，采用自適應(yīng)布局是一個(gè)不錯(cuò)的出發(fā)點(diǎn)。

其實(shí)無論是哪種設(shè)計(jì)理念都是各有優(yōu)缺的，還是要從個(gè)人實(shí)際去求出發(fā)去選擇！