過去幾個月在問答社區(qū)回答一些了關(guān)于移動端網(wǎng)站優(yōu)化
的問題,，發(fā)現(xiàn)很多移動SEO的問題涉及到用哪種架構(gòu)做移動站。不少SEO貌似對獨(dú)立移動站,，也就是單獨(dú)的m.domain站有不小的執(zhí)念,，認(rèn)為獨(dú)立移動站才是效果最好的。

問答后臺看到另一位讀者“一條愛做夢的咸魚”,，也是問“新網(wǎng)站做移動SEO,，使用m站還是響應(yīng)式？”：

您好,，我在某個回答中看到了你的回答,，有一些疑惑，您建議：“新網(wǎng)站,，或者剛剛要做移動SEO的,，最好就直接采取響應(yīng)式了?！?，為什么直接采取響應(yīng)式呢，我自己的感覺是目前移動搜索排靠前的都是m站較多

翻看了一下以前寫的關(guān)于移動SEO的帖子,，才發(fā)現(xiàn)主要談的是移動頁面怎樣優(yōu)化代碼,、速度等，但在架構(gòu)上應(yīng)該怎樣做移動SEO還沒有仔細(xì)寫過,。今天的帖子就深入探討一下怎樣選擇移動優(yōu)化的三種方式,。

移動優(yōu)化的三種方式

移動網(wǎng)站大體上有三種方式可以選擇：

響應(yīng)式設(shè)計(jì)（responsive design）：

PC站和移動站的URL是完全一樣的（不管用什么設(shè)備訪問都一樣），返回給瀏覽器的HTML代碼也是一樣的,，不同寬度的屏幕排版不同是通過CSS控制的,。以前也經(jīng)常稱為自適應(yīng)設(shè)計(jì)，就是因?yàn)榕虐媸歉鶕?jù)屏幕寬度自動適應(yīng)的,。

動態(tài)服務(wù)（dynamic serving）：

PC站和移動站的URL是完全一樣的,，這點(diǎn)和響應(yīng)式設(shè)計(jì)相同，但動態(tài)服務(wù)方式返回給瀏覽器的HTML代碼（以及CSS）是不一樣的,，PC設(shè)備得到的HTML代碼是PC版,，移動設(shè)備得到的HTML代碼是專門做了移動優(yōu)化的移動版本。

獨(dú)立移動站（separate m. site） ：

移動站的URL和PC站是不一樣的，通常用單獨(dú)的子域名,，比如PC站是www.,，移動站是m.，當(dāng)然移動站的HTML代碼（以及CSS）與PC站也是不一樣的,，是專門做了移動優(yōu)化的,。換句話說，這種方式下,，移動站就是個獨(dú)立的網(wǎng)站,。

這三種方式各有各的特點(diǎn)。

響應(yīng)式設(shè)計(jì)

既然URL一樣,，所有設(shè)備得到的 HTML代碼也一樣,，好處顯而易見：簡單明了，搜索引擎不會被弄糊涂,。搜索引擎抓取,、索引一套頁面就行了，提高索引效率,，尤其對大網(wǎng)站,，抓取份額浪費(fèi)在多個URL上，就意味著降低深層頁面被抓取的機(jī)會,。自適應(yīng)設(shè)計(jì)只有一個URL，鏈接,、權(quán)重計(jì)算都集中在一個URL上,，不會出問題。

用戶也不會被弄糊涂,，收藏書簽,、分享頁面也不會因?yàn)閁RL的不同而出問題。

站長方面開發(fā)維護(hù)一套代碼就可以了,，后端開發(fā)成本相對低一些,。建設(shè)的外鏈也集中在一個URL上。不需要判斷設(shè)備,、瀏覽器類型,，也不需要轉(zhuǎn)向，也就不會出錯,。

當(dāng)然也有壞處,。比如，移動設(shè)備由于屏幕大小的關(guān)系,，經(jīng)常要隱藏一些內(nèi)容和功能,，但還是需要下載完整的HTML代碼，經(jīng)常還包括圖片，所以會浪費(fèi)帶寬,。手機(jī)網(wǎng)速慢的話,，多下載文件就意味著速度變慢。而且,，同一套代碼要在所有設(shè)備顯示正常,，還要盡快開始渲染，前端設(shè)計(jì)需要比較高的水平,。

響應(yīng)式設(shè)計(jì)的頁面必須設(shè)置viewport,，告訴瀏覽器按照屏幕寬度自動調(diào)整頁面排版：

<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

雖然有缺點(diǎn)，但隨著移動網(wǎng)速,、手機(jī)性能的提高,，響應(yīng)式的缺點(diǎn)逐漸顯得沒那么致命，而它的簡捷性就更顯優(yōu)勢了,。所以,，響應(yīng)式設(shè)計(jì)是今后的方向，是大勢所趨,。這也就是為什么我建議新網(wǎng)站,，或者剛剛要做移動SEO的網(wǎng)站，肯定直接就做響應(yīng)式了,，不用考慮其它選項(xiàng),。（除非貴公司不差錢，可以考慮動態(tài)服務(wù),。）

