如何從PC頁面重定向到移動頁面?

  • 發布時間:2019-01-24 20:52:22
  • 作者:資深網
  • 瀏覽:3335
  • 有很多時候,用戶在移動設備上會訪問到PC頁面的地址,這種情況下,我們需要以極快的速度跳轉到對應的移動端頁面,盡量減少用戶的感知,給用戶最好的體驗。那么,如何從PC頁面重定向到移動頁面呢?本文將為你解答。

    如何能快速地由PC頁重定向到移動頁面,我們按照不同站點的類型,給出了幾種常見的實現方式。

    1. 站點有獨立的移動端站點和PC站點

    這種情況下,我們需要進行服務端跳轉。當在移動設備上訪問PC站點時,需要服務端進行環境判斷,然后重定向到對應的移動頁面。

    (1)環境判斷

    環境的判斷,一般是通過判斷請求的userAgent,以php為例,下面給出簡單的代碼實現

    042711548243865.png

    (2)重定向到對應的移動端頁面

    088051548243892.png

    2. 站點沒有獨立的移動站點

    這種情況下,我們可以采用前端頁面響應式布局,以便在不同的分辨率和設備下都可以合理的進行頁面展示。

    關于響應式布局,關鍵的有幾點:

    • 使用media query(媒體查詢),在不同尺寸、不同設備上進行不同展示,譬如

    053561548243918.png

    • 設置viewport(視窗)。如果沒有設置viewport,在移動設備上將會使用桌面版屏幕寬度渲染頁面,然后再進行縮放以適應屏幕。

    078231548244843.png

    • 布局方式。傳統的固定布局方式,無法適應響應式布局,建議采用柵格化布局,可以參考Bootstrap的流式柵格化布局。


    熱門標簽
    營銷型網站建設 怎么做網站 營銷型網站與展示型網站的區別 網站優化原理 網站收錄 網站文章優化 本地化網站優化 網站建設合同 網站優化合同 網站優化排名 網站創意怎么做 網站有點擊無咨詢 有排名無點擊 網站定位 網站怎么做推廣 自己怎么做網站 網站怎么做 網站建設多少錢 網站建設價格 網站建設素材
    山東淄博市高新區齊魯電商谷C3-802
    843897106
    www.forever-japan.cn
    18615152101 0533-3910025
    Copyright 717 淄博資深網站建設公司 All rights reseved 魯ICP備17013190號-1