響應(yīng)式：只需開發(fā)一套界面。

1.自適應(yīng)：

　　通過檢測視口分辨率，來判斷當(dāng)前訪問的設(shè)備是：pc端、平板、手機，從而請求服務(wù)層，返回不同的頁面；響應(yīng)式設(shè)計通過檢測視口分辨率，針對不同客戶端在客戶端做代碼處理，來展現(xiàn)不同的布局和內(nèi)容。

2.響應(yīng)式：

　　對頁面做的屏幕適配是在一定范圍：比如pc端（>1024）一套適配,平板（768-1024）一套適配，手機端（<768）一套適配;響應(yīng)式一套頁面全部適配。（可以想象：響應(yīng)式設(shè)計要考慮的內(nèi)容要比自適應(yīng)設(shè)計復(fù)雜的多）

　　

響應(yīng)式設(shè)計（RWD）：建立一個網(wǎng)頁，通過CSS Media Query，Content - Based Breakpoint等技術(shù)來改變網(wǎng)頁的大小適應(yīng)不同分辨率的屏幕。
自適應(yīng)設(shè)計（AWD）：為不同類別的設(shè)備建立不同的網(wǎng)頁，檢測到設(shè)備分辨率大小后調(diào)用相應(yīng)的網(wǎng)頁。

1.概念上的區(qū)別

響應(yīng)式就是指網(wǎng)站頁面大小改變顯示不同的布局，就是一個html網(wǎng)站能夠兼容很多版本的手機和電腦等終端。

 

自適應(yīng)布局是指通過JS及CSS的控制，借助rem、百分比等相對度量單位，在不同大小的設(shè)備上呈現(xiàn)相同的網(wǎng)頁。特點就是在不同的屏幕大小下設(shè)置不同的布局格式。

 

2.工作原理的區(qū)別

響應(yīng)式設(shè)計通過檢測視口分辨率，針對不同客戶端在客戶端做代碼處理，來展現(xiàn)不同的布局和內(nèi)容。

 

自適應(yīng)設(shè)計通過檢測視口分辨率，來判斷當(dāng)前訪問的設(shè)備是：pc端、平板、手機，從而請求服務(wù)層，返回不同的頁面。

 

3.頁面設(shè)計的區(qū)別

響應(yīng)式可實現(xiàn)一套頁面全部適配；而自適應(yīng)對頁面做的屏幕適配是在一定范圍：比如pc端（>1024）一套適配,平板（768-1024）一套適配，手機端（<768）一套適配。由此可見，響應(yīng)式設(shè)計要考慮的內(nèi)容要比自適應(yīng)設(shè)計復(fù)雜的多。

 

4.使用不同設(shè)備瀏覽效果的區(qū)別

響應(yīng)式網(wǎng)站是使用不同的設(shè)備瀏覽網(wǎng)站時，網(wǎng)站樣式風(fēng)格、內(nèi)容和網(wǎng)址都是完全一樣的，PC端和移動端屬于同一個網(wǎng)站模板，數(shù)據(jù)庫完全一致。

 

自適應(yīng)網(wǎng)站是使用不同設(shè)備瀏覽時呈現(xiàn)不同的網(wǎng)頁，網(wǎng)頁內(nèi)容及版式風(fēng)格或相似或完全不同，和PC端屬于不同的網(wǎng)站模板，數(shù)據(jù)庫內(nèi)容或相同一致，或獨立不同，目的在于為了符合訪客的瀏覽。

 

響應(yīng)式和自適應(yīng)都有哪些優(yōu)缺點

1.響應(yīng)式的優(yōu)缺點

 

優(yōu)點：響應(yīng)式網(wǎng)站更加方便瀏覽，能夠增加訪客的體驗度，無需再單獨設(shè)計制作手機站，PC站即是手機站，對于優(yōu)化來講，權(quán)重不分散，更加符合搜索引擎的規(guī)則。

 

缺點：響應(yīng)式網(wǎng)設(shè)計往往風(fēng)格有些局限，對于復(fù)雜的框架結(jié)構(gòu)難以實現(xiàn)。

 

2.自適應(yīng)的優(yōu)缺點

 

優(yōu)點：自適應(yīng)網(wǎng)站可以獨立設(shè)計，做任何自己想要的風(fēng)格，還可以做到數(shù)據(jù)庫同步，設(shè)計方案靈活，可獨立優(yōu)化符合搜索引擎的規(guī)則。

 

缺點：自適應(yīng)網(wǎng)站的手機站，有時無法做到與PC站內(nèi)容完全一致，且工作量大。此外，自適應(yīng)手機站往往使用不同的子域名或目錄跳轉(zhuǎn)，對于優(yōu)化來講權(quán)重分散，訪客瀏覽體驗仍有缺陷。