一、移動化方式
1、跳轉適配
利用單獨的網址向每種設備提供不同的代碼。
2、代碼適配
使用相同的網址(不考慮用戶所使用的設備),根據服務器對用戶所用瀏覽器的了解(ua),針對不同設備類型生成不同版本的 HTML。
3、自適應
通過同一網址提供相同HTML代碼。
方式 | PC、移動URL是否一致 | PC、移動源代碼是否一致 | 典型范例 |
跳轉適配 | 否 | 否 | 新浪 |
代碼適配 | 是 | 否 | 百度站長平臺社區 |
自適應 | 是 | 是 | 知乎 |
百度提倡:同一網站只采用一種方式。
二、優缺點分析
跳轉適配 | 代碼適配 | 自適應 | |
開發復雜程度 | ★有多種自動方案可供選擇 | ★★取決于網站的復雜程度和需要創建的代碼庫數量,要進行服務器端編程 | ★★★需用隨屏幕尺寸而變的流體網格從頭創建;若需要簡單,有開源模板可用;包含額外編程的復雜自適應網站,所需時間會較長 |
維護成本 | ★★★PC站更新后,還需在移動端再更新 | ★使用內容管理系統自動在所有模板上發布內容 | ★更新內容自動流向所有設備,維護工作量極低 |
性能 | ★★★可輕松針對小屏幕進行優化,但重定向經常會導致延遲問題 | ★★★可簡化為只包含為相應設備優化的內容 | ★★需要有周全計劃才能實現更優效果,數據量膨脹是更常見的錯誤 |
用戶體驗的一致性 | 僅針對移動用戶優化網站 | 單獨的文件和服務器端代碼,可以提供依設備而定的不同體驗 | 所有設備上的用戶體驗保持一致 |
是否支持新設備擴展 | 不支持,智能手機專用的獨立移動網站 | 支持,可輕松針對具體設備創建模板 | 支持,使用指定的斷點和流體風格,可輕松擴展 |