• 主頁
  • 文章
  • 軟件
  • 如何修復緩慢的網站：加快載入速度的 13 個可行步驟

如何修復緩慢的網站：加快載入速度的 13 個可行步驟

已發表: 2017-06-05

沒有人喜歡速度慢的網站。 緩慢的頁面載入時間會趕走潛在的訪客，並可能導致您的網站在搜尋結果中排名較低。

總而言之，這意味著造訪您網站的人越來越少，而造訪您網站的使用者體驗也很差。

這對生意來說無疑是不利的！

好消息是，如果您對網站目前的效能不滿意，可以採取許多措施來加快網站速度。

下面，我們提供了13 個可操作的步驟，您可以立即開始執行，以獲得您想要的更快的載入時間。

但在開始之前，您必須對網站的速度進行準確的基準測試。 這將使您清楚地了解問題有多大，並使您能夠衡量修復的有效性。

幫助診斷網站緩慢的工具

有許多有用的線上工具可以幫助您準確測量網站的速度有多慢。

這些工具對於準確識別減慢速度的因素並建議您可以採取哪些措施來加快速度也非常有用！

以下是我最喜歡的兩個網站速度報告工具：

Google 頁面速度洞察

這個來自 Google 的免費工具將檢查任何 URL 並在您的網站上運行測試其效能。 它為您的網站在桌面和行動平台上的運作方式提供不同的結果。

它將涵蓋本文中討論的許多領域，並就可能導致網站速度變慢的具體原因提供建議。

然而，這個工具似乎確實非常激進，有時不切實際，所以請記住這一點。

Pingdom 網站速度測試

Pingdom 還擁有一些出色的速度測試解決方案，可以從全球多個位置測試您的網站（這是使用 CDN 的好主意的原因之一；更多內容見下文）。

它還提供了許多實用的解決方案來提高您的速度。

修復網站緩慢的 13 種方法

1.使用更快的網站寄存供應商

根據我的經驗，緩慢的網站託管可能是導致網站緩慢的最大因素。 因此，更換為更快的網站寄存供應商通常會為您的網站速度帶來最大的提升。

當然，更換提供者也是此清單中所有步驟中最重要且最昂貴的。 因此，無論如何，請先嘗試其餘步驟：我相信您會看到一些速度提升。

但至少對我來說，最大的速度提升總是在我「咬緊牙關」升級我的網站寄存時出現。

要選擇最快的網站託管供應商，您可以採取以下步驟：

  1. 確定您的網站需求：確定您的網站的需求，例如接收的流量、所需的儲存空間量以及所需的安全性等級。
  2. 比較託管提供者：根據您的網站需求研究和比較託管提供者。 考慮正常運作時間、頁面載入速度、安全功能和客戶支援等因素。
  3. 考慮伺服器位置：選擇伺服器靠近目標受眾的網站寄存供應商。 這可以減少延遲並提高網站速度。
  4. 檢查伺服器資源：透過檢查伺服器資源（例如 CPU 和 RAM），確保託管提供者可以處理您網站上的流量。

2. 優化影像

未經優化的圖像是導致網站速度緩慢的另一個最大原因之一。 幸運的是，它們也是最容易修復的問題之一。

我所說的「未最佳化」是指檔案大小過大的圖像。 也就是說：每個圖像檔案的千位元組 (KB) 甚至兆位元組 (MB) 數量大於其所需的數量。

理想情況下，我嘗試將網站上的每個圖像保持在 100 KB 以下。 這並不總是可能的，但這是我們要努力實現的目標。

有 3 個屬性會影響圖像檔案大小（這些是我們應該優化的屬性）：

  1. 影像尺寸（以像素為單位）
  2. 圖片格式（JPEG、PNG、GIF 等）
  3. 應用於該影像的壓縮量

優化影像尺寸

影像的尺寸越大，其檔案大小就越大。 因此，您需要確保網站上圖像的寬度和高度不會大於所需的大小。

這意味著，如果我們有一個 2000 像素寬的圖像，最終將在網站上顯示為 700 像素寬，我們需要編輯該文件，使其在顯示在頁面上之前為 700 像素寬。

這可以在使用 Photoshop 或 GIMP 等程式或透過 Kraken.io 和 Compressor.io 等網站上傳到網站之前完成。 許多此類網站還提供 WordPress 插件，這些插件會在您將圖像上傳到網站後調整圖像大小（如果您使用的是 WordPress）。

選擇最佳影像格式

透過套用不同類型的壓縮（見下文），您提供圖像的格式也會影響其檔案大小。 不同的格式更適合不同類型的圖像。

JPEG 非常適合照片，而 PNG 則適合具有透明背景的影像或具有銳利邊緣的插圖。 如今，GIF 僅真正用於動畫圖像。

