如何實現移動優先

[ad_1]

如何實現移動優先

如果您不斷更新有關SEO的最新信息,您可能會知道Google的移動優先計劃。

在2015年首次被稱為「 mobilegeddon」時,將客戶網站轉換為完整的移動體驗已成為世界各地SEO的首要任務。

針對移動設備進行優化不僅僅是設計。這是一門完整的學科,旨在創建可以在各種設備和屏幕解析度下顯示的網站。

而且,不要忘記,其中也涉及SEO因素!

隨著Google的關注點轉向移動優先,現在確保對移動平台進行全面優化的網站至關重要。

如果不這樣做,您很可能會失去Google的移動優先索引帶來的重要流量。

2018年三月,Google宣布已開始推出移動優先索引作為所有新域的默認索引。這意味著Google索引現在主要是移動的。

在依賴於點(m。)子域上單獨移動站點的行業中,如果您希望與Google SERP競爭,則必須取得一定的進步。這是一項至關重要的決定,不應該掉以輕心。

您可能會問:

  • 我需要考慮哪些要素?
  • 如何為移動用戶設計?
  • 我需要做什麼以確保我的網站與這些更新兼容?

好的,您很幸運,因為我們掌握了可能對成功實現以移動設備為先的實施有用的信息。

您必須考慮的移動設計因素

毫無疑問,如果您希望成功實現移動SEO實施,則設計和UX(用戶體驗)是至關重要的因素。

從移動菜單到可識別的設計模式,這些元素對於促進成功的轉換至關重要。

通過確保以這種方式設計網站,您可以對移動網站充滿信心地繼續進行搜索廣告系列。

自上而下的移動設計方法比較可取

在移動設備上進行開發需要以移動設備為先的思維方式。自上而下的方法是一種與這種「移動優先」的思維方式相適應的方法。

這種方法意味著最終版本的創建需要大量的計劃。每個細節都經過仔細的計算和測量,因此您的移動網站看起來不像是固定的工件。

自下而上的方法恰恰相反。開發是逐模塊進行的,整個過程沒有太多的計劃或思想。

可以想像,使用自下而上的方法創建移動站點是災難的根源。

為了獲得最佳效果,請使用自上而下的方法來考慮設計中從最小到最大的所有內容。

移動菜單

移動菜單應該是用戶友好的,記住較小的設備,並且不應與桌面上的導航100%相同。

雖然結構不會改變,但視覺元素會改變,其外觀將取決於您的設備。

為導航創建可識別的設計模式對於實現真正的以UX為中心的設計至關重要。這並不意味著複製您之前完成的所有設計模式。

相反,您必須創建聽眾確定的可識別圖標和元素。

別忘了「為胖手指設計」或觀眾最大的手指。

確保根據這些因素設計元素,將產生一種體驗,可滿足您的用戶及其對UX的需求,以促進更好的轉換和更易於使用的網站。

無縫設計勢在必行

創建無縫設計意味著您要在所有設備上創建設計元素,無論平台如何。

這與響應式設計不同,我們將在下面介紹。即使它們確實有一點重疊。

如果創建了將台式機和移動設備相結合的自適應設計,則無縫設計是指移動設計元素。

當您擁有無縫的設計元素時,它們在其他屏幕尺寸上不會出現不同。例如,台式機上的紅色按鈕不會在移動設備上顯示為藍色按鈕。

或者,號召性用語在移動設備上的顯示形式與台式機設備沒有什麼不同。

不同的元素只會使用戶感到困惑,並且如果他們在某些情況下在設備之間移動,這隻會使他們感到困惑。

考慮更大的任務及其流程

您上次訪問移動應用程序的時間是什麼時候才發現,與網站本身相比,完成操作的過程是噩夢般的?

當移動Web開發的監督遠離站點負責人時,就會發生這種情況,範圍的蔓延和錯誤的判斷使工程成功完成應用程序的途徑蒙上了陰影。

如果您的移動網站上的結帳過程對用戶來說是噩夢般的,那麼您就可以告別這些轉化了。

