關(guān)于移動端優(yōu)化的問題、最近一些兄弟一直在問我應(yīng)該怎么做?畢竟現(xiàn)在是手機的時代、絕大部分情況下、PC顯得有點雞肋!在講移動端排名之前、逆冬先來講兩個容易被大家搞錯的問題(移動端)。
1、逆冬老師你好、我觀察現(xiàn)在的移動端都是獨立的m.xxx.com,是不是百度喜歡獨立的移動端站點?
觀點:據(jù)本人對很多行業(yè)觀察、并非是百度喜歡m獨立移動站點、而是很多網(wǎng)站都這樣做、給人造成了一種錯覺、許多響應(yīng)式的排名也相當(dāng)不錯!另外、許多同學(xué)在觀察網(wǎng)站的時候、總喜歡觀察大型網(wǎng)站。
舉個例子:某大型網(wǎng)站A、10年前開始做網(wǎng)站、當(dāng)時移動端并未興起、所以A一直做PC流量、直到后面幾年、突然發(fā)現(xiàn)移動端流量比較多、想做移動、這個時候A比較穩(wěn)妥的做法不是把自己的網(wǎng)站改成響應(yīng)式、而是做一套獨立的移動端網(wǎng)站、這樣既保證PC端的流量不受損、又能獲取移動端流量!貿(mào)然改模板、有可能會損失PC端的流量!這點是很多人想不到的。
2、以我們現(xiàn)在的技術(shù)、我能不能不優(yōu)化PC端、單純?nèi)?yōu)化移動端、目前我的行業(yè)PC端沒有流量!
觀點:絕大部分網(wǎng)站都沒法直接優(yōu)化移動端、而都是通過PC端排名去匹配移動端?,F(xiàn)在市面上能單獨優(yōu)化移動端的快排少之又少,而效果更是不如人意!
講完了上面2個經(jīng)常被大家誤解的點、我們再來講下2種移動端匹配的方式以及它們之間存在的優(yōu)缺點及應(yīng)用場景!
一、響應(yīng)式設(shè)計(自適應(yīng))
說明 :PC站和移動站的URL是完全一樣的(不管用什么設(shè)備訪問都一樣),返回給瀏覽器的HTML代碼也是一樣的,不同寬度的屏幕排版不同是通過CSS控制的。以前也經(jīng)常稱為自適應(yīng)設(shè)計,就是因為排版是根據(jù)屏幕寬度自動適應(yīng)的。
優(yōu)點:
搜索引擎抓取、索引一套頁面就行了,提高索引效率,尤其對大網(wǎng)站,抓取份額浪費在多個URL上,就意味著降低深層頁面被抓取的機會。自適應(yīng)設(shè)計只有一個URL,鏈接、權(quán)重計算都集中在一個URL上,不會出問題。
站長方面開發(fā)維護一套代碼就可以了,后端開發(fā)成本相對低一些。建設(shè)的外鏈也集中在一個URL上。不需要判斷設(shè)備、瀏覽器類型,也不需要轉(zhuǎn)向,也就不會出錯。
缺點:
移動設(shè)備由于屏幕大小的關(guān)系,經(jīng)常要隱藏一些內(nèi)容和功能,但還是需要下載完整的HTML代碼,經(jīng)常還包括圖片,所以會浪費帶寬。手機網(wǎng)速慢的話,多下載文件就意味著速度變慢。而且,同一套代碼要在所有設(shè)備顯示正常,還要盡快開始渲染,前端設(shè)計需要比較高的水平。
添加代碼:
自適應(yīng)設(shè)計有其一般原則:在head添加以下代碼并且使用元素處理自適應(yīng)圖片:
自適應(yīng)頁面還應(yīng)該在head中標(biāo)識:
表示頁面同時適合在移動設(shè)備和PC上進行瀏覽。
重要:許多公司在開發(fā)響應(yīng)式網(wǎng)站的時候、都沒有添加以上兩段代碼、也沒有按照代碼要求去做、從而導(dǎo)致了排名無法進行匹配!
建議應(yīng)用場景:簡單傳統(tǒng)企業(yè)網(wǎng)站以及SEO小白博客、不附帶其他功能權(quán)重網(wǎng)站!新網(wǎng)站也建議使用響應(yīng)式!
實戰(zhàn)案例說明:
PC端排名(下圖)
移動端排名(下圖)
排名相差不大的兩個網(wǎng)頁、而且都是響應(yīng)式的網(wǎng)站、一個網(wǎng)站移動端排名首頁、另一個網(wǎng)站移動端沒排名、觀其原因、則是sw256這個站并未添加響應(yīng)式移動端匹配代碼所造成!細節(jié)決定成敗!
二、獨立移動站點(m.domain.x)
說明:移動站的URL和PC站是不一樣的,通常用單獨的子域名,比如PC站是www.x.com,移動站是m.x.com,當(dāng)然移動站的HTML代碼(以及CSS)與PC站也是不一樣的,是專門做了移動優(yōu)化的。換句話說,這種方式下,移動站就是個獨立的網(wǎng)站。
優(yōu)點:
獨立的移動端網(wǎng)站、與時俱進更加方便!比如百度某一年推出MIP、可以寫一套MIP模板與之對應(yīng)!
獨立的移動端網(wǎng)站、可DIY的功能更多!比如移動端支持撥打電話、以及針對移動端人群的一些特定功能都較好開發(fā)!
獨立的移動端代碼更加簡潔、響應(yīng)速度可以更快!如果是響應(yīng)式的網(wǎng)站、為了適配不同的屏幕或設(shè)備、可能要寫多套CSS或html代碼、而獨立的移動端網(wǎng)站只需要寫對應(yīng)的代碼即可!
缺點:
與響應(yīng)式設(shè)計相比,獨立移動站顯然開發(fā)成本要提高,要開發(fā)維護兩套代碼。
獨立移動站的更大潛在麻煩是URL的不同可能造成混亂和各種出錯。比如,既然移動和PC版本URL不同,搜索引擎就需要建立對應(yīng)關(guān)系,必須判斷PC頁面對應(yīng)的移動版本URL是什么,移動頁面對應(yīng)的PC版本URL是什么。
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)系。
添加代碼:
在pc版網(wǎng)頁(http://www.example.com/page-1) 上,添加:
而在移動版網(wǎng)頁(http://m.example.com/page-1) 上,所需的注釋應(yīng)為:
重要:許多公司在操作網(wǎng)站的時候、并未在PC端移動端添加以上代碼。
重要:當(dāng)我們做完獨立移動網(wǎng)站的時候、需要保持URL一一對應(yīng)!使用整站或是正則適配、在百度站長工具平臺(ziyuan.baidu.com)分別將PC站點與移動站點添加,然后提交適配規(guī)則、驗證成功即可,就像做301一樣、許多人忽略了一個如此重要的點!
建議應(yīng)用場景:大型網(wǎng)站或是比較老的網(wǎng)站想做移動端流量、包括一些移動端MIP或是有特殊要求的行業(yè)!
實戰(zhàn)案例:
39健康網(wǎng)做的還是非常到位、不僅添加了代碼、而且還用開放適配直接匹配移動端頁面!
很多網(wǎng)站還在使用JS對ua進行適配跳轉(zhuǎn)、JS跳轉(zhuǎn)方式存在兩個缺點:
(以下摘抄來源于百度站長工具平臺)
1、對用戶:會加大由重定向的客戶端造成的延遲;這是因為客戶端需要先下載網(wǎng)頁,接著解析并執(zhí)行 JavaScript,然后才能觸發(fā)重定向。301或302則不會有這個延遲。
2、對搜索:爬蟲也需要使用支持JS渲染的爬蟲,才能發(fā)現(xiàn)此重定向。
總結(jié):如果你是獨立移動站點匹配、需要添加適配、做好匹配;如果你是響應(yīng)式、只需要添加代碼即可!
本文來自微信公眾號:逆冬黑帽SEO(ID:gh_c3dd79adc24e)授權(quán)發(fā)布,原文鏈接:https://mp.weixin.qq.com/s/jHhhNs_JvuI7EtJinSvLgg
申請創(chuàng)業(yè)報道,分享創(chuàng)業(yè)好點子。點擊此處,共同探討創(chuàng)業(yè)新機遇!