還有較新的圖像格式（例如 WebP）可以提供更好的壓縮等級。 然而，某些瀏覽器（例如​​Internet Explorer 11）仍然不支援WebP，因此我們需要小心使用它們。

有些服務（見下文）可以偵測何時支援下一代影像格式，並自動轉換您的影像並以這種格式提供它們，以進一步提高速度！

在保持影像品質的同時最大化壓縮

所有流行的圖像格式都會壓縮您的圖像以減小檔案大小。 您通常可以選擇壓縮的程度，但代價是更高的壓縮意味著更差的影像品質。

所以你需要找到一個平衡點，就是影像品質可以接受，但檔案大小不能太大。

調整圖像尺寸的相同應用程式和網站也會壓縮圖像。 微小的 PNG 是另一個。 通常，您可以選擇所需的壓縮級別，並透過預覽來專注於品質。

3.使用延遲加載

說到圖像，如果沒有人看到它們，就不需要載入它們，對嗎？ 這只是不必要的開銷。

延遲載入是一種透過僅在需要時載入圖像和影片來提高網站效能的技術。

這可以顯著減少網站載入所需的時間，因為只載入使用者可見的內容。

要實現延遲加載，可以採取以下步驟：

  1. 確定要延遲載入的圖像和影片：這些圖像和影片可能包括位於首屏以下或用戶無法立即看到的圖像和影片。
  2. 安裝延遲載入外掛程式或腳本：有許多外掛程式（見下文）可用於流行的內容管理系統（例如 WordPress），可以幫助輕鬆實現延遲載入。 如果您無法使用插件，您可以輕鬆地自行添加程式碼。
  3. 配置延遲載入：根據您網站的需求配置延遲載入外掛程式或腳本的設定。 這可能包括延遲載入內容類型的設定、何時開始載入影像的閾值等等。
  4. 測試延遲載入：檢查圖像和影片是否正確載入以及網站效能是否有問題。

4.啟用快取

啟用快取可以減少瀏覽器為檢索資源而向伺服器發出的請求數量，從而顯著加快緩慢網站的速度。

當使用者第一次造訪網站時，瀏覽器會下載所有必要的文件，例如 HTML、CSS、JavaScript 和圖像。 當使用者重新訪問網站時，瀏覽器可以從快取中檢索這些文件，而不是再次下載它們，從而減少頁面載入時間並改善使用者體驗。

若要啟用快取，您可以執行以下步驟：

  1. 啟用快取標頭：快取標頭，例如“Expires”和“Cache-Control”，告訴瀏覽器在快取中儲存靜態檔案多久。 透過設定這些標頭，您可以控製檔案的快取時間。
  2. 設定過期日期：為快取中的靜態檔案設定過期日期可以幫助確保使用者在檔案更新時下載最新版本的檔案。 這可以透過在快取標頭中設定“max-age”值來完成。

同樣，如果您使用 WordPress，那麼有許多快取外掛程式可以為您完成所有這些工作（請參閱下文）。 否則，根據您使用的 Web 伺服器類型，自己完成基礎知識非常容易。

5.使用內容傳遞網路（CDN）

內容交付網路 (CDN) 透過將網站內容分發到位於不同地理區域的伺服器網路上，可以顯著加快速度較慢的網站的速度。

網站延遲範例

當使用者要求您網站的內容時，CDN 會從距離使用者最近的伺服器提供服務，從而縮短資料傳輸的距離並縮短載入時間。

要使用 CDN，您需要執行以下步驟：

  1. 註冊 CDN 服務：有許多可用的 CDN 供應商，包括 Cloudflare、Amazon CloudFront 和 Akamai。 選擇一個能夠提供您所需的功能且符合您的預算的提供者。
  2. 設定 CDN：註冊 CDN 服務後，您需要將其設定為與您的網站搭配使用。 大多數 CDN 服務都有簡單的逐步指南來幫助您完成整個過程
  3. 將您的網域伺服器指向 CDN：最後，登入您的網域註冊商並更改網域名稱伺服器，以便它們指向 CDN 服務而不是直接指向您的 Web 主機

6. 合併文件

組合檔案將減少網站發出的 HTTP 請求數量，這可能會極大地影響其載入時間。

這是因為每次載入網頁時，瀏覽器都會向伺服器發送多個請求以檢索所有必要的資源，包括 HTML、CSS、JavaScript、圖像等。

每個請求都會增加額外的開銷和延遲，這可能會導致載入時間變慢，特別是在網路連線速度較慢的情況下。

因此，為了最大限度地減少 HTTP 請求，您可以採取幾個步驟，包括：

  1. 合併程式碼檔案：將多個 CSS 和 JavaScript 檔案合併到一個檔案中。 這減少了瀏覽器下載所有必要文件所需的請求數量。
  2. 使用圖像精靈：將多個圖像組合成一個圖像（稱為精靈），並使用 CSS 來顯示各個圖像。 這減少了需要發出的圖像請求的數量。

