如何讓您的網站在移動設備上快速加載（2022 年）

您的網站在移動設備上的性能現在比在台式機上的性能更重要。

這是因為使用移動設備訪問互聯網的人比使用台式機的人多。

根據 StatCounter，全球超過 50% 的互聯網用戶使用移動設備。 而只有略高於 47% 的人使用台式機。

如果您主要針對桌面優化您的網站，那麼您正在損害您的業務成功。 手機現在比以往任何時候都更重要。

您的網站在移動設備上的表現對於 SEO 非常重要。 谷歌的方法現在是移動優先索引。 這意味著谷歌使用網站的移動版本進行索引和排名。

如果您的網站在台式機上速度很快，而在移動設備上速度很慢，那麼您的排名就會受到影響。 您的網站在移動設備上的性能應該比其在台式機上的性能更重要。

讓您的網站在移動設備上快速加載將改善您的 SEO、降低跳出率並增加轉化率。

但是在移動設備上優化網站的速度並不像在桌面上優化網站的速度那麼容易。 值得慶幸的是，如果您遵循我在此處列出的提示，本文可以幫助您在移動設備上快速加載您的網站。

測試您網站的速度

您應該做的第一件事是測試您的網站在移動設備上的速度。 這將使您清楚地了解您的網站有多快或多慢。

僅僅因為您的網站在桌面上加載速度很快，並不能保證它在移動設備上加載速度很快。 您的網站可能在桌面上非常快，但在移動設備上卻非常慢。

有很多移動測試工具，但我更喜歡使用 Google 的 Test My Site 進行移動速度測試。

只需訪問 ThinkWithGoogle 並輸入您網站的 URL。 您應該能夠測試您的網站的速度。

對我來說，一個在 3 秒內加載的網站就足夠了。 但 Think With Google 建議至少 2.4 秒。

如何讓您的網站在移動設備上快速加載

以下是加快移動網站速度的最佳做法：

使用響應式主題

響應式主題是可以調整以適應所有設備的主題。 這意味著即使您的用戶來自台式機、移動設備或平板電腦，您的主題也會為他們提供適合他們使用的任何設備的網站版本。

向移動用戶提供網站的桌面版本會減慢加載時間。 這對用戶體驗來說很糟糕。

使用響應式主題非常重要。 它是移動快速網站的第一個基礎。 您可以選擇幾個響應式主題。 閱讀我列出的 10 個最快和最好的 WordPress 主題列表，其中列出的任何主題都足夠好且響應迅速。

使用快速的網絡主機

您的虛擬主機在加快您的網站速度方面起著最重要的作用。 具有最新託管技術的非常快速的網絡主機將使您的網站在移動設備上快速加載。

如果您的虛擬主機速度較慢，那麼無論您如何優化您的網站，您都可能看不到顯著的改進。

對於已建立的網站，我推薦 Cloudways 和 Kinsta。 TargetTrend 託管在 Cloudways。 對於初學者網站，我推薦 Bluehost。

使用 AMP

Accelerated Mobile Pages (AMP) 是 Google 的一個項目，旨在加快移動網站的速度。

AMP 針對移動瀏覽進行了優化，可以幫助顯著加快網站的加載時間。 根據一項研究，它還可以將請求數量減少 77% 以上。

您可以通過安裝官方 AMP 插件開始使用 AMP。 還有其他 AMP 插件，您也可以使用它們。

激活插件後，您可以選擇三種可用模式中的任何一種。 如果您的大多數訪問者來自移動設備，請考慮使用過渡或標準模式。 但您的主題必須與 AMP 兼容。

延遲加載圖像

圖片會降低網站速度，尤其是在移動設備上。 處理它們的最佳方法是在用戶滾動到它時加載它們。 這樣，它們只會在需要時加載，因此對加載時間的影響很小或沒有影響。

如果您嘗試在 PageSpeed 洞察力或 Web.dev 上測試您的網站，並警告您“延遲屏幕外圖像”，這意味著圖像會減慢您的加載時間，您應該考慮延遲加載它們。

延遲加載圖像就是延遲圖像的加載，直到用戶滾動到它為止。 這可以提高速度。

有很多插件可以處理延遲加載。 大多數緩存插件和圖像優化插件都有延遲加載選項。

消除渲染阻塞資源

消除渲染阻塞資源可以加快您網站在移動設備上的加載時間。

通常有一些 Java 腳本和 CSS 使瀏覽器難以在用戶訪問時快速呈現網站。 這是因為瀏覽器必須先停止並讀取這些文件，然後才能將站點呈現給用戶。

