Paste_Image.png
自適應設計和響應式設計網頁都是由于現在互聯訪問設備有著眾多不通的分辨率,手機,pad,筆記本,PC,大大小小,形形色色。這兩者都是為了適配不同分辨率的設備訪問的一種網頁設計技術。
響應式設計是采用 CSS 的 media query 技術,配合流體布局( fluid grids )和同樣可以自適應的圖片/視頻等資源素材。以上所說,都是通過 HTML 和 CSS 就能完成的。一般來說,RWD 傾向于只改變元素的外觀布局,而不大幅度改變內容。可以把 RWD 定義為一切能用來為各種分辨率和設備性能優化視覺體驗的技術吧。
自適應設計在包括 RWD 的 CSS media query 技術以外,也要用 Javascript 來操作 HTML 來更適應移動設備的能力。有可能會針對移動端用戶減去內容,減去功能。也 可以在服務器端就進行優化,把優化過的內容送到終端上。 通常會牽扯到另外一個詞 “progressive enhancement” 。
progressive enhancement:從針對最低端的,最低分辨率的設備的設計做起,逐步逐步為更高階的設備增加功能和效果的做法。(換個角度說,也就是相當于為移動設備減去功能)
參考資料:
http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html
http://geekplux.com/grid/
https://www.zhihu.com/question/20628050?rf=24334181