請勿在移動屏幕上添加小動作。相反,您必須確保您的主要動作是可見的,並且明顯易於執行。

如果您的用戶不得不四處尋找信用卡付款,或者他們不得不努力尋找其他東西,他們將放棄購物車。

確保他們至少也可以保存自己的位置。移動設備主要用於旅途中,用戶必須能夠以某種方式保存其進度。

創造移動體驗而沒有選擇來保存您的位置,只會激怒和煩人,僅此而已。

避免強制註冊

應避免強行登錄的登錄牆。當您的應用程序在進入應用程序本身時立即顯示登錄牆時,就會顯示這些牆。當您強制用戶註冊時,您不會在用戶之間贏得商譽。

強迫用戶進行註冊可能會導致他們的煩惱,並使他們不喜歡您的移動體驗。

這樣做會導致信譽下降,以及人們希望使用的服務信譽。

您是什麼時候第一次對應用程序的登錄牆感到沮喪,而只是選擇不使用它?

使返回首頁變得簡單

一個簡單的返回首頁的圖標是一種創建指向站點首頁的輕鬆鏈接的好方法。

如果您不方便用戶返回首頁,那麼他們很可能會放棄您的網站而選擇另一個。

移動用戶並非像我們一樣都是聰明的SEO。

他們需要幫助弄清楚事物在您的移動網站上的位置,直到他們對它熟悉為止。

創建歧義只會導致不良的UI,從而導致較少的轉換,因為用戶無法理解事物的位置。

僅僅因為您了解您的行業,並不意味著您的客戶也以同樣的方式了解它。

使用正確的布局

為移動設備創建布局有其自身的挑戰,但是只要您了解幾件事就可以完成。

首先,您必須知道觸摸屏設備上的目標將要執行的操作以及它們將如何起作用。

設計合適的手指大小非常重要,因為這意味著您的用戶將能夠使用您的移動網站設計。

土坯 推薦 您在設計移動觸摸目標時要考慮以下尺寸:7-10mm。他們的論點是,這種大小「使手指能夠毫無太大障礙地瞄準和觸摸目標」。

此處的總體目標是使移動輔助功能比以前容易得多,並且用戶易於使用您的網站。

不要忘了文字大小!

另一個設計考慮因素是文本大小。

不僅必須考慮導航元素的文本大小,而且頁面上常規文本內容的大小也很重要。

如果沒有清晰可辨的高質量文本,您可能會失去讀者。而且,您將無法有效地進行交流。

通過包括適合您的移動網站應用程序的正確文本大小,它將使讀者留在您的網站上,從而幫助您留住讀者。

不要讓諸如文字大小之類的簡單事情阻止您吸引觀眾並與他們互動。

您需要考慮文本的顏色對比度。

這是可訪問性點,因為對比率越差,您就越會排除某些類型的閱讀器(尤其是那些色盲的閱讀器)。

使用網站 色彩對比檢查器工具在這裡 確定您選擇的顏色是否達到您要達到的級別所定義的最小可訪問性閾值。

土坯 推薦 4.5:1的對比度。

進一步了解 W3C顏色輔助功能指南 有關顏色對比度的更多信息。

Google Mobile SEO注意事項

除了設計外,Google的移動優先索引還有SEO注意事項,尤其是當您要轉移到移動優先時。

注意事項包括:

  • 頁面速度。
  • 跨平台。
  • 跨顯示器兼容性。
  • 不包括彈出式窗口或插頁式廣告。
  • 移動內容。
  • 適當的圖像優化。

Google的「移動優先」索引僅包含移動結果

很久以前,Google的「移動優先指數」就同時體現了台式機和移動設備的結果。

如果有人從桌面執行搜索,他們將獲得桌面的過濾結果。

如果有人在移動設備上進行搜索,他們將顯示符合移動設備的搜索結果。

這已不再是這種情況。自Google進行移動優先更新以來,所有搜索結果都是使用索引頁的移動版本來確定的。