消除這些資源可以加快加載時間。 有像 Autooptimize 這樣的插件可以幫助消除渲染阻塞資源。

我有一篇有用的文章，你應該閱讀：如何消除 WordPress 中的渲染阻塞資源。

刪除未使用的 CSS

擁有大量未使用的 CSS 會降低網站速度。 未使用的 CSS 是網站加載不需要的 CSS。 但是因為它們存在​​，瀏覽器仍然需要下載、解析和處理它們。

有諸如 Perfmatters 和 Asset CleanUp 之類的插件可以幫助刪除未使用的 CSS。

我為此寫了一個簡單的指南：如何在 WordPress 中刪除未使用的 CSS 和 JS。

生成關鍵 CSS

關鍵 CSS 用於輕鬆提取首屏內容以快速呈現給用戶。 擁有關鍵的 CSS 路徑可以加快您的網站在移動設備和桌面設備上的加載時間。

有一些插件可以幫助生成 Criticall CSS。 WP Rocket 可以做到這一點，LiteSpeed Cache 和 WP Performance 也可以生成關鍵的 CSS。

擁有良好的緩存系統

緩存是加快網站速度的一種非常可靠的方法。 您應該使用有效的緩存插件為您的移動訪問者提供緩存內容。 WP Rocket 是一個非常有效的高級緩存插件。 W3 總緩存，如果配置得當會非常有效。

大多數託管網絡託管公司都提供服務器級緩存。 了解您的網絡託管服務商是否提供相同的服務，如果您的網站不是開箱即用的，請讓他們為您的網站激活。

您可以請求您的主機安裝和激活 Varnish 緩存。 Varnish 緩存以加快網站速度而聞名。

優化圖像

確保壓縮圖像。 我更喜歡在上傳之前完全壓縮圖像。 但是，有許多插件，例如 optimole 和其他可以幫助壓縮 WordPress 中的圖像的插件。

提供 WebP 圖像也可以幫助提高網站速度。 WebP 比 JPG 和 PNG 小，因此對速度更友好。

有許多插件可以幫助轉換和提供 WebP 圖像。 Optimole和飛圖可以很好地做到這一點。

縮小代碼

縮小是將網站的代碼從較大尺寸壓縮到較小尺寸的過程。 只要不破壞任何東西，越小越好。

您應該考慮縮小 JS 和 CSS。

大多數緩存插件都提供縮小功能。 但請確保您使用 staging 進行測試，因為已知縮小會破壞網站。

最小化重定向

過多的重定向會降低您的網站速度，尤其是在移動設備上。 它可以減慢服務器響應時間。

確保您沒有太多重定向。 如果是，請盡可能減少它們。

啟用壓縮

壓縮文件以使您的網站在移動設備上快速運行。 東西越小，您的網站就會越快。

Gzip 或 Brotli 可以通過壓縮網站文件顯著提高您的網站速度。 一般來說，Brotli 比 Gzip 好。 但是它們中的任何一個都可以正常工作。 請與您的網絡主機商核對，以便為您啟用壓縮。

如果插件解決方案更適合您，還有一些插件可以幫助您啟用壓縮。

減少每頁的 AdSense 數量

Google AdSense 是最流行的通過博客賺錢的方式之一，但眾所周知，它會顯著降低網站速度。

根據我的觀察，如果您停用 AdSense，您會立即註意到加載時間的巨大差異。

但是金錢和速度一樣重要。 所以你必須達成妥協。 Google 建議每頁 3 個廣告單元。 如果你堅持這一點，那麼你應該沒問題。

我注意到匹配內容單元和頁面級廣告對移動加載時間的負面影響最大。

使用 CDN

內容交付網絡可以幫助提高您網站的速度，方法是製作您網站的靜態副本，並在世界各地的用戶嘗試訪問您的網站時從離他們更近的位置將其提供給他們。

如果您沒有使用 CDN，那麼您就錯過了！

查看最好的 WordPress CDN 提供商。

使用系統堆棧字體

最近我試圖加快這個網站在移動設備上的加載時間。 所以我決定停止使用谷歌字體並嘗試了系統堆棧，令我驚訝的是，速度有了顯著的提高。

谷歌字體和字體真棒是驚人的，但它們會減慢網站速度。 使用系統堆棧可確保不發出任何外部請求，因為它是用戶使用的任何設備的所需字體。

一些主題可以輕鬆更改為系統堆棧。 只需切換到系統堆棧。

使用較新的 PHP 版本

較新的 PHP 版本通常比舊版本更快。 您應該確保您使用的是最新的 PHP 版本或僅使用一個向後的版本。

不僅是為了速度，也是為了安全。