優化電子商務網站速度的 11 種方法

已發表: 2018-05-24

作為電子商務企業,優化網站性能應該是您的首要任務之一。

這是因為您的轉化直接受頁面加載速度的影響。 今天的消費者期望網站速度極快。 如果您的在線商店因任何原因運行緩慢,您將面臨失去客戶並最終失去收入的風險。

Aberdeen Group 2016 年的一項研究表明,實際上,如果頁面加載時間延遲 3 秒,您將失去 20% 的訪問者。

有多快? 根據數字績效管理公司 Dynatrace 的數據,平均而言,2017 年黑色星期五至 1 月 3 日期間運營的全球零售網站在視覺上是完整的,並且可以在 2.5 秒內使用。

以下是確保您的網站針對速度進行優化的一些關鍵方法:

1.限制DNS查找次數

每次您的電子商務網站加載時,瀏覽器都需要找到與您的域名對應的 IP 地址。 這稱為 DNS(域名系統)查找。

瀏覽器需要查找您的主域以及頁面上來自外部源(例如 Twitter 提要或嵌入的 YouTube 視頻)的任何域。 因此,減少對站點上外部源的查詢次數將最大限度地減少客戶端需要進行的不同 DNS 查找,這可能會延遲頁面的初始加載。 例如,您可以將它們託管在您的服務器上,而不是超鏈接到圖像。

您還可以尋找更快的 DNS 提供商,更改 TTL(生存時間)值以利用 DNS 緩存,或將盡可能多的資源移動到內容交付網絡(稍後會詳細介紹)。

2. 投資於更好的虛擬主機查找

可靠、快速的網絡託管是您網站速度的關鍵因素。 並不是所有的網絡主機都是平​​等的。 您需要找到一種可以處理網絡流量和交易高峰的服務(例如在大型產品發布期間或黑色星期五到網絡星期一期間)。

對於電子商務網站來說,沒有比訪問者無法訪問更糟糕的命運了。 良好的託管服務將保證 99.5% 或更高的正常運行時間。 優質主機將承諾高達 99.99% 的正常運行時間。

毫無疑問,您需要 SSL 認證和專用 IP 地址。

3. 壓縮你的照片

圖片佔網站總重量的 50-75%,但令人驚訝的是,排名前 100 的電子商務網站中約有 45% 不費心壓縮他們的圖片。 他們應該,你也應該。 您可以選擇無損壓縮,在不降低質量的情況下減小文件大小。

您應該始終在代碼中設置圖像尺寸,以便瀏覽器在移動到頁面上的其他元素之前無需等待圖像完全呈現。 它只會留下一個帶有預設尺寸的盒子,並繼續加載站點。

在 Photoshop 中壓縮您的圖像或使用圖像壓縮器,例如 TinyPNG 或 Kraken.io。

4. 優先加載首屏

由於您網站的頂部將是您的訪問者首先看到的內容,因此“首屏”加載的速度比網站的其他部分更快是有意義的。 此過程的另一個術語是延遲加載。 它特別有助於加快單頁、大量圖片的網站,這些網站已成為許多品牌的流行設計選擇。

有關如何啟用延遲加載的說明,請轉到此處。

5. 緩存你的頁面

緩存允許瀏覽器緩存全局元素,而不是強迫用戶在每次訪問時下載每個頁面的每個組件,因此只有新元素需要瀏覽器請求。

緩存可加快加載時間,因為瀏覽器會存儲站點搜索索引、目錄信息、用戶信息、側邊欄塊、佈局說明和翻譯文件等頁面元素。 這些元素通常在每個頁面上都保持不變,因此每次訪問者單擊新頁面時,瀏覽器都不需要請求這些資源。

要啟用瀏覽器緩存,您需要編輯 HTTP 標頭以為某些類型的文件設置更長的到期時間。 以下是 Google 開發人員的一些建議。

6. 減少 HTTP 請求

大約 80% 的網站響應時間用於下載前端元素,例如圖像、樣式表、腳本、Flash 元素等。減少元素數量可以減少完全呈現頁面所需的 HTTP 請求數量.

最簡單的方法就是讓您的網站在設計上更簡單。 但在許多情況下,這不是一個可行的選擇。 您可以使用 CSS 精靈和圖像映射將多個圖像組合成一個圖像,從而減少圖像請求的數量。 您還可以將所有樣式表合併到一個文件中,也可以將所有 CSS 合併到一個樣式表中。

7. 使用 Gzip 壓縮

當訪問者訪問您的站點時,會向您的服務器發出請求以傳送文件。 文件越大,到達瀏覽器所需的時間就越長,這是有道理的。

Gzip 壓縮允許您的服務器在將站點文件返回到瀏覽器之前對其進行壓縮,從而大大減少了傳輸時間。 事實上,gzip 可以將頁面和样式表的大小減少 90%!

通過 Web 服務器配置啟用壓縮。 每個 Web 服務器都有不同的說明。 請按照此 Google 教程了解更多詳細信息。

8. 利用內容交付網絡

如果您是一家擁有來自世界各地的訪問者的全球電子商務企業,那麼您絕對應該使用內容交付網絡來優化您網站的性能。 CDN 的工作原理是在全球範圍內傳播服務器節點,以便您的站點訪問者可以在最近的節點下載緩存資源,從而提高效率並減少加載延遲。

CDN 提供商擁有比您可能擁有的更大的網絡管道、位於世界各地的更多服務器以及網絡對等功能。 此外,他們擁有專門的團隊,不斷監控和優化他們的基礎設施。

選擇正確的 CDN 可能很棘手。 從本指南開始。

9. 縮小你的代碼

縮小是從源代碼中刪除所有不必要的字符(例如空格和行)而不影響其功能的過程,從而允許瀏覽器更快地加載頁面。 該過程涉及 HTML、CSS 和 JavaScript 文件,可以大大加快加載時間。 縮小既減少了文件的大小,也減少了所需的文件數量。

按照這些資源清理您的代碼並使瀏覽器更容易呈現您的頁面。

10. 使用異步加載

當瀏覽器加載頁面時,它會從上到下移動。 您可以通過允許同時加載 CSS 和 Javascript 等腳本來加快速度。 這稱為異步加載。 如果您的腳本是同步加載的,它們會按照它們出現在頁面上的順序加載,這可能是一個較慢的過程。

按照本指南對如何啟用異步加載有一個基本的了解。

11. 持續監控您的網站速度

最後,我們將從我們開始的地方結束:您需要將網站性能作為每一天的優先事項。 這意味著您需要不斷監控您的網站是否存在問題,並尋找優化速度和效率的方法。

Google 的 PageSpeed Insights 提供了一個很好的工具來分析您的網站在移動和桌面上的速度。

Pingdom 提供了另一個用於檢查站點速度的出色工具。

請記住這條經驗法則:您的網站加載時間每延長一秒,您就會失去 10% 的訪問者。 哎喲。