圖像精靈範例 圖像精靈的範例。 圖片來源

如果您使用 WordPress，有幾個外掛程式可以為您組合程式碼檔案（請參閱下文）。 您也可以使用 Gulp、Grunt 或 Webpack 等工具，或直接手動完成（將程式碼複製並貼上到一個主檔案）。 否則，您可能需要聘請開發人員。

7. 最小化 JavaScript 和 CSS

最大限度地減少網站上的 JavaScript 和 CSS 可以透過減少需要下載的檔案的大小來顯著加快緩慢的網站速度。 這可以透過刪除任何未使用的程式碼、合併檔案和縮小程式碼來實現。

要最小化 JavaScript 和 CSS，您可以採取以下步驟：

  1. 刪除未使用的程式碼：最小化 JavaScript 和 CSS 的最簡單方法之一是刪除網站上不再使用的任何程式碼。 這可以幫助減少需要下載的檔案的大小。
  2. 縮小程式碼：縮小 HTML、CSS 和 JavaScript 檔案可以透過刪除不必要的空格、註解和其他非必要程式碼來幫助減少檔案大小和下載時間。 這可以使用 UglifyJS、YUI Compressor 或 Google Closure Compiler 等工具來實現。

再說一次，如果您使用 WordPress，有許多外掛程式會自動最小化您的 JavaScript 和 CSS（請參閱下文）。

8.啟用Gzip壓縮

Gzip 壓縮是另一種用於進一步減少從伺服器傳送到瀏覽器的檔案大小的技術。 該技術可壓縮 HTML、CSS 和 JavaScript 文件等文件，並將其文件大小減少多達 70% 。

這可以顯著提高網站效能，因為瀏覽器可以更快地下載較小的檔案。

若要啟用 Gzip 壓縮，您可以執行下列步驟：

  1. 檢查是否啟用了 Gzip 壓縮：您可以使用 GIDZipTest 或 Gift of Speed 等線上工具來檢查您的網站是否已使用 Gzip 壓縮。
  2. 啟用 Gzip 壓縮：如果未啟用 Gzip 壓縮，您可以透過將程式碼片段新增至 .htaccess 檔案或伺服器設定檔來啟用它。 此程式碼片段將指示 Web 伺服器在將檔案傳送到瀏覽器之前對其進行壓縮。
  3. 測試 Gzip 壓縮：檢查傳送到瀏覽器的檔案大小，並確認它們由於 Gzip 壓縮而變小。

像往常一樣，有許多 WordPress 外掛程式會自動將 Gzip 壓縮應用於您網站上的檔案（請參閱下文）。

9. 優化你的資料庫

網站資料庫儲存網站功能所需的所有資料。 然而，隨著資料庫的成長，它可能會因不必要的資料而變得混亂，從而降低網站效能。

優化資料庫涉及刪除任何不必要的資料和索引表以提高網站效能。

若要優化網站資料庫，可以採取以下步驟：

  1. 備份資料庫：在對網站資料庫進行任何變更之前，請確保備份資料庫，以避免出現錯誤或問題時遺失任何資料。
  2. 刪除不必要的數據：識別並刪除任何不必要的數據，例如貼文修訂、垃圾貼文和垃圾留言。 這可以使用外掛程式或透過執行資料庫查詢來完成。
  3. 重建索引：在資料庫表上重建索引以提高搜尋效能。 這可以使用外掛程式或透過執行資料庫查詢來完成。
  4. 優化資料庫表：優化資料庫表以確保它們使用正確的儲存引擎和表結構。 這可以使用外掛程式或透過執行資料庫查詢來完成。
  5. 使用快取：使用快取可以減少資料庫查詢次數，提高網站效能。

正確優化資料庫可能涉及相當多的工作。 這是關於如何在 MySQL 資料庫上開始使用此功能的良好逐步指南。 但您可能很需要讓開發人員參與更大的專案。

10.刪除不必要的插件

插件可以為網站提供廣泛的功能，但插件過多會降低網站效能。 每個插件都有自己的一組需要載入的檔案和腳本，這會增加網站的載入時間。

刪除不必要的插件可以減少需要載入的檔案和腳本的數量，從而有助於提高網站效能。

若要刪除不必要的插件，您可以執行以下步驟：

  1. 識別未使用的插件：識別未使用且不再需要網站功能的插件。
  2. 停用並刪除未使用的外掛程式：如果您使用的是 WordPress，則可以透過儀表板完成此操作，方法是前往“外掛程式”部分並選擇“停用”，然後選擇“刪除”。 其他 CMS 也將具有類似的功能。
  3. 評估插件功能：確定是否有任何插件可以替換為更輕量級的解決方案，或者是否有任何插件可以組合。
  4. 定期檢查插件：定期檢查網站上使用的插件，並刪除不再需要或影響網站效能的插件。

