響應(yīng)式網(wǎng)站就是：設(shè)計(jì)的頁面會(huì)根據(jù)用的的行為以及設(shè)備的環(huán)境(系統(tǒng)平臺(tái)、屏幕尺寸、屏幕定向等)進(jìn)行相應(yīng)的響應(yīng)和調(diào)整。
具體的實(shí)踐方式由多方面組成，包括彈性網(wǎng)格和布局、圖片、CSS media query的使用等。無論用戶正在使用筆記本還是iPad，我們的頁面都應(yīng)該能夠自動(dòng)切換分辨率、圖片尺寸及相關(guān)腳本功能等，以適應(yīng)不同設(shè)備；換句話說，頁面應(yīng)該有能力去自動(dòng)響應(yīng)用戶的設(shè)備環(huán)境。響應(yīng)式網(wǎng)頁設(shè)計(jì)就是一個(gè)網(wǎng)站能夠兼容多個(gè)終端——而不是為每個(gè)終端做一個(gè)特定的版本。
優(yōu)點(diǎn)：
1、用戶體驗(yàn)友好
隨著電腦尺寸多元化，智能設(shè)備（pad/智能手機(jī)）普及化，在當(dāng)下追求用戶體驗(yàn)至上的時(shí)代，之前網(wǎng)站普遍使用固定的寬度（960px）逐漸滿足不了現(xiàn)在不同設(shè)備與不同分辨率需求。在高分辨率電腦寬屏顯示器上，兩邊留白過多。在手機(jī)上顯示，內(nèi)容顯示過小，用戶為了看清楚，首先需要放大界面，再左右拖拖界面。響應(yīng)式網(wǎng)站可以根據(jù)不同終端、不同尺寸和不同應(yīng)用環(huán)境，自動(dòng)調(diào)整界面布局、展示內(nèi)容、內(nèi)容大小，提供非常好視覺展示效果，一致性友好體驗(yàn)。
2、節(jié)省設(shè)計(jì)與開發(fā)時(shí)間
從設(shè)計(jì)角度說，一般來說，響應(yīng)式網(wǎng)站界面只需要設(shè)計(jì)兩套設(shè)計(jì)效果圖就行了，電腦端與pad端基本可以共用一套設(shè)計(jì)效果圖，手機(jī)端重新設(shè)計(jì)一套就可以了；從前端開發(fā)角度說，再不需要開發(fā)三套完成不一樣的前端代碼，只需要根據(jù)臨界點(diǎn)（如果是基于Bootstrap前端框架進(jìn)行開發(fā)，它上面有明確說明，這個(gè)問題下回再和大家分享）為不同終端開發(fā)三套不同的css樣式；從后期維護(hù)角度來說，再不需要分別維護(hù)pc界面、pad界面、移動(dòng)界面，專心維護(hù)一個(gè)網(wǎng)站即可。
3、SEO友好
由于響應(yīng)網(wǎng)站在不同終端有友好的界面展示效果，用戶可以與網(wǎng)站一直保持聯(lián)系，比如URL不變積累分享；通過單一的URL地址收集所有的社交分享鏈接最佳化搜索用引擎。搜索引擎也在變得越來越聰明，它們足夠智能可以完成移動(dòng)網(wǎng)站和桌面網(wǎng)站的連接。
Google也建議優(yōu)先采用響應(yīng)式設(shè)計(jì)，因?yàn)闊o論是什么網(wǎng)頁版本都是相同的HTML、相同的內(nèi)容，百度與谷歌更容易處理。
4、可以適應(yīng)所有設(shè)備屏幕
這點(diǎn)可以說是響應(yīng)式的網(wǎng)站最大的優(yōu)勢(shì)，在如今技術(shù)日新月異，智能終端不斷更新?lián)Q代，智能手機(jī)、VR設(shè)備、智能手表等等層出不窮，不可能一個(gè)個(gè)進(jìn)行獨(dú)立開發(fā)，但是如果擁有了響應(yīng)式的網(wǎng)站設(shè)計(jì)則不同，用戶可以一直和網(wǎng)站保持聯(lián)系，而且它對(duì)用戶非常用好。
5、維護(hù)更少
想一下如果再去開發(fā)一新的獨(dú)立移動(dòng)站，無疑會(huì)增加你的工作負(fù)擔(dān)，實(shí)際上你擁有的是兩個(gè)站，但是如果響應(yīng)式網(wǎng)站維護(hù)成本肯定會(huì)很少，因?yàn)樗皇且粋�(gè)站，而且可以在所有設(shè)備上都運(yùn)行，明顯減少了工作量。