保持 WordPress 網站移動友好的 10 個技巧（和插件）

已發表: 2023-04-13

與客廳笨重的家庭電腦時代相比，我們使用互聯網的方式發生了巨大變化。截至 2023 年 2 月，超過 60% 的網絡流量來自移動設備 (Oberlo)。最重要的是，我們訪問的網站中有超過 40% 是基於 WordPress (HubSpot) 構建的。

需要幫助銷售網站？立即獲取我們用於銷售數字產品的百萬美元宣傳材料的副本！

對您和您的客戶來說，好消息是製作適合移動設備的 WordPress 網站並不困難。但是，在數以千計的插件中進行分類以決定哪些插件會讓您和您的客戶的生活更輕鬆可能會讓人不知所措。在本文中，我們將介紹十大技巧和 WordPress 移動友好插件列表，以輕鬆構建優化的網站。

適合移動設備的網站 101
創建適合移動設備的 WordPress 網站的挑戰
保持 WordPress 網站移動友好的 10 大技巧和插件
1. 為移動優先設計優化圖像
2. 測試並提高頁面速度
3. 移動優化的菜單和導航
4. 刪除不需要的插件
5. 創建移動和桌面友好的主題
6. 確保您的緩存有效
7. 針對移動設備優化的彈出窗口和消息傳遞
8. 自適應號召性用語按鈕
9. 跨瀏覽器兼容性
10. 深色模式適應性
經常問的問題
- WordPress 是否針對移動設備進行了優化？
- 如果我的網站不適合移動設備怎麼辦？

適合移動設備的網站 101

無論您是根據具體情況創建客戶的網站，還是考慮轉售白標網站，您都需要將移動放在首位。但是，擁有移動響應式 WordPress 網站意味著什麼？簡而言之，它是一個設計精美的網站，可以在手機和平板電腦等小型設備上正常運行。在屏幕尺寸小得多的情況下，讓客戶輕鬆導航、使用易於閱讀的字體大小以及更少的圖形或動畫以控制加載速度非常重要。

對於中小型企業，確保他們的網站適合移動設備意味著客戶可以找到他們想要的信息（或產品），使用網站有良好的體驗，並有可能在未來回頭。移動優化還可以改善搜索結果，因為谷歌索引網站的移動版本以確定排名結果（稱為移動優先索引）。改進的搜索結果意味著更多的人在搜索時會看到您客戶的網站——在他們尋找時結識潛在客戶。

創建適合移動設備的 WordPress 網站的挑戰

如果您希望使 WordPress 網站適合移動設備，則需要注意一些事項。一些罪魁禍首可能會導致 WordPress 網站在移動設備上加載時間緩慢，這對於訪問您客戶網站的潛在客戶來說並不是一個很好的體驗。移動 WordPress 體驗緩慢的一些常見原因是：

服務器託管速度慢：選擇正確的網站託管解決方案會產生很大的不同。例如，如果您選擇共享主機並且其他站點獲得大量流量，這可能會影響您客戶站點的可用資源。
大圖像：包括大圖像（高分辨率或大文件大小）確實會在移動訪問期間減慢網站速度。
使用錯誤的插件：如果您的插件已過時、未優化，或者您的網站上有太多插件，則可能會顯著降低速度。
錯誤的主題：就像插件一樣，過時或編碼不當的主題會影響網站速度。
緩存問題：緩存或臨時數據存儲可以幫助網站加載更快。不使用插件來支持緩存會使您的網站加載速度非常快。

考慮到使客戶的 WordPress 網站適合移動設備的重要性，有一些很棒的插件（和默認設置）可以將 WordPress 網站提升到一個新的水平，以提高用戶體驗並改善 SEO 結果。

保持 WordPress 網站移動友好的 10 大技巧和插件

1. 為移動優先設計優化圖像

大多數網站都有大量引人注目的圖片，以吸引他們的注意力並吸引訪問者的注意力。對於提供產品而非服務的企業，還需要考慮產品圖片。幾乎每個人在嘗試用手機瀏覽網站時都遇到過加載緩慢甚至圖像損壞的問題，如果體驗過於繁瑣，通常會導致離開網站。

減小文件大小、尺寸或兩者都可以縮短加載時間。這會導致更快樂的訪問者和可能更高的 SEO 排名，因為加載速度是谷歌在移動搜索結果中的排名因素。

人們在移動設備上瀏覽的另一個因素是數據。大圖像會耗盡數據，如果人們擔心他們的數據限制，這可能會阻止他們留在企業網站上。

WordPress 移動友好型插件：Smush

