響應式web設計的最佳化

標籤：

在響應式網頁的設計過程中，其中也會涉及到一些使用者體驗方面的問題和弊端，需要進一步的最佳化。

 (1)減輕Javascript庫負載

對於移動端來說，jQuery表現的太過厚重，而現在針對移動端的狀態來說，有jQuery Mobile、YUI、XUI等可供選擇的架構。

 

（2）減少HTTP請求次數

移動端相比較PC端有一個特殊的限制需要考慮到，就是使用者的網路流量是有限的。這時候針對這些頁面內部的部分操作，可以使用Ajax非同步請求來完成，針對短期內不會變化的一些資料，可以使用伺服器端緩衝、前端緩衝等機制來儲存這些資料，這樣可以減少使用者一定的資料請求量。

 

（3）Javascript和CSS需要盡量壓縮

把頁面中使用的Javascript和CSS進行壓縮之後會有效地減少頁面大小。

 

（4）用CDN管理頁面資源

CDN的即內容分髮網絡，意在儘可能避開互連網上有可能影響資料轉送速度和穩定性的環節，使內容傳輸的更穩定。

 

（5）列表圖片實現“懶”載入

移動終端裝置因為螢幕大小有限，沒有必要將全屏中的圖片一次性載入完成，網頁載入的同時，我們可以選擇逐個載入，當使用者進行滑動頁面的時候，再繼續載入圖片。

 

（6）圖片顯示的最佳化處理

根據使用者裝置的解析度來載入不同解析度下的不同圖片，這樣既能給不同終端的使用者一個很好的視覺體驗，又不會白白浪費使用者的網路資料流量。

響應式web設計的最佳化