這裡的考慮很關鍵,因為它將影響您為移動設備創建內容和設計的方式。

Google將移動設備視為什麼

要採取正確的策略來應對移動SEO世界,我們必須首先確定Google認為什麼是移動設備。他們是否將所有攜帶型設備都視為移動設備?

不,他們沒有。

在Google的 Web開發人員針對移動設備的準則,他們提到以下內容:

「移動設備」:在本文檔中,「移動設備」或移動設備是指智能手機,例如運行Android,iPhone或Windows Phone的設備。移動瀏覽器與台式機瀏覽器相似,儘管它們的屏幕尺寸較小,並且在幾乎所有情況下,其默認方向均為垂直,但它們可以呈現一系列HTML5規範。

平板電腦:我們將平板電腦視為同類產品中的設備。當我們提到移動設備時,通常不是指平板電腦。平板電腦往往具有更大的屏幕,這意味著,除非您提供針對平板電腦進行了優化的內容,否則您可以假設用戶希望看到您的網站,就像在台式機瀏覽器而不是智能手機瀏覽器上看到的那樣。」

如您所見,採用響應式設計方法是更可取的,因為它針對所有移動設備,並且滿足了Google對移動友好的要求。

這就是自上而下的方法如此重要的原因。它考慮了所有潛在的設備,而不只是一兩個。

確保您的內容相同

您的內容在台式機和移動設備上必須相同。

您可能想知道更長的內容是否更適合兩者之一。

您可能會驚訝地發現,根據此案例研究,人們實際上會在移動設備上閱讀較長的內容:

長格式內容移動案例研究「 width =」 280「 height =」 495「 srcset =」「 src =」 https://cdn.searchenginejournal.com/wp-content/uploads/2020/02/long-form-content- mobile-case-study-5e58cdd69a53d.png

這個 案例分析 還顯示以下內容:

「數據還顯示,雖然短新聞內容比長篇新聞更為流行,因此吸引了更多的總訪問量,但長篇文章的訪問率幾乎相同。所研究的文章中,完全有76%的篇幅少於1,000個字。但是,從文章到文章,長篇故事以幾乎與短篇小說相同的速度吸引了訪問者:每篇長篇文章有1,530個完整的交互,而每篇短篇文章則有1,576個交互。

如果您在桌面設備上所擁有的內容與在移動設備上所擁有的內容不一樣,那麼您可能會成為偽裝或其他操縱性SEO策略的受害者。

如有疑問,請始終在兩個平台上使用相同的內容。

確保Google能夠抓取一切

對於某些網站,robots.txt文件中可能有許多被阻止的資源。

這些資源包括JavaScript,CSS以及您可能不想索引的其他類型的文件。

如果沒有適當的開發監督,您可能會很快忽略這些類型的文件。

對您的robots.txt文件進行分析,並確保它沒有阻塞太多關鍵資源。

這些資源都會影響渲染,爬網和索引編製。

為了充分利用您的移動網站,您必須確保您的網站可以完全爬網,並且可以被Google移動訪問。

就像Google的Gary Illyes所說:「讓該死的網站可抓取!」

在您受到處罰之前,先解決煩人的插頁式廣告

您是否知道插頁式廣告?

您可能不知道它們是什麼,特別是如果您遇到它們時。

您知道嗎,出現在移動設備上的廣告會屏蔽該頁面?

似乎不想停止廣告,或者讓您點擊以擺脫煩惱的廣告?

這些稱為插頁式廣告或模塊化彈出廣告,它們會在手機窗口中不經通知地顯示。

它們會阻止您的觀看體驗,有時會迫使您單擊廣告。

Google已推出了 插頁式罰則,一直追溯到2017年。

為確保您不會違反這方面的Google準則,必須確保:

  • 網站沒有隱藏廣告內容。
  • 彈出窗口是有目的的。
  • 插件(如果使用WordPress)(符合Google插頁式廣告指南)。

測試您的移動設計並根據需要進行調整

設計完成後,最好使用以下測試程序進行測試 瀏覽器堆棧