Smush 是一個屢獲殊榮的插件，可以在不犧牲質量的情況下減小圖像大小。它通過多種技術實現這一點，包括：

無損壓縮：在不影響圖像質量的情況下剝離未使用的數據
多通道有損壓縮：刪除不太重要或冗餘的數據或人眼不可見的信息
圖片大小調整：將圖片設置為您網站的特定尺寸
延遲加載：圖像在訪問者滾動時加載，而不是一次全部加載，這意味著屏幕外圖像不會影響加載時間

Smush 允許用戶一次或逐張優化移動友好型 WordPress 網站上的所有圖像。

成本： Smush 是一個免費增值插件，有一個免費的基本版本和一個帶有更多高級功能的專業選項。

2.測試並提高頁面速度

如果您不持續測試您的頁面速度，您將不知道自己在哪裡取得成功，以及哪裡有改進的餘地。您可以使用 Google PageSpeed Insights 或 GTmetrix 等速度測試工具了解您從哪裡開始，以衡量您的移動友好型 WordPress 網站的速度。

對於企業而言，網站速度會直接影響收入，因為 70% 的消費者表示頁面速度會影響他們是否有可能從電子商務網站購買商品 (Unbounce)。理想情況下，移動網站應在 1-2 秒內加載。除了它對 Google 排名的影響之外，Hubspot 還發現了一些有影響力的統計數據，說明網站速度對於像您的客戶這樣的企業主有多重要：

移動網站的平均加載時間為 15.3 秒（Think with Google）。
加載時間每增加一秒，網站轉化率平均下降 4.42% (Portent)。
一半的消費者更願意在移動網站 (Hubspot) 上擁有更快的網站速度，而不是動畫或視頻。
頁面設計元素，而不是移動數據網絡，是造成大多數慢速移動站點的原因 (Google)。

WordPress 移動友好插件：NitroPack

NitroPack 通過多種技術解決站點速度和性能問題，包括：

緩存（包括自動緩存預熱、設備和 cookie 感知緩存以及瀏覽器和會話感知緩存）
圖像優化（有損和無損圖像壓縮、延遲加載、搶占式圖像大小調整和自適應圖像大小調整）
內容分發網絡 (CDN) 優化
預加載

NitroPack 可以幫助確保您客戶的 WordPress 網站適合移動設備，並儘可能快地進行優化。

成本： NitroPack 有一個免費計劃以及針對多種規模和需求的企業的月度和年度定價。免費選項確實附帶

3. 移動優化的菜單和導航

當您考慮讓 WordPress 網站適合移動設備時，記住最重要的人是至關重要的：屏幕另一邊的潛在客戶。在手機上瀏覽網站——即使是最大、最新的型號——總是與筆記本電腦或台式機上的體驗不同。想一想您訪問菜單的位置和方式、滾動方式、頁腳和頁眉的作用、信息層次結構等等。除了在較小屏幕上使用網站的挑戰之外，許多訪問者可能還有數字可訪問性需求，這在網站設計中也應予以考慮。

WordPress 移動友好插件：WP 移動菜單

WP Mobile Menu 是一個流行的 WordPress 移動友好插件，用於創建移動優化菜單。易於使用的插件可讓您自定義顏色、字體和圖標。您還可以根據客戶站點的部分以及從設計角度來看有意義的內容來更改菜單位置。

該插件適用於任何 WordPress 主題，針對搜索和完全響應進行了優化，因此無論屏幕尺寸如何，它都可以工作，並且針對 WooCommerce 進行了優化。

成本： WP Mobile Menu 以各種價位提供多個月度或年度計劃，一個網站每月 6.49 美元起。

4.刪除不需要的插件

雖然插件可以解決很多問題，但有時它們可能是問題的根源。太多的插件會影響您客戶的 WordPress 網站的移動友好程度。

性能問題：每個插件都會添加更多代碼——過多的代碼會使網站運行緩慢。如上所述，較慢的加載時間不僅會帶來糟糕的用戶體驗，還會直接影響收入。
插件衝突：並非所有插件都兼容，如果兩個（或更多）插件發生衝突，網站可能會出現意外錯誤並可能崩潰。更多的插件意味著更多的不兼容機會。
安全風險：每個插件都有風險。如果它們沒有保持最新狀態，或者它們不安全，人們就可以瞄準該站點並利用這些漏洞。使用風險與回報框架來處理每個插件。
維護挑戰：儘管名稱如此，插件實際上並不是即插即用的。他們需要維護、更新和監控，以確保他們在做他們想做的事情——而不是損害您網站的性能。

WordPress 移動友好插件：Jetpack

