用(yòng)戶體(tǐ)驗已經成為(wèi)
網站建設的重要标準，越來越多(duō)的公(gōng)司都會以“網站建設的目的是什麽，網站建設的受衆是誰”這個來理(lǐ)念來貫徹整個網站建設。今天深圳網站建設公(gōng)司就和大家分(fēn)享一下如何提升WordPress建站的用(yòng)戶體(tǐ)驗感。
1. 使用(yòng)快速的網絡主機
正如我所提到的，服務(wù)器響應時間也稱為(wèi)首字節時間 (TTFB) 會影響每個核心 Web 重要指标。負責服務(wù)器響應時間的第一大因素是您的網絡主機。他(tā)們使用(yòng)的堆棧非常重要。
雖然快速的服務(wù)器響應時間并不能(néng)保證您會粉碎核心 Web Vitals，但它為(wèi)這樣做提供了正确的基礎。沒有(yǒu)正确的基礎，其他(tā)一切都可(kě)能(néng)不會産(chǎn)生預期的結果。越快越好。因此，請确保您的網絡主機速度快，并且他(tā)們使用(yòng)的是良好的技(jì )術堆棧。
例如，在Convesio，他(tā)們不遺餘力地提供最高可(kě)用(yòng)的硬件和軟件來支持他(tā)們的平台。這就是他(tā)們集成 Cloudflare Enterprise 功能(néng)以提高性能(néng)的原因。這意味着用(yòng)戶可(kě)以為(wèi)構建快速且對 Core Web Vitals 友好的網站打下堅實的基礎。
2. 使用(yòng)基于服務(wù)器的緩存
WordPress 博客和 WooCommerce 大多(duō)是動态而非靜态的。這意味着網站上的項目不斷變化。由于這些更改是有(yǒu)規律的，并且每次訪問都必須對數據庫進行查詢等，因此使用(yòng)緩存來提供靜态的感覺。對象緩存可(kě)以極大地改進數據庫查詢。并且頁(yè)面緩存可(kě)以改善前端渲染。
雖然緩存可(kě)以加速 WordPress 網站，但有(yǒu)一個大問題，它被稱為(wèi)緩存命中(zhōng)率。有(yǒu)多(duō)少用(yòng)戶通過緩存獲得服務(wù)？核心 Web Vitals 的真實數據是從 Chrome 用(yòng)戶體(tǐ)驗報告 (CrUX) 中(zhōng)收集的。并不是每個 chrome 用(yòng)戶都參與其中(zhōng)。隻有(yǒu)那些“選擇同步浏覽曆史記錄、未設置同步密碼并啓用(yòng)使用(yòng)情況統計報告”的用(yòng)戶。因此，在每天訪問您網站的 1000 名(míng)用(yòng)戶中(zhōng)，隻有(yǒu) 40 名(míng)可(kě)能(néng)會解釋真實世界的數據。
因此，擁有(yǒu)更高的緩存命中(zhōng)率很(hěn)重要。雖然緩存插件很(hěn)好，但問題是命中(zhōng)率。使用(yòng)基于服務(wù)器的緩存可(kě)以顯着提高緩存命中(zhōng)率。這增加了您将緩存内容提供給為(wèi)您的真實世界核心 Web 生命報告做出貢獻的用(yòng)戶的機會。請記住，實驗室數據不算數。如果您的 Web 主機不提供基于服務(wù)器的緩存，您可(kě)以使用(yòng)Cloudflare為(wèi)您的站點提供更高的緩存命中(zhōng)率。通常，基于服務(wù)器的緩存比基于插件文(wén)件的緩存更有(yǒu)效。尤其是當您有(yǒu)很(hěn)多(duō)并發用(yòng)戶時。
3. 使用(yòng)快速輕量的主題
WordPress 是開源的，擁有(yǒu)非常龐大的社區(qū)。迄今為(wèi)止最大的 CMS 社區(qū)。雖然這是一件好事，但它也可(kě)能(néng)産(chǎn)生壞影響。例如，有(yǒu)很(hěn)多(duō)人為(wèi) WordPress 開發産(chǎn)品，諸如 WordPress 主題之類的産(chǎn)品。這些開發人員有(yǒu)不同的經曆和動機。
WordPress 社區(qū)中(zhōng)有(yǒu)許多(duō)編碼不當的主題，它們非常臃腫。使用(yòng)此類主題可(kě)能(néng)會阻礙您加快網站核心 Web Vitals 速度的努力。一個糟糕的主題會影響 TTFB 和每個指标核心 Web Vitals 指标。确保您尋找一個編碼良好的主題，該主題遵循 Google 的所有(yǒu)公(gōng)認最佳實踐。而且它很(hěn)輕，不臃腫。像Yellowlab.tools這樣的工(gōng)具(jù)可(kě)以幫助您測試任何主題的演示，看看它在考慮最佳實踐的情況下如何執行。
4. 移除不必要的插件
雖然插件不是壞事，但使用(yòng)編碼不當的插件弊大于利。當用(yòng)戶訪問您的網站時，插件會增加請求的數量。理(lǐ)想的解決方案是隻使用(yòng)必要的插件。并且還要為(wèi)各種需求尋找最輕量級和編碼良好的插件。請記住，插件的流行并不意味着它最适合該目的。
5.優化JS
優化 JavaScript (JS) 将大大改善您所有(yǒu)的核心 Web 重要指标。如果您曾經在PageSpeed Insights或Web.dev等工(gōng)具(jù)上測試過您的網站，并且收到“消除渲染阻塞資源”警告，那麽這很(hěn)可(kě)能(néng)是由 JS 引起的。您可(kě)以删除注釋和空格以減小(xiǎo) JS 文(wén)件的大小(xiǎo)。推遲加載非關鍵 JS 也會有(yǒu)所幫助。
一些插件可(kě)以幫助實現這一點，一個例子是Autooptimize。雖然我們建議您使用(yòng)基于服務(wù)器的緩存，但一些緩存插件具(jù)有(yǒu)可(kě)以實現這一點以及更多(duō)功能(néng)的功能(néng)。一個例子是 WP Rocket 和 WP Fastest Cache。如果您使用(yòng)基于服務(wù)器的緩存，您可(kě)以關閉它們的緩存功能(néng)并使用(yòng)優化功能(néng)。
6.優化CSS
當您通過 Google PageSpeed Insight 運行您的網站時，“删除未使用(yòng)的 CSS”是非常常見的建議。當用(yòng)戶訪問您的網站時，浏覽器将在呈現之前首先加載并執行您網站标題中(zhōng)引用(yòng)的所有(yǒu) CSS。如果它們太多(duō)，它會減慢速度。一些插件甚至在不需要的頁(yè)面上加載它們的 CSS。
您可(kě)以為(wèi)您的頁(yè)面生成關鍵 CSS，這将消除由 CSS 引起的所有(yǒu)問題，并且浏覽器隻會首先加載關鍵 CSS。删除空格和注釋可(kě)以減小(xiǎo)文(wén)件大小(xiǎo)。您可(kě)以使用(yòng)Asset CleanUp等免費插件删除頁(yè)面中(zhōng)未使用(yòng)的 CSS 。
7. 使用(yòng) CDN
互聯網是全球性的。除非您将網站訪問限制在特定地區(qū)，否則您将獲得來自全球各地的用(yòng)戶。雖然您的網站可(kě)能(néng)托管在您所在的國(guó)家/地區(qū)并在那裏快速加載，但您的用(yòng)戶可(kě)能(néng)位于距您 10,000 多(duō)公(gōng)裏以外的國(guó)家/地區(qū)，這對您的 Core Web Vital 分(fēn)數有(yǒu)所貢獻。
使用(yòng)内容交付網絡 (CDN) 可(kě)确保您的網站在全球範圍内快速提供服務(wù)。如果您有(yǒu)來自世界不同地區(qū)的用(yòng)戶，您會看到頁(yè)面速度有(yǒu)很(hěn)大提高，同時也提供更好的用(yòng)戶體(tǐ)驗。
8、優化廣告投放
首屏廣告對您的 LCP 和 CLS 影響最大。如果廣告中(zhōng)的圖片大于首屏的所有(yǒu)圖片或文(wén)本塊，則可(kě)以計入您網站的 LCP。在AdSense和類似廣告網絡上投放的圖片的問題在于您無法對其進行優化。而且它們可(kě)能(néng)未經優化。這是你無法控制的。如果它不會影響您的收入，請考慮移除首屏廣告，尤其是針對移動設備的廣告。此外，在首屏使用(yòng)響應式廣告會影響 CLS，因為(wèi)加載時布局會發生變化。您可(kě)以通過為(wèi)廣告設置最小(xiǎo)高度屬性來克服此問題。這将防止布局偏移。
9. 延遲加載圖片
圖像會影響頁(yè)面的大小(xiǎo)。頁(yè)面越大，加載所需的時間就越長(cháng)。延遲加載圖像将确保圖像僅在需要時加載，從而減少頁(yè)面大小(xiǎo)并縮短加載時間。您可(kě)能(néng)已經在速度測試工(gōng)具(jù)中(zhōng)看到警告“延遲屏幕外圖像”。它隻是告訴您延遲加載圖像。
10.設置圖片屬性
當布局發生變化時會發生 CLS。例如，浏覽您的主頁(yè)并突然加載圖像，頁(yè)面變大并且您正在閱讀的網站部分(fēn)現在不在視野中(zhōng)。那是布局轉變。設置 size 屬性将在頁(yè)面加載時保留該大小(xiǎo)。這樣當圖像最終出現時，不會出現布局偏移。