獨(dú)立移動站

和響應(yīng)式設(shè)計(jì)相比,，獨(dú)立移動站顯然開發(fā)成本要提高，要開發(fā)維護(hù)兩套代碼,。隨著國內(nèi)人力成本提高,，需要重復(fù)做的事情會越來越不劃算。

獨(dú)立移動站的更大潛在麻煩是URL的不同可能造成混亂和各種出錯,。比如,，既然移動和PC版本URL不同，搜索引擎就需要建立對應(yīng)關(guān)系,，必須判斷PC頁面對應(yīng)的移動版本URL是什么,，移動頁面對應(yīng)的PC版本URL是什么。網(wǎng)站需要在頁面添加代碼幫助搜索引擎判斷：

PC頁面需要加下面代碼指明移動版本位置：

<link rel=”alternate” media=”only screen and (max-width: 640px)” href=”https://m./”>

對應(yīng)的移動頁面需要加下面代碼指明PC版本位置：

<link rel=”canonical” href=”https://www./”>

在搜索引擎兩個版本都抓取了,、并且正確判斷的情況下,，PC和移動版本就建立了一一對應(yīng)關(guān)系。但是,，如果站長把標(biāo)簽加錯了怎么辦,？搜索引擎只抓取了一個版本怎么辦,？搜索引擎沒有準(zhǔn)確解析<link ref>標(biāo)簽怎么辦？

而且,，要建立一一對應(yīng)關(guān)系,，需要PC版本和移動版本主體內(nèi)容是一樣的。很多時候m.移動版本頁面內(nèi)容精減或修改過多,，搜索引擎認(rèn)為內(nèi)容不相符怎么辦,？甚至有的時候獨(dú)立移動站只建了部分頁面，很多PC頁面沒有對應(yīng)移動頁面又怎么辦,？

網(wǎng)站有兩個版本,，用戶在添加書簽、分享鏈接時,，不可避免地會有一部分指向PC頁面URL,，一部分指向移動URL，鏈接權(quán)重將分散,。

通常,，為了用戶體驗(yàn)和幫助搜索引擎判斷對應(yīng)關(guān)系，網(wǎng)站需要做符合規(guī)則的轉(zhuǎn)向：

• PC用戶由于某種原因訪問了移動URL的話,，需要被自動301轉(zhuǎn)向到PC版本URL

• 移動用戶由于某種原因訪問了PC頁面URL的話,，需要被自動301轉(zhuǎn)向到移動URL

301轉(zhuǎn)向一般是服務(wù)器端做的，首先就需要根據(jù)瀏覽器用戶代理匹配特征字符串判斷用戶設(shè)備和瀏覽器類型,，上網(wǎng)設(shè)備和瀏覽器五花八門,，程序100%檢測正確不是件容易的事。判斷出錯,，用戶可能就只能看到一個排版錯誤的頁面,，甚至某些功能都無法使用。搜索引擎蜘蛛也可能被判斷錯,，導(dǎo)致不能建立兩個版本的對應(yīng)關(guān)系。

大公司需要用子域名做
多語言網(wǎng)站SEO的話,，加上m.獨(dú)立移動站,，就會使管理子域名更加復(fù)雜，因?yàn)榫W(wǎng)站又要增加：

• sg.

• m.sg.

• cn.

• m.cn.

等等,。多語言hreflang標(biāo)簽和獨(dú)立移動站的<link ref>標(biāo)簽排列組合起來,，哪個對應(yīng)哪個不能弄錯了。如果再加上Google AMP
和
百度MIP頁面版本,，所有版本之間的對應(yīng)關(guān)系和標(biāo)簽寫法,，可能會把人繞暈倒。

動態(tài)服務(wù)

動態(tài)服務(wù)和獨(dú)立移動站一樣,，首先在服務(wù)器端判斷設(shè)備和瀏覽器類型,，然后在同樣的URL上,、根據(jù)瀏覽器屏幕寬度返回不同的HTML和CSS代碼。

所以動態(tài)服務(wù)方法相當(dāng)于把響應(yīng)式設(shè)計(jì)和獨(dú)立移動站的優(yōu)點(diǎn)結(jié)合起來了,，即有URL統(tǒng)一的簡潔明了,，又有獨(dú)立移動站的代碼優(yōu)化，SEO效果是最好的,。當(dāng)然,，代價是前后端成本都要提高。

對不差錢的公司來說,，動態(tài)內(nèi)容是最佳選擇,，比如amazon現(xiàn)在就是用動態(tài)服務(wù)做移動優(yōu)化的，URL統(tǒng)一簡單,，不會出錯,，兩個版本的代碼還可以分別優(yōu)化，據(jù)說,，亞馬遜移動版本節(jié)省了40%的文件下載量,，對手機(jī)用戶來說，頁面打開速度的提升是至關(guān)重要的 ,。