Jetpack 具有一套功能來解決性能和安全漏洞，使您的 WordPress 網站更適合移動設備。由於 Jetpack 具有如此多的功能，您可以用一個工具替換多個插件，該工具包括安全性、站點統計信息和性能優化等。

成本： Jetpack 的工具還包括防止惡意軟件和垃圾郵件的安全性、實時備份以及許多其他功能，起價為每月 13.50 美元，具體取決於您希望計劃的穩健程度。

5. 創建移動和桌面友好的主題

在使您的 WordPress 網站更適合移動設備時，一個好的響應式主題至關重要。正確的它們可以確保網站滿足可靠性和可訪問性要求、快速加載的圖像、適用於小（和大）屏幕的直觀佈局，並且易於通過觸摸而不是鼠標或觸控板進行導航。 Google 優先考慮移動網站，使用響應式主題還可以改善搜索結果——讓您客戶的網站出現在更多潛在客戶面前。

WordPress 移動友好插件：WPTouch

WPTouch 插件可以在不改變桌面體驗的情況下優化當前的 WordPress 網站。

特徵：

附帶一個簡單的安裝嚮導來指導您完成設置
您可以直接在插件中更改主題並添加或刪除擴展
移動設備檢測，改善加載時間
完全可定制的設置
一個自動保存的管理面板
內置分析
完整的 WordPress 定制器支持
全職客戶支持

成本： WPTouch 的捆綁包起價為每年 79 美元，也有單點選項，因此您可以只選擇適合客戶需求的產品。

6.確保你的緩存是有效的

為了讓您客戶的 WordPress 網站適合移動設備，您需要確保您的緩存處於可控狀態。但什麼是緩存？簡單的說，就是對頻繁使用的數據進行臨時存儲，以便盡快訪問。當有人訪問您的網站時，服務器首先檢查緩存以查看信息是否存在，然後檢查原始來源。緩存發生在不同的位置，包括瀏覽器緩存、服務器端緩存和內容分發網絡 (CDN) 緩存。

一個高效的緩存系統可以減少服務器負載，加快頁面加載時間，並且只存儲最必要和相關的數據。定期使數據過期還可以確保存儲的信息始終是最新的，並且是您網站內容的最新版本。

WordPress 移動友好型插件：Hummingbird

Hummingbird 可以優化 WordPress 移動站點並通過多種策略提高站點速度。

Hummingbird 提供的最大功能之一是通過創建網站頁面和資源的緩存副本進行緩存，然後可以快速訪問並儘快為訪問者提供服務。

該插件同時具有瀏覽器緩存和服務器端緩存功能。瀏覽器緩存將圖像、樣式表和腳本等數據存儲在訪問者的設備上，這樣就不必在每次訪問時都從原始來源訪問它們。使用服務器端緩存，信息保存在您客戶端的網絡服務器上——也允許更快的訪問。

使用 Hummingbird，您還可以決定將文件緩存多長時間，確定要緩存哪些信息，以及清除緩存的時間和頻率。

Hummingbird 附帶一個掃描工具，可以在整個站點中搜索拖慢速度的文件，並為您提供修復這些文件的解決方案。

成本： Hummingbird 是一個免費增值插件，有一個免費的基本版本和一個帶有更多高級功能的專業選項。

7. 移動優化的彈出窗口和消息

彈出窗口和消息傳遞是任何數字營銷策略中的關鍵工具。但是，至關重要的是，它們不會干擾在手機等較小屏幕上訪問該網站的體驗。

您的客戶可以使用彈出窗口來增加他們的電子郵件列表（帶來更多營銷機會）、增加轉化率或增加購物車大小，甚至可以進行市場調查以了解有關潛在客戶需求的更多信息。

以下是在適合移動設備的 WordPress 網站上有效使用彈出窗口的一些方法：

銷售和折扣：您可以向潛在客戶推銷和折扣。一些想法包括首次購買者的百分比折扣、限時或季節性銷售，或者當某人花費一定金額或購買特定數量的商品時的折扣。
增加您的電子郵件列表：企業可以使用參與的電子郵件列表做很多事情。您可以使用彈出窗口來收集電子郵件地址，並向他們發送營銷活動、促銷信息，並讓他們了解您公司的最新動態。
使用社會證明和稀缺性來推動銷售：彈出窗口和消息可以是讓潛在客戶知道某件商品數量是否不足或分享其他人正在購買他們正在查看的產品的好地方。
進一步與您的受眾互動：您可以使用消息來鼓勵訪問者在社交媒體上關注您、進行調查以了解更多關於他們的需求、分享視頻、鼓勵交叉銷售等等。

