中文字幕在线观看,亚洲а∨天堂久久精品9966,亚洲成a人片在线观看你懂的,亚洲av成人片无码网站,亚洲国产精品无码久久久五月天

使用“谷歌移動設(shè)備易用性”工具優(yōu)化移動網(wǎng)站

2019-03-05    來源:月光博客

容器云強勢上線!快速搭建集群,上萬Linux鏡像隨意使用

谷歌1.jpg

圖片來源圖蟲:已授站長之家使用

隨著移動網(wǎng)站的流量日益增大,擁有適合移動設(shè)備的網(wǎng)站是提升網(wǎng)站影響力的重要因素,谷歌等搜索引擎也大力加強移動端的搜索體驗,不過,很多桌面版網(wǎng)站在移動設(shè)備上可能不太容易瀏覽及使用。因此,擁有適合移動設(shè)備的網(wǎng)站是提升在線影響力的重要因素。為了方便網(wǎng)站站長對于原有桌面網(wǎng)站在移動設(shè)備上的優(yōu)化,谷歌推出了“移動設(shè)備易用性”工具來幫助站長優(yōu)化網(wǎng)站。

工具使用方法

注意,這個好用的工具用的是Google域名,需要翻墻才能訪問,如果你不會翻墻,那么請忽略并跳過此文。

整個網(wǎng)站測試:

訪問Google Webmaster,在該工具里添加網(wǎng)站,即可對整個網(wǎng)站的所有頁面進行移動設(shè)備易用性測試。

單個網(wǎng)頁測試:

移動設(shè)備適合性測試工具:https://search.google.com/test/mobile-friendly

谷歌移動設(shè)備易用性

打開這個網(wǎng)址后,將需要測試的網(wǎng)頁的完整網(wǎng)址輸入,點擊運行測試,系統(tǒng)就會抓取網(wǎng)頁并進行測試追蹤,通常測試過程不會超過一分鐘。

測試結(jié)果包括以下兩個部分:相應(yīng)網(wǎng)頁在移動設(shè)備上所呈現(xiàn)的樣貌的屏幕截圖,以及該工具發(fā)現(xiàn)的所有移動設(shè)備可用性問題的列表。與在移動設(shè)備上的易用性有關(guān)的問題是指會對使用移動(小屏幕)設(shè)備訪問相應(yīng)網(wǎng)頁的用戶造成影響的問題,包括字體過。ㄔ谛∑聊簧虾茈y看清楚)和使用 Flash(大多數(shù)移動設(shè)備都不支持 Flash)等等。

有時候,測試結(jié)果展示的屏幕截圖并不正常,可能是測試無法加載相應(yīng)網(wǎng)頁所用的所有資源,會顯示“網(wǎng)頁包含無法加載的資源”的警告消息,這些資源是指網(wǎng)頁包含的外部元素,如圖片、CSS 或腳本文件。導(dǎo)致出現(xiàn)該問題的最主要原因可能是網(wǎng)站站長設(shè)置robots.txt禁止搜索引擎訪問相應(yīng)資源,只需修改robots.txt,取消禁止搜索引擎訪問此資源即可。

工具優(yōu)化指南

移動設(shè)備適合性測試工具能檢測出下列可用性錯誤,我們可以針對對應(yīng)錯誤進行一一修改,具體的優(yōu)化修改方法如下:

1、使用了不兼容的插件

頁面使用了Flash等插件,將Flash刪除,或者使用HTML5 來替代即可。

2、未設(shè)置視口

網(wǎng)頁未定義viewport屬性,只需要在網(wǎng)頁頭部增加如下一行即可。

<meta name="viewport" content="width=device-width, initial-scale=1" />

3、文字太小,無法閱讀

網(wǎng)頁字體過小而,移動設(shè)備用戶需要“張合雙指進行縮放”,然后才能閱讀這些網(wǎng)頁上的內(nèi)容。這實際上和上一個是同一個問題,網(wǎng)頁只要定義了viewport屬性,這個問題即可解決。

4、內(nèi)容寬度超過了屏幕顯示范圍

網(wǎng)頁需要橫向滾動屏幕才能查看其中的文字和圖片,這說明頁面中某些元素的CSS樣式使用了寬度的絕對值,例如圖片、表格使用的980px寬度等,這種問題的修改方法是,在css中使用響應(yīng)式設(shè)計方法,當瀏覽器寬度介于 0 像素和 640 像素之間時,使用適合移動設(shè)備的css,將寬度設(shè)置為相對值,或者將部分元素隱藏。示例代碼如下:

@media screen and (max-width:640px) {

  #divMain {

    width:100%;

  }

  #divSidebar {

    display:none;

  }

}

5、可點擊元素之間的距離太近

網(wǎng)頁上的元素(如按鈕和導(dǎo)航鏈接)間距過小,導(dǎo)致移動設(shè)備用戶在用手指點按所需元素時通常會按到相鄰的元素。這個問題也可以使用響應(yīng)式設(shè)計方法,在移動設(shè)備上增加行高即可,示例代碼如下:

@media screen and (max-width:640px) {

  p {

    line-height:150%;

  }

}

總結(jié)

解決了這些問題之后,點擊“驗證修復(fù)”,即可讓搜索引擎重新驗證網(wǎng)站頁面,對影響網(wǎng)站的移動設(shè)備易用性問題加以修復(fù)。

谷歌移動設(shè)備易用性

如果長期不修復(fù)這些問題,網(wǎng)站的移動版網(wǎng)頁就無法提供令人滿意的瀏覽體驗,那么網(wǎng)站頁面就會在移動搜索結(jié)果中的排名下降,導(dǎo)致流量的損失,因此,網(wǎng)站的站長趕快行動起來,立刻使用“谷歌移動設(shè)備易用性”工具來優(yōu)化移動網(wǎng)站吧。

標簽: 網(wǎng)站優(yōu)化 移動網(wǎng)站優(yōu)化 谷歌搜索引擎 

版權(quán)申明:本站文章部分自網(wǎng)絡(luò),如有侵權(quán),請聯(lián)系:west999com@outlook.com
特別注意:本站所有轉(zhuǎn)載文章言論不代表本站觀點!
本站所提供的圖片等素材,版權(quán)歸原作者所有,如需使用,請與原作者聯(lián)系。

上一篇:優(yōu)化SEO之空間域名選擇的優(yōu)化策略

下一篇:新手做網(wǎng)頁設(shè)計?這9款經(jīng)典網(wǎng)頁布局設(shè)計了解下