是否使用動態(tài)服務(wù)要看公司情況,。對大部分網(wǎng)站來說，頁面內(nèi)容,、排版,、功能沒那么復(fù)雜，響應(yīng)式設(shè)計(jì)已經(jīng)滿足需要,，用高成本實(shí)現(xiàn)動態(tài)服務(wù),，節(jié)省的下載量沒那么明顯，比如SEO每天一貼這種博客,，還有大量內(nèi)容型網(wǎng)站,，頁面連個圖片都沒有，除了留言也沒有別的交互,，那是一點(diǎn)下載都節(jié)省不了,，動態(tài)服務(wù)就沒意義了。

搜索引擎蜘蛛訪問動態(tài)服務(wù)的頁面時,，從HTML代碼是無法自動知道不同瀏覽器得到的代碼將會是不同的,。比如PC蜘蛛訪問時，得到的是PC版代碼,，但蜘蛛并不必然知道移動蜘蛛來訪問的話會得到不同的代碼,，所以服務(wù)器端需要通過Vary HTTP頭信息告訴搜索引擎蜘蛛，PC蜘蛛和移動蜘蛛得到的代碼是不一樣的,，兩個蜘蛛都要來訪問一下,。比如amazon.com頁面的服務(wù)器頭信息：

< Content-Type: text/html

< Content-Length: 6400

< Connection: keep-alive

< Server: Server

< Date: Sat, 27 Jul 2019 16:42:45 GMT

< Vary: Content-Type,Host,Cookie,Accept-Encoding,X-Amzn-CDN-Cache,X-Amzn-AX-Treatment,User-Agent

< Edge-Control: no-store

< x-amz-rid: KH589YRZC8QEW3QEWGKD

< X-Cache: Error from cloudfront

< Via: 1.1 1b52a5dd431f9e3c81753e61dfdf467a.cloudfront.net (CloudFront)

< X-Amz-Cf-Pop: SFO9

< X-Amz-Cf-Id: 0qtVw99a2_AustEZ-dxC_cs9hfVzyll-DmHnmWFDtBSWKtinpxhB2Q==

其中Vary那行就是通知瀏覽器/蜘蛛,，根據(jù)后面列的情況不同，HTML代碼是不同的,，Vary: User-Agent指的就是根據(jù)瀏覽器用戶代理的不同,，HTML代碼是不同的。

對獨(dú)立移動站的執(zhí)念來自何處

很多公司和站長對獨(dú)立移動站情有獨(dú)鐘,，認(rèn)為m.移動站SEO效果是最好的,，做新網(wǎng)站還要做獨(dú)立m.站。這個執(zhí)念可能來自兩方面,。

一是以前百度更建議獨(dú)立移動站,，我在
2015年廈門百度之夜的帖子中說明過這一點(diǎn)。但現(xiàn)在4年過去了,，百度現(xiàn)在的正式官方態(tài)度我沒有看到,，但兩年前百度搜索主任架構(gòu)師
譚待明確跟我說過，百度也認(rèn)為響應(yīng)式設(shè)計(jì)是未來趨勢,，百度也推薦轉(zhuǎn)向響應(yīng)式設(shè)計(jì),。我的觀察是，百度現(xiàn)在對響應(yīng)式設(shè)計(jì)的支持沒有問題,。

Google一直以來就是推薦響應(yīng)式設(shè)計(jì)的,。

當(dāng)然，這里說的推薦,，并不是說響應(yīng)式比獨(dú)立移動站的SEO效果更好,，而只是表明，百度和Google對三種方法是一視同仁的,，排名上并不偏向哪一個,，SEO效果是一樣的。既然效果一樣,，當(dāng)然推薦那個簡單便宜的了,。

第二個原因，就如開頭讀者說的,，目前在百度移動搜索排名靠前的m站較多,。這是個準(zhǔn)確的觀察，確實(shí)百度移動搜索結(jié)果中排名好的m站很多,，在不少行業(yè)，m.站排在前面的占大部分,。不過,，這并不必然說明m.獨(dú)立移動站有SEO優(yōu)勢，我覺得這更多是采樣偏差造成的,。

舉個例子,，數(shù)據(jù)表明,，車禍發(fā)生大部分是男性司機(jī)造成的，不過這是否說明男司機(jī)開車有劣勢呢,？恐怕不能這么認(rèn)為,，因?yàn)楸仨毧紤]路上司機(jī)的男女比例，很可能開車的80%是男的,，造成了70%的車禍,，所以70%車禍?zhǔn)悄兴緳C(jī)造成，不能說明男司機(jī)開車水平比女司機(jī)差,。

移動搜索排名也是同樣道理?，F(xiàn)在排名靠前的m.站居多，很可能這些站絕大部分是老站（所以才排名能力高嘛）,，而幾乎所有老站當(dāng)初開始做移動SEO時都是從m站入手的,，不到萬不得已，這些使用m站的老站不會去改為響應(yīng)式設(shè)計(jì),，因?yàn)楦膭犹罅?，冒險，又沒有明顯好處（如前所說,，三種方式SEO效果一樣的）,，沒有動力改。

所以,，老站,、大站排名好，而老站,、大站又以m站為主,，所以我們就看見m站排名好了。但這不說明一個新站就要學(xué)著做m站啊,。