如何改進 WordPress 網站上的核心網絡虛擬化?
已發表: 2023-02-09為什麼速度在數字營銷中很重要? 體驗更快呈現時間的用戶更有可能留在頁面上並四處瀏覽。 反過來,這會對您的整體 SERP 排名產生積極影響。 此外,網頁呈現第一個顯示區域所花費的時間也越來越受到搜索引擎的關注。 事實上,幾乎一半的谷歌排名因素都與改善用戶體驗直接相關。 搜索引擎以強調某些排名因素而聞名,包括加載的幾個方面,稱為核心網絡生命力 (CWV)。 除了對排名有直接影響外,您的頁面體驗還可能影響用戶在瀏覽您的內容時的參與度以及他們返回的可能性。
核心網絡生命力的三個組成部分
Google 的算法不斷變化,以推廣高質量、用戶友好的網站,並將不符合其質量標準的網站降級。 這些算法的一部分是核心 Web Vitals,它在最近推出的一系列更新中發揮著重要作用。 Google 與 CWV 的目標是鼓勵開發人員在優化網站性能時更多地關注用戶體驗。
Largest Contentful Paint、First Input Delay、Cumulative Layout Shift——這些是核心網絡生命力的三個組成部分。
- Largest Contentful Paint——最大的內容繪製(LCP)是一個重要的標準,因為網站的視覺感受在很大程度上受到屏幕最大元素的加載速度的影響。 從加載 DOM 內容到用戶在屏幕上看到某些內容(大圖像或文本塊)之間的時間是 CPL 或內容繪製延遲。 它本質上是從用戶點擊(例如,加載頁面)到他們看到某種內容之間經過的時間。 如果您的內容繪製時間超過 4 秒,則可能會對您的 SEO 分數產生負面影響。
- First Input Delay — 首次輸入延遲是指在您單擊某些內容後頁面響應您的輸入的時間。 FID 通常以毫秒 (ms) 為單位進行測量。 例如,當用戶單擊站點元素並等待屏幕更新新信息時,瀏覽器會處理此操作並提供結果。 FID 越短,用戶開始瀏覽您的頁面的速度就越快,您可以在其中保留更長的時間並增加轉化率。 谷歌澄清說,對於高分,它可以容忍 100 毫秒的首次輸入延遲,對於差分,它可以容忍 300 毫秒的首次輸入延遲。
- Cumulative Layout Shift——你是否曾經向下滾動頁面並突然注意到頁面的一大塊在你滾動時向上移動? 累積佈局偏移 (CLS) 是指內容在繪製後在頁面上移動。 結果是您的用戶必須理解和重新分析您頁面的內容,尤其是在有大量文本的情況下。 充分的累積佈局偏移分數低於 0.1,差的低於 0.25。
如何衡量 WordPress 網站的核心網絡活力?
要優化 WordPress 網站的核心 Web Vitals 並確保您的網站以最高效率水平運行,必須配備所有必要的工具來監控、跟踪和分析重要數據點。
谷歌搜索控制台
在測量實際用戶數據後,Search Console 生成 CWV 報告,其中包含分別為網站的桌面版和移動版發現問題的頁面數。 它涵蓋了基於其狀態(差、需要改進、好)的 URL 性能、核心網絡生命力(CLS、FID、LCP)和類似頁面組。 同樣重要的是要注意,如果 URL 沒有足夠的特定指標的報告數據,它將不會包含在報告中。
PageSpeed 洞察力
同時,PageSpeed Insights 可讓您從 Google 抓取工具和用戶的角度查看您的網站,分析您網頁的問題並提供改進性能的建議。 該報告使您可以更好地了解哪些資源導致加載時間增加。 您還將獲得一份報告,其中提供了對頁面的重要見解,並讓您知道如何進行必要的更改。
SE排名
除了上述工具外,SE Ranking 的網站審核還分別為桌面版和移動版提供核心網絡生命力部分。 該工具可能為 SEO 專家提供更多信息,因為它可以檢測您的網站可能存在的任何技術問題。 根據審核結果,該工具會提供網站的整體健康評分和影響其性能的問題列表,以及有關如何解決這些問題的詳細說明和提示。
最常見的核心 Web Vitals 問題及其解決方法
1-服務器太慢
重要的是要記住,並非所有 WordPress 網站都是一樣的。 這可能會導致某些網站的性能比具有相同設置的其他網站慢。 這樣做的原因是許多因素會影響服務器的速度:您安裝的插件數量、腳本和 CSS 的數量、服務器位置等。
但是,有專門針對 WordPress 網站優化的主機。 由於緩存軟件,它們通常具有更快的加載速度,並且可以處理許多訪問者。 這樣的託管可以管理許多技術問題,並且有許多預裝的插件。 因此,您可以只創建一個或多個網站,讓 WP 託管為您完成所有技術工作。
2- 大圖片和視頻
當您在網站上工作時,需要運行核心 Web Vitals 測試,您可能會看到一些與圖像和視頻相關的問題。 頁面速度慢的根本原因是圖像和視頻過重。 “多少兆字節太多了”這個古老的陳詞濫調問題最近肯定會在核心網絡生命力的世界中出現。 更具體地說,出現了應該如何優化站點對圖像、視頻和其他大文件的使用的問題。
經驗法則是有一個主要圖像和視頻大小,然後在圖像和視頻元素中包含寬度和高度屬性。 通常最好在上傳圖像之前將圖像自定義為特定寬度,並創建一個新的圖像元素來切掉背景、不必要的文本等特定區域。網上有許多免費的圖像編輯應用程序,可讓您裁剪和調整照片大小. 顯示較大圖像的問題是下載大小和顯示它們可能需要的帶寬較大。
這同樣適用於視頻 - 預定制視頻可以顯著提高頁面速度,因為瀏覽器不需要縮小 - 視頻可以正常尺寸播放。 此外,由於原生視頻很重,您可以將它們替換為 Youtube 嵌入,這會大大加快網站速度。
使用延遲加載是在不影響用戶體驗的情況下提高頁面速度的另一種好方法。 延遲加載是一種僅在圖像進入視口(或屏幕部分)時才加載圖像的技術。 這種方法會導致圖像在您滾動時逐漸加載,從而提高頁面速度。 最好的部分? 使用像 Lazy Load 這樣的 WordPress 延遲加載插件來實現是基本的。 這將顯著改善用戶體驗。 用戶不必等待頁面加載。 滾動幾下後,圖像將自行加載。
3- 非優化代碼
未經優化的代碼可能會損害您的核心網絡生命力得分,例如 First Contentful Paint 和您的用戶體驗。 這裡最大的罪魁禍首主要是 JavaScript。 因為它必須在頁面加載後下載並執行。 (JavaScript 在 HTML 之前出現,HTML 會阻止頁面加載)。 這很容易導致屏幕凍結幾秒鐘,尤其是在用戶的連接速度不快的情況下。 因此,如果 JavaScript 沒有優化,您的網站可能會失去性能點。 為確保在加載 JavaScript 之前頁面不會被阻止加載,您可以使用 async 和 defer 標籤。 此外,從代碼文件中刪除不必要的元素是一種很好的做法。
代碼縮小從代碼中刪除了不必要的註釋、空格和換行符。 這可以幫助您減小文件的大小,從而加快訪問者瀏覽器的下載速度。 這樣做有兩個原因。 首先,它可以讓您的訪問者更快地下載。 其次,它使它更小,因此它使用更少的服務器資源。 您可以輕鬆縮小的一些文件包括 <style> 和 <script> 文件。 您可以通過比較優化前後的文件來測試自己。 對於樣式表或 JavaScript 文件,結果可能不是很明顯。 這是因為 CSS 和 JS 壓縮工具,如 YUI Compressor、Minify 等,在優化這些類型的文件方面比壓縮插件做得更好。
DOM(文檔對像模型)是文檔中所有元素的層次結構。 DOM 由 HTML 標籤組成,這些標籤具有 CSS 樣式和與之關聯的 JavaScript。 因為元素的數量可能非常多,所以頁面的大小會很大。 如果您將頁面提供給移動設備,這可能會導致性能問題。 因此,盡量減少元素數量並優化它們在文檔中的位置非常重要。
4-佈局轉變
佈局偏移是一種在訪問者的瀏覽器窗口調整大小時發生的現象。 您網站的元素,例如圖像、字體和顏色,可以放鬆或改變位置。 這使讀者很難將注意力集中在您要呈現的內容上。 Layout Shift Score 是一個分數,用於跟踪您的站點受設備佈局更改影響的程度。 在談論視口時,這是一件非常重要的事情。 因為如果您的設計變化太大,您可能會失去訪問者和轉化。 盡量減少佈局變化並儘可能優化它們將導致更少的流失,並最終增加頁面瀏覽量。
此外,重大的佈局變化可能會對您的 SEO 工作產生負面影響。 然而,設計大型佈局可能難以維護。 這是因為除非您專門使用響應式設計來設計網站。 因此,需要調整佈局以適應所有設備。 必須定期執行此操作可能很耗時。 它需要持久性和一致性才能在不影響質量或功能的情況下取得成功。 這就是為什麼最好的解決方案是讓您的網站設計具有響應性。 響應式屏幕會根據查看它們的屏幕尺寸調整大小。 實施響應式屏幕意味著您的網站將進行調整而不會減慢或崩潰。
5-緩存問題
構建Web資源時,針對不同的資源使用不同的緩存策略。 緩存策略定義每個資源將如何被緩存,並提供有關資源應該被緩存多長時間的信息。 您需要設置這些策略。 這樣就可以重用 Web 資源,而不必在用戶每次訪問它們時都從頭開始創建它們。 要提高性能,請務必確保您的服務器不會浪費時間創建已創建的資源。 借助服務器端腳本技術,您可以利用此策略。 確保永遠不會重新創建重要資源,除非其中發生了某些變化。
Signed exchange (SXG) 是一項新舉措,能夠以保護隱私的方式從 Web 預取內容。 已簽名的交換包含網站希望預取哪些資源的規範。 此外,確保安全地獲取這些資源(不洩露私人信息)。 signed exchange binary 格式是一種資產轉移格式。 這意味著內容將通過 HTTPS 傳輸並附加一個額外的標頭。 這是一種使 Google 搜索能夠提高頁面加載性能的令人興奮的新方法。 特別是在 AMP 頁面或依賴外部資源的任何其他類型的頁面上。
結論
Core Web Vitals 是 Google 開發的三個指標,用於對用戶加載網頁的體驗進行評分。 三個核心網絡生命力對於了解頁面加載速度至關重要。 瀏覽器對用戶輸入的響應程度,以及內容在瀏覽器中加載時的不穩定程度。 緩慢的加載時間會影響訪問者是否會留在您的網站上。 他們可能會完全離開或花更少的時間與您在網站上的內容互動。