如何在 WordPress 網站上啟用 GZIP 壓縮? (帶視頻)

已發表: 2021-02-04
Enable GZIP Compression

最後更新 - 2021 年 7 月 8 日

正如我們之前多次討論過的,頁面加載速度是決定您的 WordPress 網站成功與否的一個重要方面。 它在用戶體驗和搜索引擎排名中起著重要作用。 因此,作為 WordPress 網站所有者,您將不得不嘗試多種策略來確保快速的頁面加載速度。 專家推薦的流行策略之一是在您的 WordPress 網站上啟用 GZIP 壓縮。 在本文中,我們將討論更多關於 GZIP 壓縮以及如何啟用它以獲得 WordPress 網站的卓越性能。

什麼是 GZIP 壓縮?

GZIP 是一種文件格式,可以減小 HTML、CSS 和 JavaScript 文件的大小,以便在用戶請求時更快地提供這些文件。 它通常在服務器端完成,有助於顯著減小文件大小。 這是您通常會在 WordPress 網站上看到的基本優化策略之一。

現在常用的所有瀏覽器都支持 GZIP 壓縮,並在發出 HTTP 請求時查找特定的標頭。 如果存在 GZIP 壓縮的特定標頭,瀏覽器將提供尺寸減小的壓縮文件。 這確保您的所有用戶都將受益於 GZIP 壓縮帶來的更快的頁面加載速度。

啟用 GZIP 壓縮的重要性

良好的頁面加載速度是 WordPress 網站的基本要求。 您將不得不嘗試不同的優化策略以確保您的網站的平穩運行。 啟用 GZIP 壓縮相對簡單,因此大多數網站所有者確保已完成。

現在,如果您沒有啟用 GZIP 壓縮,您可能會注意到流行工具在頁面速度測試中出現錯誤。 例如,如果您在您的站點上啟用了 GZIP 壓縮,您將能夠在 GTMetrix 審核中看到“啟用壓縮”的滿分。

啟用 GZIP 壓縮
如果您沒有在 WordPress 頁面上啟用 GZIP 壓縮,大多數頁面速度測試工具會將其顯示為錯誤。

您還可以使用瀏覽器上的開發人員工具檢查您的網站是否啟用了 GZIP 壓縮。 例如,在 Chrome 上,您可以轉到開發人員工具並檢查響應標頭。 在這裡,您將看到“內容編碼:gzip”。 這意味著啟用了 GZIP 壓縮。

啟用 GZIP 壓縮
使用瀏覽器上的開發人員工具確保在您的瀏覽器上啟用 GZIP 壓縮。

如何啟用 GZIP 壓縮?

您必須啟用 GZIP 壓縮以確保某些資源(如 HTML、JavaScript 和 CSS)以壓縮形式提供。 這將確保網頁在您的網站上加載得非常快。 如果有未壓縮的大文件,它們會顯著影響您網站上的頁面加載速度。

要啟用 GZIP 壓縮,您可以按照專家建議的一些常見步驟進行操作。 這裡是其中的一些:

聯繫您的託管服務的支持團隊

GZIP 壓縮是一種常用的網頁優化策略。 因此,許多託管服務默認啟用 GZIP 壓縮。 您可以使用上述策略進行檢查以確保已啟用。 如果您的站點上未啟用它,您可以隨時向您的託管服務提供商提出支持請求。 大多數流行的託管服務提供商都會滿足您的要求。

如果您是 WordPress 初學者並且對管理網站的技術方面感到不自在,那麼這是最好的方法。 一個好的託管服務提供商為您完成這項工作不會有任何問題。

查看一些流行的 WordPress 網站託管服務。

使用插件啟用 GZIP 壓縮

另一個相對簡單的選擇是使用支持 GZIP 壓縮的緩存插件。 此類插件將具有在其設置中啟用 GZIP 壓縮的選項。 如果您的緩存插件無權修改服務器上的文件,您可能仍需要詢問您的託管服務提供商。

以下是一些可幫助您在 WordPress 網站上啟用 GZIP 壓縮的插件。

WP火箭

WP Rocket 是一個強大的解決方案,可以幫助您優化和加速您的 WordPress 網站。 這是一個插件,只涉及最少和簡單的配置步驟,因此即使是初學者也可以輕鬆設置它。 它將有助於壓縮 HTML、JavaScript 和 CSS 文件,以便您的網頁加載更快。

高級功能和強大的支持將 WP Rocket 與其他緩存插件區分開來。
附加的功能