11.減少廣告數量

網頁上的廣告太多會減慢頁面載入時間並使用戶體驗令人沮喪。 這可能是插入廣告的腳本效率低下的情況。 或者可能是廣告本身沒有適當的優化。

您可以採取以下一些步驟來減少網站上的廣告數量：

  1. 分析廣告成效：查看網站上廣告的成效數據，以確定哪些廣告沒有產生大量收入。 考慮刪除效果不佳的廣告。
  2. 在每個頁面上使用合理數量的廣告：考慮減少特定頁面上廣告數量過多或已經包含大量其他內容的廣告數量。
  3. 優化廣告投放：首頁廣告通常較顯眼，點擊率較高。 但是，請避免在首頁放置太多廣告，因為這會對用戶體驗產生負面影響。
  4. 刪除侵入性廣告：刪除侵入性或煩人的廣告，例如彈出視窗或自動播放影片廣告。 這些類型的廣告會對使用者體驗產生負面影響並增加頁面載入時間。

12.使用輕量級主題或模板

主題或模板是網站的視覺設計，它對網站的速度有很大的影響。 使用輕量級框架可以幫助提高網站的速度和效能。

輕量級主題的設計是簡約的，具有較少的設計元素和功能，可能會減慢網站速度。

您可以採取以下一些步驟來確保使用輕量級主題：

  1. 選擇一個信譽良好的主題：有許多可用的輕量級主題，因此請選擇一個以其速度和性能而聞名的信譽良好的主題。
  2. 親自檢查主題的頁面速度：在選擇主題之前，請使用 Google PageSpeed Insights、GTmetrix 或 Pingdom 等工具檢查其頁面速度。 這將使您了解主題的效能和載入時間。
  3. 避免複雜的設計：選擇設計簡單的主題，其中的設計元素（例如動畫、視差滾動或大圖像檔案）較少。 這些功能可能會減慢網站速度並影響使用者體驗。
  4. 測試主題：在將主題部署到您的網站之前，請先對其進行測試以了解其在您的網站上的執行情況。 您可以再次使用相同的工具來測量頁面載入時間和其他效能指標。
  5. 定期更新主題：定期更新主題以確保其速度和效能保持最佳化。 舊的或過時的主題可能會減慢網站速度並導致其他問題。

13、定期進行網站維護

定期網站維護有助於防止可能降低網站速度並提高整體效能的技術問題。

您可以採取以下一些步驟來執行網站維護：

  1. 更新您的網站軟體：定期更新您網站的軟體，包括外掛程式、主題以及為您的網站提供支援的內容管理系統 (CMS)。 這些更新可能包括錯誤修復、安全性修補程式和效能改進。
  2. 刪除未使用的外掛程式和主題：刪除網站上未使用的任何外掛程式和主題。 未使用的外掛程式和主題可能會佔用寶貴的伺服器資源並降低您的網站速度。
  3. 監控網站的效能：追蹤網站的效能，包括頁面載入時間和其他關鍵指標。 使用 Google Analytics 或 Pingdom 等工具來監控網站的效能並確定需要改進的領域。
  4. 清理資料庫：隨著時間的推移，您網站的資料庫可能會因未使用的資料而變得混亂，例如舊的貼文修訂和垃圾評論。 在 WordPress 上，使用 WP-Optimize 或 WP-Sweep 等外掛程式來清理資料庫並提高網站效能。

WordPress 優化插件

如果您的網站是使用 WordPress 建立的（由於世界上超過 41% 的網站是使用 WordPress 建立的，因此很有可能是這樣），那麼有大量外掛程式可以幫助您完成上述每個步驟。

雖然您無疑能夠為上述每個步驟找到一個專業外掛程式（例如，僅最小化 JavaScript 和 CSS 的插件），但這通常不是最有效的操作過程。

多個外掛程式會進一步增加您的程式碼庫的重量，它們都需要維護，並且在許多情況下它們會相互衝突，從而導致您的網站出現技術問題。

最好找到一兩個插件來完成大部分修復緩慢網站的任務。 例如，WP Rocket 幾乎可以完成此清單中的所有步驟！ 您確實需要付費才能使用它，但這會為您省去很多麻煩！

實際上，我們有一篇更專注於如何讓 WordPress 更快的文章，我們在其中討論了這一點以及更多內容！

結論

雖然可以更詳細地研究上述每個類別，但如果您遵循這些步驟，您很有可能將網站加載時間減少一半或更多，而且您肯定會提高網站的速度地點。

如果您有任何疑問，請在評論部分告訴我。