當前位置:首頁 > 我們的(de)觀點 > 列表

百度優化(huà):如何布局您的(de)PC站和(hé)移動站

點擊:時(shí)間:2016/3/19關鍵詞:PC站 移動站 wap
目前較流量的(de)PC站與移動站配置方式有三種,百度站在搜索引擎角度将這(zhè)三種分(fēn)别稱爲跳轉适配、代碼适配和(hé)自适應,以下(xià)爲這(zhè)三種配置方式的(de)名詞解釋及異同對(duì)比。1,跳轉适配:該方法會利用(yòng)單獨的(de)網址向每種設備提供不同的(de)代碼。這(zhè)種配置會嘗試檢測用(yòng)戶所使用(yòng)的(de)設備或ua,然後使用(yòng)

目前較流量的(de)PC站與移動站配置方式有三種,百度站在搜索引擎角度将這(zhè)三種分(fēn)别稱爲跳轉适配、代碼适配和(hé)自适應,以下(xià)爲這(zhè)三種配置方式的(de)名詞解釋及異同對(duì)比。

1,跳轉适配:該方法會利用(yòng)單獨的(de)網址向每種設備提供不同的(de)代碼。這(zhè)種配置會嘗試檢測用(yòng)戶所使用(yòng)的(de)設備或ua,然後使用(yòng) HTTP 重定向和(hé) Vary HTTP标頭重定向到相應的(de)頁面。

2,代碼适配:該方法使用(yòng)相同的(de)網址(不考慮用(yòng)戶所使用(yòng)的(de)設備),但會根據服務器對(duì)用(yòng)戶所用(yòng)浏覽器的(de)了(le)解(ua),針對(duì)不同設備類型生成不同版本的(de)HTML

3,自适應:通(tōng)過同一網址提供相同 HTML 代碼的(de)網站設計方法。該方法不考慮用(yòng)戶所使用(yòng)的(de)設備(pc、平闆電腦(nǎo)、移動設備),但可(kě)以根據屏幕尺寸以不同方式呈現(即适應)顯示屏。


PC、移動網址是否一緻 PC、移動網頁代碼是否一緻
跳轉适配
代碼适配
自适應


三種配置方式的(de)分(fēn)析

百度僅站在搜索引擎角度對(duì)跳轉适配、代碼适配、自适應這(zhè)三種配置方式做(zuò)了(le)一些對(duì)比和(hé)分(fēn)析,希望能夠幫助站點選擇更适合自己、性價比最優的(de)方式來(lái)進行移動化(huà)。


跳轉适配 代碼适配 自适應
複雜(zá)程度 簡單到中等。開發獨立網站的(de)速度可(kě)以非常快(kuài)。
小型企業可(kě)選用(yòng)多(duō)種自動方案,以近乎實時(shí)的(de)速度生成移動網站。
中到高(gāo),取決于網站的(de)複雜(zá)程度和(hé)您需要創建的(de)代碼庫數量。
代碼适配所需的(de)開發時(shí)間可(kě)能較長(cháng),且要求服務器端編程
中。需要使用(yòng)能随屏幕尺寸而變的(de)流體網格從頭開始創建。
如果網站需求較簡單,有許多(duō)開源模闆可(kě)供選擇。
如要構建包含額外編程的(de)複雜(zá)的(de)自适應網站,所需的(de)時(shí)間會比較長(cháng)。
性能 中。圖片和(hé)其他(tā)網站内容可(kě)輕松針對(duì)小屏幕優化(huà),但網站重定向經常會導緻延遲問題。
高(gāo)。可(kě)以簡化(huà)爲隻包含爲相應設備優化(huà)的(de)内容,以實現最佳性能。
高(gāo)。無任何重定向,但需要有周全的(de)計劃才能實現最優的(de)效果。數據量膨脹是最常見的(de)錯誤。
維護需求 中到高(gāo)。更新主網站後,還(hái)必須單獨在移動網站上進行更新。
如果人(rén)工維護,将需要大(dà)量的(de)資源。許多(duō)網站使用(yòng)内容管理(lǐ)系統來(lái)避免這(zhè)一問題,并自動在所有模闆上發布内容。
低。創建後,更新内容會流向所有設備,維護工作量極低。
設備 可(kě)專門針對(duì)移動用(yòng)戶優化(huà)網站。
單獨的(de)文件和(hé)服務器端代碼(會在向用(yòng)戶傳遞網頁前在您的(de)服務器上運行)可(kě)以提供依設備而定的(de)體驗。
所有設備上的(de)用(yòng)戶體驗保持一緻(一些設備專屬的(de)選項可(kě)通(tōng)過服務器端程序添加)。
是否支持擴展至新平台 不支持。這(zhè)是智能手機專用(yòng)的(de)獨立移動網站。新平台無法輕松集成到現有架構中。
支持。可(kě)輕松針對(duì)具體的(de)設備(例如智能電視)創建模闆,并通(tōng)過同一個(gè)網址投放。
支持。使用(yòng)指定的(de)斷點和(hé)流體網格,可(kě)輕松擴展到新平台和(hé)新設備。