該程序將允許您在儘可能多的不同平台上查看移動站點,從而提供傳統分析無法獲得的直接反饋。

建立測試方法將使您能夠提高效率並發現設計問題,然後再將其變成對您的客戶而言的問題。

您還可以將Web Developer Toolbar擴展用於 火狐瀏覽器 直接在瀏覽器中測試您的移動設計。

頁面速度至關重要

更快的移動網站應該是您的最終目標。

現在,以前所未有的速度來優化頁面速度必須成為優化策略的主要內容。

有許多方法可以在您的網站上實現最低的頁面速度。

Adobe Photoshop的網路無損圖像壓縮功能非常強大,您可以使用它來物理調整圖形大小和處理圖像。

調整身體大小和仰卧起坐有什麼區別?

在物理上調整圖像大小時,僅調整寬度和高度尺寸。您的像素密度保持不變。

因此,您最終得到的是較小的圖像,但是由於有一個300 MB的圖像,因此頁面大小仍將為300 MB。

處理圖像是指降低圖像的物理像素密度。 Adobe Photoshop的無損圖像壓縮同時針對這兩者,因此您必須選擇適當的設置。

如果您有WordPress網站,請使用名為 US 可以同時為您做這兩個事情,從而最終生成的圖像載入速度足以滿足移動設備的需求。

測試您的網站的頁面速度

評估網站的頁面速度並根據需要進行調整是優化過程中的另一個關鍵點。

在這裡使用工具,您可以只測試頁面速度,並進行必要的更改以滿足他們的建議。

Google移動頁面速度測試工具「 width =」 760「 height =」 393「 Size =」(最大寬度:760px)100vw,760px「 srcset =」 https://cdn.searchenginejournal.com/wp-content/uploads/ 2020/02 / google-mobile-page-speed-test-5e58f7f9af268-768x397.jpg 768w,https://cdn.searchenginejournal.com/wp-content/uploads/2020/02/google-mobile-page-speed-test -5e58f7f9af268-480x248.jpg 480w,https://cdn.searchenginejournal.com/wp-content/uploads/2020/02/google-mobile-page-speed-test-5e58f7f9af268-680x351.jpg 680w,https:// cdn .searchenginejournal.com / wp-content / uploads / 2020/02 / google-mobile-page-speed-test-5e58f7f9af268-1024x529.jpg 1024w,https://cdn.searchenginejournal.com/wp-content/uploads/2020/ 02 / google-mobile-page-speed-test-5e58f7f9af268.jpg 1044w「 src =」 https://cdn.searchenginejournal.com/wp-content/uploads/2020/02/google-mobile-page-speed-test- 5e58f7f9af268-768x397.jpg

定期測試您的網站可以使您隨時了解您的Web開發人員或團隊中其他任何成員的最新更改。並且,它將幫助您控制頁面速度瓶頸。

如有疑問,請務必進行測試!

以移動優先的方式獲取您的網站需要時間

毫無疑問,確保您的網站完全兼容移動設備是一項及時且昂貴的工作。

通過使用上述原理並致力於整合完整的「移動優先」的理念,可以使您的網站處於移動狀態。

僱用有能力的開發人員是第一步。接下來是自上而下的方法,以確保您網站的移動SEO拼圖的所有部分都能正確組合在一起。

確保堵塞瓶頸並且不會再出現其他問題至關重要,同時還要實施可靠的移動元素設計,以使您的消費者滿意。

儘管面臨挑戰,但在當今Google移動優先索引時代,將您的網站置於移動優先平台上至關重要。

在跳入項目管理部分之前,您必須通過閱讀儘可能多的主題資源來保持最新狀態。

只要您僱用可以為您的網站進行編碼的合適的開發人員,只需進行表面概述即可。

無論您是SEO還是剛熟悉所有運動部件的人,都必須確保正確完成所有移動設備優化任務。

您的SERP效果會多次感謝您。

圖片積分

特色圖片:作者創作,2020年2月

相關文章