頁面加載速度如何影響網站可見性和提高它的技巧
已發表: 2021-12-28您是否只關注搜索引擎優化 (SEO) 策略的“有形”方面,例如關鍵字和頁面設計? 你的頁面加載時間怎麼樣? 你知道谷歌認為網站加載速度是一個重要的排名因素嗎?
加載速度慢會以多種方式影響您的業務。 其中最重要的兩個是您的排名和轉化能力。 當您網站服務器的響應時間低於兩秒時, Google會減少訪問您網站的抓取工具數量。
在此基礎上,讓我們更深入地研究頁面加載速度如何影響不同的站點參數。
頁面加載速度影響可見度的 5 種方式
1.影響用戶體驗
今天,用戶不會接受網站性能不佳的任何藉口。 他們對網站的加載速度非常挑剔。
如果事實可信,47% 的用戶希望頁面在兩秒內加載完畢。 同時,報告顯示,如果加載時間超過三秒,75% 的訪問者跳出(離開頁面)。
這告訴我們,頁面加載時間的每一秒延遲都會導致客戶大量流失。
Think With Google 的一項調查顯示,跳出率(僅進入一個頁面後離開網站的訪問者的百分比)隨著頁面加載時間的增加而增加。 增加的跳出率還會影響整體用戶參與度和交互指標。
2.它對在線可見性和搜索引擎優化有直接影響
2018 年,移動設備佔網站總流量的 53% 以上。 同年,谷歌正式將移動頁面速度作為排名因素。 從那時起,頁面加載速度變得更加重要。
幾年前,當谷歌宣布專注於移動優先索引時,企業別無選擇,只能針對移動設備優化其網站。 移動性能不佳的網站已經在搜索引擎結果頁面 (SERP) 中排名下降。
簡而言之,如果您的移動頁面速度不達標,您幾乎不可能獲得更高的排名。
3.它導致銷售和轉化率下降或上升
您知道頁面加載時間延遲一秒會使轉化率降低 7% 嗎?
如果您的網站受到低性能的困擾,就沒有辦法解決它——您將損失大量的銷售額。 由於網站速度低而導致的跳出率增加已經趕走了大量潛在客戶,並最大限度地減少了您轉換訪問者的機會。
亞馬遜調查了頁面加載速度對其銷售的影響。 它確定,如果網站的加載時間增加一秒,公司每年可能會損失 16 億美元的收入。 來自Search Engine Journal的數據還報告說, 70% 的消費者認為網站速度對他們的購買決定有重大影響。
因此,通過優化您的網站速度,您可以期待排名、轉化率以及最終銷售額的可觀增長。
4. 危及客戶忠誠度
讓我們重新考慮上面強調的幾點:緩慢的頁面加載速度會趕走消費者並導致較低的轉化率。
除此之外,客戶不太可能重新訪問提供糟糕用戶體驗 (UX) 的網站。 因此,網站速度慢也會影響客戶忠誠度。
事實上, HubSpot表示,80% 對網站低性能不滿意的客戶不會再從該網站購買,這證明加載緩慢的頁面會顯著減少您的重複訂單。 對於電子商務網站來說,緩慢的頁面是一個特別嚴重的損失,其收入在很大程度上取決於重複銷售。
此外, Akamai的研究揭示了企業的另一個重要擔憂:40% 的不滿意訪客與他們的聯繫人分享了他們的負面體驗。 這種負面的社會證明可能會影響整體轉化率和客戶忠誠度。
5.影響網站的自然流量
網站速度低只會導致 SERP 的排名較低。 這也意味著您網站的自然流量會減少。 您是否知道 Google 上的前五名排名佔有機點擊總數的 67.6% ?
如果您的加載不理想,您已經失去了大量的自然流量。 同時,如果未優化移動頁面速度,您將失去移動流量,而移動流量可能佔您潛在客戶的 50%。
理想的頁面加載速度是多少?
自 2015 年推出 Mobilegeddon 更新以來,企業一直將注意力轉向頁面加載時間。 他們還在移動友好性和移動頁面速度方面投入了更多的時間和精力。
但問題是:理想的頁面加載速度是多少,或者多快才足夠快?
根據谷歌的說法,桌面和移動設備的推薦頁面加載時間都少於三秒。 然而,移動設備上所有網站的平均頁面加載時間目前為 22 秒。 Screaming Frog 調查了 20,000 個 URL ,以檢查它們是否通過了 Google 的 PageSpeed 評估。 它發現只有 12% 的移動和 13% 的桌面結果通過了測試。
您還必須考慮到用戶期望電子商務網站的加載時間更快。 Google 的Maile Ohye 在Google 網站管理員視頻中談到了電子商務頁面加載速度。 她說,“兩秒鐘是電子商務網站可接受的門檻。 在谷歌,我們的目標是不到半秒。”
現在,半秒似乎不現實。 但是,如果您是電子商務網站所有者,則頁面加載速度的目標必須是最多不超過三秒。 該基準測試適用於移動和網絡設備。
最新更新:Core Web Vitals
谷歌希望在用戶體驗方面不遺餘力。 這就是為什麼它最近將Core Web Vitals 作為一個重要的排名因素。
這些 Core Web Vitals 與其他重要的 UX 信號相協調,現在會影響排名。 其中一項指標稱為 Largest Contentful Paint (LCP),與頁面加載速度有關。
LCP 是指在頁面上呈現最大內容元素所花費的時間。 這可以是圖像、視頻或任何其他元素。
根據 Google 的說法,頁面上理想的 Largest Contentful Paint 小於或等於 2.5 秒。 2.5 到 4 秒之間的任何時間都需要改進,超過這個時間的任何時間都被認為是差的。
提高頁面加載速度的技術技巧
使用內容交付網絡
減少網站加載時間的最佳做法之一是使用內容分發網絡 (CDN)。 CDN 可以幫助您將站點加載時間從20% 減少到 51% 。
在傳統設置中,您將整個網站託管在一台服務器上。 該服務器處理站點用戶的所有請求。 現在,當您的站點訪問量很大時,請求的數量會顯著增加。 這會增加服務器的負載。 結果,請求處理時間增加,從而延遲了頁面加載時間。
此外,當用戶距離服務器位置越遠時,他們的頁面加載時間就越長。 這是因為數據必須傳輸更遠的距離,從而增加了加載時間。
CDN 可以解決這些挑戰。 CDN 通過在全球服務器網絡上託管您的網站來工作。 所以現在,當用戶發送請求時,數據將從距離他們所在位置最近的服務器路由。
此外,由於您的文件緩存在多個服務器上,這可以節省高達 60% 的帶寬。 現在,單個服務器不必處理所有請求。
減少 HTTP 請求的數量
當用戶請求頁面時,會為每個頁面組件發送一個 HTTP 請求。 雅虎報告說,網絡服務器使用 80% 的頁面加載時間來下載這些組件。 這些包括您的頁面圖像、腳本、媒體、樣式表等。因此,如果有大量頁面組件,頁面呈現時間會增加。
那麼,如何檢查頁面組件的數量以及加載每個組件所花費的時間呢?
Chrome 用戶可以按照以下步驟操作:
注意:使用 Chrome 瀏覽器的開發者工具檢查 HTTP 請求數。
- 右鍵單擊您的頁面,按照“檢查”選項卡進行操作。
- 單擊“網絡”選項卡,拖動左邊框後您將找到該選項卡。
- 在這裡,“名稱”列顯示所有頁面上的組件。
- “大小”列列出了每個相關組件的大小。
- 您還可以通過“時間”欄查看每次加載所花費的時間。
- 請求總數顯示在左下角。
您現在可以檢查無用的元素以及它們加載所需的時間。
您還需要減少 HTTP 請求的數量。 一種方法是縮小和合併網頁文件。 在下一點中找出方法。
縮小和組合 HTML、CSS 和 JavaScript
您的 HTML、CSS 和 JavaScript 文件構成了您網站的外觀和功能。 這些文件構成了 HTTP 請求的重要部分。 因此,當您希望減少 HTTP 請求的數量時,您需要縮小頁面文件。
縮小 HTML、CSS 和 JavaScript 文件可顯著減小它們的大小。 此過程可以更快地加載這些文件。 此外,代碼中有額外的空格、縮進和格式,使頁面變得沉重。
縮小頁面可以幫助您刪除所有這些不必要的元素並使頁面更精簡。
當您擁有基於模板的網站時,它變得更加重要。 基於模板的網站更容易開發,但它們會提供混亂的代碼片段,從而降低網站性能。
縮小是解決這些問題並減小代碼文件大小的正確方法。 除了縮小之外,您還需要合併這些文件以減少文件總數。 所以,如果你有多個 CSS 和 JavaScript 文件,你可以將它們組合成一個文件。 如果 WordPress 為您的網站提供支持,您可以使用 WP Minify 插件或 WP Rocket 插件。
所有這些工具將幫助您輕鬆地縮小和組合 HTML、CSS 和 JavaScript 文件。
不要忘記為瀏覽器緩存添加過期標頭
瀏覽器可以緩存頁面文件的很大一部分。 這些包括您的圖像、JavaScript 文件、動態元素等。
通過啟用瀏覽器緩存,您允許瀏覽器將頁面存儲在緩存內存中。 因此,當您重新訪問此頁面時,它會從緩存中加載,而不會發送 HTTP 請求。
為您的站點利用瀏覽器緩存的一種方法是添加“expires”標頭。
“expires”標頭告訴網絡瀏覽器從緩存中加載頁面。 因此,“過期”標頭僅適用於以前訪問過您網站的用戶。 他們還必須將您的頁面存儲在他們的緩存中。
當此用戶重新訪問您的站點時,“過期”標頭會指示瀏覽器加載頁面的緩存版本。
現在,由於許多頁面組件已經在緩存內存中,它們加載速度更快。 並且瀏覽器隻請求幾個頁面組件,導致頁面加載時間減少。
瀏覽器緩存減少了 HTTP 請求的數量,從而進一步提高了頁面加載速度。
使用異步加載
您可以通過選擇 CSS 和 JavaScript 文件的加載方式來提高頁面加載速度。 CSS 和 JavaScript 文件同步加載和異步加載,您可以決定如何將它們加載到您的網頁上。
顧名思義,當腳本同步加載時,它們會一個接一個地加載。 每個腳本根據其在頁面上的位置遵循加載順序。 另一方面,異步加載時,多個腳本可以同時加載。
當您的瀏覽器加載頁面時,它遵循從上到下的加載模式。
例如:
- 如果瀏覽器遇到同步 CSS 或 JavaScript 文件,它將在進一步移動之前完全加載該文件。 此命令會減慢加載過程。
- 同時,如果遇到異步文件,它會同時開始加載另一個元素。 因此,它不必等待元素完成加載才能進一步移動。
這告訴我們您必須選擇異步加載 CSS 和 JavaScript 文件以實現更快的加載時間。 如果您有一個 WordPress 站點,WP Rocket 將幫助您啟用異步加載。
使用 WP Smush 壓縮您的站點圖像
圖像優化或壓縮對於減少頁面加載時間至關重要。 通常,圖像文件很大,它們會延遲頁面加載時間。 但是,您不能限製圖像的使用或消除它們。 圖片對於網站的用戶體驗至關重要,尤其是對於電子商務網站而言。 根據一項調查,66% 的消費者在購買產品之前需要至少三張產品圖片。
為 WordPress 網站壓縮站點圖像的一種簡單方法是使用WP Smush插件。 該插件在後台工作,在上傳圖像時壓縮圖像。 結果是在不影響質量的情況下縮小了圖像尺寸。
在頁面加載時延遲 JavaScript 文件
延遲 JavaSscript 文件是降低網站跳出率的好方法。 這是在加載其他頁面元素之前降低 JavaScript 文件加載優先級的過程。 JavaScript 文件通常很大,而且它們可能需要更多的加載時間。 通過延遲它們,您可以讓其他頁面元素更快地加載而不會出現任何延遲。
WordPress 站點所有者可以使用WP Rocket 插件簡單地啟用延遲。 您只需要勾選“延遲加載 JS 文件”並保存更改。
對於 HTML 站點,在 </body> 標記上方調用外部 JavaScript 文件。
所以你有它! 為您的網站實施這些技巧,以提高您的頁面速度並提高您在搜索引擎中的可見度。