如何從PC頁(yè)面重定向到移動(dòng)頁(yè)面?

1699次閱讀

有很多時(shí)候,用戶在移動(dòng)設(shè)備上會(huì)訪問(wèn)到PC頁(yè)面的地址,這種情況下,我們需要以極快的速度跳轉(zhuǎn)到對(duì)應(yīng)的移動(dòng)端頁(yè)面,盡量減少用戶的感知,給用戶最好的體驗(yàn)。那么,如何從PC頁(yè)面重定向到移動(dòng)頁(yè)面呢?本文將為你解答。

如何能快速地由PC頁(yè)重定向到移動(dòng)頁(yè)面,我們按照不同站點(diǎn)的類型,給出了幾種常見的實(shí)現(xiàn)方式。


1、站點(diǎn)有獨(dú)立的移動(dòng)端站點(diǎn)和PC站點(diǎn)

這種情況下,我們需要進(jìn)行服務(wù)端跳轉(zhuǎn)。當(dāng)在移動(dòng)設(shè)備上訪問(wèn)PC站點(diǎn)時(shí),需要服務(wù)端進(jìn)行環(huán)境判斷,然后重定向到對(duì)應(yīng)的移動(dòng)頁(yè)面。

(1)環(huán)境判斷

環(huán)境的判斷,一般是通過(guò)判斷請(qǐng)求的userAgent,以php為例,下面給出簡(jiǎn)單的代碼實(shí)現(xiàn)

042711548243865.png

(2)重定向到對(duì)應(yīng)的移動(dòng)端頁(yè)面

088051548243892.png


2、站點(diǎn)沒有獨(dú)立的移動(dòng)站點(diǎn)

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

關(guān)于響應(yīng)式布局,關(guān)鍵的有幾點(diǎn):

1、使用media query(媒體查詢),在不同尺寸、不同設(shè)備上進(jìn)行不同展示,譬如

053561548243918.png

2、設(shè)置viewport(視窗)。如果沒有設(shè)置viewport,在移動(dòng)設(shè)備上將會(huì)使用桌面版屏幕寬度渲染頁(yè)面,然后再進(jìn)行縮放以適應(yīng)屏幕。

078231548244843.png

3、布局方式。傳統(tǒng)的固定布局方式,無(wú)法適應(yīng)響應(yīng)式布局,建議采用柵格化布局,可以參考Bootstrap的流式柵格化布局。?


閱讀本文的人還可以閱讀:

百度站長(zhǎng)平臺(tái)鏈接提交工具是什么

百度站長(zhǎng)平臺(tái)網(wǎng)站驗(yàn)證常見錯(cuò)誤及解決辦法

百度站長(zhǎng)平臺(tái)為什么要驗(yàn)證網(wǎng)站? 如何驗(yàn)證網(wǎng)站

本文由夫唯SEO特訓(xùn)營(yíng)編輯整理。

搜外專注SEO培訓(xùn)和SEO周邊Saas服務(wù)解決方案,10年來(lái)超過(guò)五萬(wàn)學(xué)員在此獲得技術(shù)提升和人脈圈子。

SEO課程包含移動(dòng)搜索、零基礎(chǔ)建站、群站SEO思維、搜外6系統(tǒng)、SEM入門等。

192期A班報(bào)名時(shí)間7月1日-7月15日,請(qǐng)?zhí)砑诱猩头∧⑿牛簊eowhy2021。 微信掃碼添加客服人員

我們的目標(biāo)是:讓非技術(shù)人員輕松學(xué)會(huì)互聯(lián)網(wǎng)技術(shù)。

  • 搜外會(huì)員SEO交流群(免費(fèi))

    微信掃碼添加客服人員
  • 小程序運(yùn)營(yíng)交流群(免費(fèi))

    微信掃碼添加客服人員
  • 搜外會(huì)員SEM競(jìng)價(jià)交流群(免費(fèi))

    微信掃碼添加客服人員
  • 夫唯學(xué)員SEO交流群(VIP)

    微信掃碼添加客服人員

掃碼獲取資源

微信掃碼添加客服人員
  • SEO技術(shù)實(shí)戰(zhàn)微信群

    微信掃碼添加客服人員
  • 大站流量總監(jiān)群(審核身份)

    微信掃碼添加客服人員
  • Google獨(dú)立站英文SEO群

    微信掃碼添加客服人員
  • SEO團(tuán)隊(duì)KPI管理表格

    微信掃碼添加客服人員
  • 工業(yè)品網(wǎng)站友情鏈接群

    微信掃碼添加客服人員
  • 本地生活服務(wù)業(yè)友鏈群

    微信掃碼添加客服人員

跟夫唯老師系統(tǒng)學(xué)習(xí)群站SEO
成為互聯(lián)網(wǎng)運(yùn)營(yíng)推廣大咖

掌握SEO技巧、建站前端、群站霸屏、SEM入門、新聞源推廣……
Processed in 0.128237 Second , 42 querys.