太多或設計不當的彈出窗口在桌面網站上可能會造成足夠的干擾，但當人們使用較小的屏幕時，它們可能會影響或破壞瀏覽體驗。這就是為什麼您需要確保它們針對移動網站進行了優化。

WordPress 移動友好插件：OptinMonster

OptinMonster 是一種易於使用的彈出式窗口生成器和轉換工具，可幫助像您的客戶這樣的企業充分利用其網站。您可以構建燈箱彈出窗口、浮動條、滑入式彈出窗口、全屏歡迎、用於折扣的旋轉輪、表格、計時器等。

該插件具有拖放式彈出窗口構建器、大量模板、A/B 測試、分析以及高級頁面定位和基於行為的個性化，因此您的客戶可以根據以前的訪問自定義彈出窗口或顯示特定優惠在某些頁面上。

成本： OptinMonster 有一個基本套餐，每月 16 美元，更強大的計劃適用於擁有多個網站的企業，起價為每月 32 美元。

8. 自適應號召性用語按鈕

當訪問者在瀏覽您客戶的網站時已經在使用手機時，有時他們更容易打電話來查找所需的信息。與其讓他們在菜單中挖掘或通過 Google 查找企業的聯繫信息，不如使用浮動的“立即呼叫”按鈕讓客戶更快地與您的客戶取得聯繫。

WordPress 移動友好型插件：WP Call

WP Call Plugin 是一個用戶友好的插件，供企業在其移動友好的 WordPress 網站上添加點擊通話按鈕。該插件允許自定義按鈕的顏色、文本、大小和網站上任何位置的位置——包括特定頁面和側邊欄。該插件還具有分析功能，因此您可以找出哪些頁面更有可能提示呼叫。

成本： WP Call 是一個免費增值插件，有一個免費的基本版本和一個帶有更多高級功能的專業選項。

9. 跨瀏覽器兼容性

使 WordPress 網站對移動設備友好的一個因素是跨瀏覽器兼容性。我們大多數人都堅持在我們的設備上使用相同的瀏覽器，因此在訪問您客戶的網站時，您可能不會考慮檢查跨瀏覽器兼容性。但這很重要，原因有很多：

一致性：檢查兼容性可確保潛在客戶無論使用何種設備和瀏覽器，都能獲得一致的體驗。
可訪問性：如果有可訪問性需求的人正在訪問您客戶的網站，您需要確保支持任何專門的瀏覽器或工具。
SEO：Google 會優先考慮經過適當優化的網站，因此如果您客戶的網站無法在不同瀏覽器中正確顯示，您會發現這會影響他們的搜索排名。

WordPress 移動友好插件：LambdaTest

LambdaTest WordPress 插件是一種基於雲的工具，允許企業跨不同的瀏覽器測試他們的網站，而無需設置專門的測試環境。使用該插件，您可以直接從 WordPress 儀表板測試您的網站，以及在不同瀏覽器中錄製網站的屏幕截圖和視頻。

成本： LambdaTest 是一款免費增值插件，免費版每月有 60 分鐘的測試時間，付費版每月 15 美元起。

10.深色模式適配

許多移動用戶將他們的設備保持在深色模式——事實上，超過 80% 的人在他們的手機上使用深色模式 (IncrediTools)。如果您希望他們在您客戶的移動網站上有良好的體驗，您需要考慮到這一點。深色模式在弱光下更容易閱讀，許多人選擇它來幫助減輕眼睛疲勞。如果網站沒有針對暗模式進行優化，人們就不太可能留在該網站上。

WordPress 移動友好型插件：Droit Dark Mode

Droit Dark Mode 插件具有許多功能，可在您的網站上啟用暗模式適應性。它包括自動和手動暗模式切換，因此您可以將其設置為根據設備或一天中的時間進行更改，或者讓訪問者使用手動按鈕自行調用。它還帶有可自定義的配色方案，並與所有主要的 WordPress 主題兼容。

成本： Droit Dark Mode 是一個免費增值插件，有一個免費的基本版本和一個帶有更多高級功能的專業選項。

經常問的問題

WordPress 是否針對移動設備進行了優化？

是的，WordPress 針對移動設備進行了優化。您可以使用插件來確保您的 WordPress 網站適合移動設備，但標準的 WordPress 體驗設計為無論屏幕尺寸如何都能響應。

如果我的網站不適合移動設備怎麼辦？

如果您的網站不適合移動設備，您可以採取多種措施。要使您的 WordPress 網站適合移動設備，請從基礎開始：確保您的主題和設計在較小的設備上看起來不錯，並且沒有明顯的東西，例如大圖像或文件會減慢體驗。從那裡，您可以查看插件來優化您的網站，使其在任何設備上看起來都很棒。