針對移動端進行網站優化的一些必備知識

參考博文:

https://www.zhidaow.com/post/the-opinion-of-build-mobile-optimized-websites-from-googlehttps://developers.google.com/search/mobile-sites/


針對移動端的網站一般有3種配置方式:

1、響應性網頁設計,即同一網址,相同內容。

不管用戶是哪種設備,PC,手機還是平板電腦,內容層的HTML全都一樣,只是通過表現層的CSS來控制不同的表現形式,如在移動端和平板下會控制最大寬度,以適應屏幕顯示。

2、同一網址,不同內容。

同一個網址,根據用戶使用設備的不同,從而返回不同的內容。這是從服務器端控制,根據用戶的身份(User-Agent,用戶請求網頁時提供給服務器的信息之一)來判斷設備,從而提供不同的內容。

3、不同網址,不同內容。

根據設備的不同,網站呈現不同的網址,不同的內容。比如PC端爲www.example.com,智能手機端爲m.example.com,傳統手機端爲wap.example.com。通常情況下還會同時設置重定向,比如用智能手機訪問www.example.com,會自動跳轉到m.example.com上,以及現在出來了很多小程序的站點,比如希望在手機百度上搜索『小紅書』,出來小紅書的小程序。


一些名詞解釋:

wap:

無線應用協議(Wireless Application Protocol,WAP),是一個使移動用戶使用無線設備(例如移動電話)隨時使用互聯網的信息和服務的開放的規範。WAP的主要意圖是使得袖珍的、手提的無線終端設備能夠獲得類似網頁瀏覽器的功能,因此其功能上有限。傳統手機上使用的。

m. /mobile. :

智能手機端。一般網站的移動版url都會在前面多加“m”開頭,表明是移動網頁。

html、xhtml與html5:

https://www.zhihu.com/question/19818208

https://www.jianshu.com/p/896ca2bb2f59

·HTML語法非常寬鬆容錯性強

·XHTML更爲嚴格,他要求標籤必須小寫、必須嚴格閉合、標籤中的屬性必須使用引號引起等;

·HTML5是HTML的下一個版本所以除了非常寬鬆容錯性強以外還增加了許多新的特性

·.html和.htm的區別

1、DOS操作系統(win95或win98)下只能支持長度爲3的後綴名,所以是.htm

2、但是在Windows後綴長度可以大於3位,所以Windows下無所謂htm與html,html是爲長文件的格式命名的

3、所以.htm是爲了兼容過去的DOS命名格式存在的

mip :

https://ziyuan.baidu.com/mip/index

  • MIP(Mobile Instant Page - 移動網頁加速器),是一套應用於移動網頁的開放性技術標準。通過提供MIP-HTML規範、MIP-JS運行環境以及MIP-Cache頁面緩存系統,實現移動網頁加速

 


使用rel="canonical"和rel="alternate"

如使用上面第三種方式,不同的URL返回基本同樣的內容,就會出現內容重複的問題,例如www.example.com/arti123.html和m.example.com/arti123.html。那怎麼解決呢?rel="canonical"rel="alternate"標籤很好的解決了這個問題。rel="canonical"和rel="alternate"是一種專門針對搜索引擎的建議,指明重複頁面中的標準頁面(目前谷歌,bing,百度都聲明支持這個標籤)。比如頁面A和頁面B2個相似頁面,頁面A是標準頁面,頁面B是替補頁面,則頁面B需要加上rel="canonical"標籤,表明標準頁面爲A;而頁面A則加上"rel="alternate"標籤,說明還有個替補頁面B。如:頁面A上:<link ref="alternate" href="www.example.com/B">頁面B上:<link ref="canonical" href="www.example.com/A">桌面版網頁和移動版網頁跟上面的問題極其相似,通常桌面版網頁爲標準頁面,而移動版網頁爲替補頁面。則2類頁面上可添加如下標籤:桌面版網頁:<link ref="alternate" href="m.example.com/">移動版網頁:<link ref="canonical" href="www.example.com/">

 

網站間重定向

當在移動端使用不同的URL時(即上面第三種方式),網站一般同時還會設置重定向(即跳轉),比如用戶在智能手機端瀏覽www.example.com,會自動跳轉到m.example.com,以更好的呈現頁面。Googlebot支持兩種重定向設置方法:HTTP重定向和JS重定向。(具體設置過程我還沒掌握。對於HTTP重定向我建議設置爲302跳轉,因爲302含義爲臨時跳轉,更加符合規範。)很多網站在設置重定向時會犯同樣一種錯誤,那就是重定向至無關地址。比如智能手機端訪問www.example.com/talk/123321.html,卻重定向至移動版首頁m.example.com

當根據訪問端對網址進行適配時,解析canonical標籤得到的適配後的網址,以及網站重定向得到的網址,都會作爲召回數據。

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章