該插件還在以下與優化相關的方面為您提供幫助。

  • 即時激活頁面緩存
  • 預加載緩存以促進搜索引擎更快地索引。
  • 延遲加載圖像
  • 靈活的開發人員級定制。

啟用 GZIP 壓縮

這是一個簡單的插件,如果您的網站在 Apache HTTP 服務器上運行,您可以下載和使用它。 您可以專門使用它來啟用 GZIP 壓縮。 但是,如果您需要一些更高級的優化功能,請考慮高級版本。

高級版功能

除了幫助您啟用 GZIP 壓縮之外,高級版還可以幫助您:

  • 設置文檔過期時間
  • 啟用圖像延遲加載
  • 阻止圖片盜鏈

它還與 WooCommerce 兼容,因此如果您也在經營在線商店,也可以使用它。

PageSpeed 忍者

這是另一個流行的 WordPress 性能插件,可幫助您輕鬆啟用 GZIP 壓縮。 安裝插件後,您可以輕鬆啟用該選項以及其他幾個有助於優化站點性能的選項。

啟用 GZIP 壓縮
您只需在插件設置中啟用壓縮選項即可。

WP 超級緩存

這是另一個可用於壓縮網站文件的插件。 您將能夠在插件設置中啟用此選項。 它還有助於在為用戶提供服務時將動態文件轉換為靜態文件。 這意味著大多數用戶(例如尚未登錄的用戶)將獲得更易於加載的靜態版本。 這將有助於確保網站以最佳狀態運行。

這是最受歡迎的 WordPress 緩存插件之一,具有多種配置選項,您可以根據自己的技術專長進行選擇

W3 總緩存

這個插件將有助於提高搜索引擎排名以及 WordPress 網站的用戶體驗。 它提供了一些高級功能來提高您網站上的頁面加載速度,包括 HTML、JavaScript 和 CSS 文件的壓縮。 此外,它還提供 CDN 集成,以幫助您在為全球客戶提供服務時避免延遲。

W3 Total Cache 是一個完整的軟件包,可幫助您網站性能的整體方面
附加的功能

您將使用此插件獲得的其他一些功能是:

  • 延遲加載以提高頁面加載速度以及用戶體驗。
  • 瀏覽器緩存使用緩存控制來更快地傳遞頁面。
  • JavaScript 按模板分組,嵌入位置控制。
  • 非阻塞 JavaScript 嵌入。
  • WP-CLI 支持緩存清除

編輯您的 .htaccess 文件 (Apache)

如果您的 WordPress 站點上未啟用 GZIP 壓縮,您可以通過編輯 .htaccess 文件來管理它。 您可以使用 FTP 工具在您的根 WordPress 安裝中找到 .htaccess 文件。 找到 WordPress 安裝的 .htaccess 文件後,您可以在# End WordPress標籤下方插入以下代碼。 執行此步驟時要小心,因為錯誤配置的 .htaccess 文件可能會破壞您的網站。

始終建議在進行任何代碼更改之前存儲站點的備份。 以下是創建 WordPress 網站備份的方法。 如果您不確定在 WordPress 網站上進行代碼級別的更改,您可以隨時從流行的 WordPress 維護服務提供商之一獲得專家幫助。

# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml


# Remove browser bugs (only needed for really old browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent

大多數服務器將使用 Apache,並且上述過程適用於這些情況。 但是,如果您使用的是 NGINX 或 IIS,則過程略有不同。

為 NGINX 啟用 GZIP 壓縮

對於 NGINX 服務器,您必須找到 nginx.conf 文件,並添加以下代碼。

gzip on;
gzip_disable "MSIE [1-6]\.(?!.*SV1)";
gzip_vary on;
gzip_types text/plain text/css text/javascript image/svg+xml image/x-icon application/javascript application/x-javascript;

如果您使用 NGINX 服務器,這將有助於在您的網站上啟用 GZIP 壓縮。

IIS 7 用戶的壓縮

如果您使用的是 Microsoft IIS 服務器,則該過程會略有不同。 IIS 使用兩種不同類型的壓縮——動態和靜態。

您可以按照 Microsoft IIS 文檔中的說明啟用這兩種類型的壓縮。

希望本文為您提供了有關如何在您的 WordPress 網站上啟用 GZIP 壓縮的概述。 這是重要的優化策略之一,也是比較簡單的一種。 如果您有任何疑問,請給我們留言。

如果您喜歡視頻版本,請查看以下視頻:

進一步閱讀

  • 頁面加載速度的重要性
  • 提高 WooCommerce 網站性能的策略