HTML5響應式設計的解決方案

2015年12月16日 10 分類：HTML5開發方案

近幾年內，移動設備快速崛起，移動互聯網慢慢進入人們的生活，預計未來5年內移動設備的使用度會超過桌面計算機。所以我們創建的網站不僅要在桌面計算機大尺寸屏幕上可以為用戶提供友好的UI和用戶體驗，同時在移動設備小尺寸屏幕上也應該可以提供一致的用戶體驗。使得用戶可以在桌面大屏幕上和移動小屏幕上平滑的切換使用，同時沒有任何的不適應感覺。

要網站在桌面大尺寸屏幕上和移動小尺寸屏幕上提供一致的用戶體驗，最直接的方法就是為每種設備及分辨率制作一個網站或者特定的頁面，使得移動用戶在這些頁面里取得平滑友好的用戶體驗。但是到底有多少不同的移動設備和屏幕分辨率呢?這種方法需要投入多少成本能?

我們的方式是采用HTML5加響應式Web設計方案：一個網站能夠兼容多種移動設備屏幕尺寸，而不是為每種屏幕尺寸做一個特定的版本。當設備分辨率發生變化時，頁面能夠根據設備分辨率，調整菜單，圖片，文字，等其它頁面DOM的狀態和布局，使得頁面仍然可以給用戶提供友好的使用體驗。

采用HTML5加響應式Web設計方案后，頁面的設計與開發將根據用戶行為以及設備環境(系統平臺、屏幕尺寸、屏幕定向等)進行相應的響應和調整。無論用戶正在使用筆記本還是iPad或者是iPhone，我們的頁面都能夠自動切換分辨率、圖片尺寸及相關腳本功能等，以適應不同設備。最終使得頁面有能力去自動響應用戶的設備環境，這樣，我們就可以不必為不斷到來的新設備做專門的版本設計和開發了。