每次您導航到新網頁時,無論您是在打字臉書網手動進入網址列或點擊您在瀏覽器中加入書籤的參考文章,您將體驗到實際的頁面載入速度。
有時它發生在眨眼之間,而有時這個過程會一直拖到您開始點擊「刷新」以希望使頁面顯示得更快。那麼,作為行銷人員,您如何保證您的網站不會陷入「不耐煩地刷新,然後跳出」的類別?
我希望有一個更簡單的答案,但頁面效能 卡塔爾電話號碼數據 實際上是一個相當複雜的野獸。大多數人都知道頁面越大,載入所需的時間就越長,但其實還有更多的內容。
什麼是頁面載入速度?
頁面載入速度是指從將 URL 輸入瀏覽器到網頁完全顯示之間頁面完全載入所需的平均時間。
頁面載入速度很重要,因為它有助於使用者體驗。每個人都希望網路或多或少是即時的。如果您的內容載入時間過長,則會增加網站訪客離開您的網站而轉向另一個載入速度更快的網站的風險。
我們看到之間有直接相關性跳出率和頁面載入速度。經驗法則是您的頁面應在三秒內載入;兩秒鐘是理想的,但如果您的網頁需要三秒以上才能加載,則需要一個充分的理由。
例如,有一些體驗式網站的重點是創建可能需要更長時間的豐富體驗,在這種情況下,他們將有一個負載指示器來讓訪客了解頁面的進度。
然而,普通的行銷網站不應該花費那麼長的時間,而由於頻寬較低和受眾耐心較差,將行動網站保持在 2-3 秒的時間範圍內就顯得尤為必要。
此外,Google將頁面載入速度納入排名,因此您應該在您的網站中考慮這一點。搜尋引擎優化策略。
雖然頁面載入速度不是網站規劃階段的首要任務,但在您創建了一個呈現您需要的所有內容的介面之後,確保介面容納其包含的內容並滿足買家角色的所有需求是第一位的在某種程度上,您的買家角色會想要消費它,那麼您可以看看如何優化頁面速度。
頁面速度優化需要考慮的 4 件事
1. 頁面大小
頁面大小是頁面的總下載大小(以 MB 為單位),並且可能是 New Breed 在檢查不良頁面效能時考慮的首要因素。通常,圖像和影片是大頁面的主要貢獻者。
為了解決這個問題,我建議透過運行您在網站上放置的每個圖像小PNG工具。根據我的經驗和測試,它是最好的圖像壓縮演算法,如下圖所示。
汽車-500x500-photoshop
(500x500 Photoshop 另存為 JPG,品質「10」= 92KB)
汽車-500x500-tinypng
(500x500 TinyPNG JPG = 35 KB)
正如您所看到的,視覺品質沒有明顯下降,但文件縮小了 61%!
對於視頻,我們建議使用Adobe 媒體編碼器或者手煞車,但兩者都需要一些專業知識來平衡壓縮和品質。
從計劃到發布日,透過我們的網站重新設計指南了解如何使您的下一個重新設計專案取得成功。
2. 託管(伺服器回應時間/CDN/吞吐量)
託管對頁面載入速度的影響與網頁上的程式碼或資產無關,並且由給定網站的實際託管基礎設施決定。就像舊電腦可能需要三分鐘才能啟動而新型號只需一分鐘一樣,相同的程式碼可能具有不同的載入速度,具體取決於其託管方式和位置。
伺服器回應時間是請求(在網址列中輸入 URL 後點擊「回車」)與伺服器傳輸第一個資料位元組之間的延遲。如果您正在導航到某個網站,並且瀏覽器完全空白(也就是說,根本沒有載入任何內容),則表示伺服器回應時間很慢。
一旦頁面開始出現,CDN 和吞吐量就開始發揮作用。
內容交付網路 (CDN) 是指將網站資源(圖片、腳本等)從託管的 Web 伺服器透過全球路由點傳送到最終使用者的方式。
如果您在地理位置上靠近 Web 伺服器(例如,如果您住在佛蒙特州且 Web 伺服器位於佛蒙特州),則該網站將透過幾個躍點或路由點傳輸到您的電腦。但是,如果 Web 伺服器位於佛蒙特州,而您住在南非,則內容必須跨越更多路由點才能到達您。
第三個要素是吞吐量,它確保連線建立後頻寬保持寬,從而以穩定的速率接收資料。如果沒有發生這種情況,頁面可能會開始快速加載,然後在完成時出現延遲。
3.HTTP請求
超文本傳輸協定 (HTTP) 請求由網站需要載入的單一資產的數量組成。頁面不是單一文件。每個圖像、腳本、樣式表等都是自己的文件,因此是對 Web 伺服器的單獨請求。所有這些元素之間最多可以有 100 個載入請求。
包含大量模組的長頁面通常比短而簡單的頁面需要更多的請求。然而,我們的經驗法則是盡量不要超過 100 個連接,如果可能的話,盡量控制在 70 個左右。
減少這些數字的主要策略是盡可能結合 JavaScript 和 CSS,檢查單一頁面上需要多少模組類型和圖像,並準確考慮需要哪些第三方行銷腳本(廣告追蹤、分析、聊天、熱圖、 ETC)。
4. 載入順序
載入順序是發出 HTTP 請求的順序。此順序由文件物件模型 (DOM) 中的程式碼順序決定,在網站的情況下是 HTML 標記。
您需要從 CSS 開始,否則內容將顯示為黑白、無格式,然後隨著您的設計載入而變更。從 CSS 開始確實會減慢載入過程,但不先載入它會對使用者體驗產生不利影響。
在 CSS 之後,您應該載入其餘的 HTML 和內容,並以 JavaScript 結束。
為了優化加載速度,您還可以推遲某些元素(例如圖像)的加載,這樣它們就不會完全加載,直到用戶需要它們為止。當您閱讀一篇冗長的文章時,您可能會注意到這種情況發生,並且當您第一次向下滾動到圖像時,圖像看起來很模糊,但一旦它們清晰地出現在您的視線中,它們就會變得清晰。
此外,將 JavaScript 放在頁腳中。 JavaScript 通常會影響頁面上的其他元素,因此無論如何其他內容都需要先呈現。此外,如果您的 JavaScript 在頁面上較高,則會產生「渲染阻塞」問題,這意味著它將要求瀏覽器完全載入它,然後才能繼續處理文件的其餘部分。
如果出於某種原因您確實需要在頁面的早期載入 JavaScript,請非同步載入它,這樣在 JavaScript 完成時文件的其餘部分將繼續載入。
為了讓您了解您的網站的表現(以及您的競爭對手的表現),我們建議使用以下工具:
谷歌頁面速度洞察
Pingdom 網站速度測試
網站評分器
外賣
除了考慮內容、設計和轉換策略之外,考慮頁面載入速度也很重要。
根據 吻計量學,大約 47% 的網站用戶預計網站應在兩秒或更短的時間內加載,而如果加載時間超過三秒,驚人的 40% 用戶會跳出。這與以下事實略有矛盾:找到平多姆2018 年在其平台上執行的數百萬次測試的平均載入時間為 3.21 秒。
無論如何,您應該將頁面加載時間控制在兩秒或更短,因為頁面加載速度會影響用戶體驗(尤其是在頻寬通常較低的行動裝置上)並影響您的 SEO 排名。