三種配置方式的(de)優化(huà)建議(yì)
1,跳轉适配
  在此配置中,每個(gè)pc版網址都具有一個(gè)對(duì)應的(de)不同網址,用(yòng)于提供針對(duì)移動設備進行優化(huà)的(de)内容。爲了(le)幫助我們的(de)算(suàn)法了(le)解單獨的(de)移動版網址,我們建議(yì)您使用(yòng)以下(xià)注釋:

pc版網頁上,添加指向對(duì)應移動版網址的(de)特殊鏈接 rel="alternate" 标記。這(zhè)有助于發現網站的(de)移動版網頁所在的(de)位置。
  在移動版網頁上,添加指向對(duì)應pc版網址的(de)鏈接 rel="canonical" 标記。

例如,假設pc版網址爲http://www.example.com/page-1,且對(duì)應的(de)移動版網址爲 http://m.example.com/page-1,那麽此示例中的(de)注釋如下(xià)所示:

pc版網頁(http://www.example.com/page-1) 上,添加:
       href="http://m.example.com/page-1" >

而在移動版網頁(http://m.example.com/page-1) 上,所需的(de)注釋應爲:
  

也(yě)可(kě)以使用(yòng)原有的(de)開放适配提交方法。
http://zhanzhang.baidu.com/college/courseinfo?id=267&page=20

2,代碼适配
  爲了(le)使百度能夠知道當您的(de)頁面發生變化(huà)時(shí),同時(shí)需要用(yòng)其他(tā)的(de)ua重新抓取一遍,請您添加Vary HTTP标頭。Vary HTTP 标頭具有以下(xià)兩個(gè)非常重要且實用(yòng)的(de)作用(yòng):
  a) 它會向 ISP 和(hé)其他(tā)位置使用(yòng)的(de)緩存服務器表明(míng):在決定是否通(tōng)過緩存來(lái)提供網頁時(shí)它們應考慮用(yòng)戶代理(lǐ)。如果您沒有使用(yòng) Vary HTTP 标頭,緩存可(kě)能會錯誤地向移動設備用(yòng)戶提供pc版 HTML 網頁的(de)緩存(反之亦然)。
  b) 它有助于 百度spdier 更快(kuài)速地發現針對(duì)移動設備進行優化(huà)的(de)内容,這(zhè)是因爲我們在抓取針對(duì)移動内容進行過優化(huà)的(de)網址時(shí),會将有效的(de) Vary HTTP 标頭作爲抓取信号之一,我們會提高(gāo)用(yòng)其他(tā)ua抓取此網頁的(de)優先級。

示例:


  并且在pc的(de)響應的(de)head中添加
  
  在移動的(de)響應的(de)包頭中添加
  

3,自适應
  自适應設計有其一般原則:在head添加以下(xià)代碼并且使用(yòng)元素處理(lǐ)自适應圖片:
  

自适應頁面還(hái)應該在head中标識:
  
  表示頁面同時(shí)适合在移動設備和(hé)PC上進行浏覽。


關于移動配置,百度不建議(yì)的(de)做(zuò)法
  1,單一域名下(xià)請使用(yòng)同一種配置方式(跳轉适配、代碼适配、自适應),例如,不要把移動站的(de)頁面作爲pc站網址中的(de)一個(gè)子目錄來(lái)配置。

  2,如果使用(yòng)跳轉适配的(de)方式,請不要使用(yòng)JS對(duì)ua進行适配跳轉。這(zhè)種方式存在兩個(gè)缺點:
  a) 對(duì)用(yòng)戶:會加大(dà)由重定向的(de)客戶端造成的(de)延遲;這(zhè)是因爲客戶端需要先下(xià)載網頁,接著(zhe)解析并執行 JavaScript,然後才能觸發重定向。301或302則不會有這(zhè)個(gè)延遲。
  b) 對(duì)搜索:爬蟲也(yě)需要使用(yòng)支持JS渲染的(de)爬蟲,才能發現此重定向。
預約建站
免費提供網站優化(huà)
領取關鍵詞