LCP欠佳，LCP是什么意思?LPC問題怎么解決 谷歌優(yōu)化

新聞 2023-12-05編輯：深圳網(wǎng)站建設(shè)閱讀（）標(biāo)簽： LCP

在本指南中，什么是 LCP，LCP是什么意思？什么原因?qū)е?LCP 不佳？LPC問題怎么解決 怎么測式LCP、它的好處以及您可以進(jìn)行哪些改進(jìn)來優(yōu)化您的網(wǎng)站。

什么是 LCP，LCP是什么意思？

LCP 是Largest Contentful Paint 的縮寫。LCP是衡量頁面速度的指標(biāo)；它告訴您加載網(wǎng)頁的主要內(nèi)容需要多長時(shí)間（基本上是當(dāng)頁面變得對用戶可讀時(shí)。）LCP 是用戶體驗(yàn)不可或缺的一部分。當(dāng)用戶可以立即在其他地方獲得更好的體驗(yàn)時(shí)，他們通常不想閑逛并等待網(wǎng)站加載。 如果你的 LCP 很差，你可能會(huì)遇到更高的跳出率，你的整體排名可能會(huì)受到影響。糟糕的 LCP 甚至?xí)?dǎo)致較低的轉(zhuǎn)化率。 由于 Google 的 Core Web Vitals 更新，LCP 正在成為您在 SERP 上排名的一個(gè)更重要的因素。為了保持有機(jī)排名并維持這些訪問者，保持在 LCP 的頂部是非常重要的。

LCP 僅適用于首屏的主要內(nèi)容。這包括無需用戶向下滾動(dòng)即可顯示的任何圖像、視頻或文本塊。在注意任何問題區(qū)域時(shí)，請記住這一點(diǎn)。

定義好的或差的 LCP

根據(jù) Google 的指南，您頁面的主要內(nèi)容應(yīng)在用戶訪問的前 2.5 秒內(nèi)加載，以獲得良好的 LCP。下圖更詳細(xì)地顯示了這一點(diǎn)：

如果您的用戶必須等待五秒鐘或更長時(shí)間才能加載主要內(nèi)容（即您的 LCP 很差并且需要改進(jìn)），他們很可能會(huì)放棄并尋找其他地方。

Google 的指南進(jìn)一步規(guī)定，您的 LCP 需要至少在 75% 的時(shí)間內(nèi)排名為“良好”。如果你能做到這一點(diǎn)，你的表現(xiàn)就會(huì)飆升。

我們稍后會(huì)查看您的特定 LCP?，F(xiàn)在，讓我們關(guān)注導(dǎo)致 LCP 不佳的一般原因以及如何解決這些問題。

什么原因?qū)е?LCP 不佳？

從技術(shù)上講，可能導(dǎo)致 LCP 不佳的原因列表是無法全部解釋清楚的。

它可以是占用大量空間的任何東西導(dǎo)致：可以減慢頁面速度的內(nèi)置媒體播放器、未優(yōu)化圖像的幻燈片、社交媒體按鈕，甚至是登錄等小部件。

但讓我們更具體一點(diǎn)。

如上圖所示，導(dǎo)致 LCP 不佳的因素通常屬于四大類：

1. 服務(wù)器響應(yīng)時(shí)間慢

服務(wù)器響應(yīng)時(shí)間緩慢會(huì)對您的所有加載速度指標(biāo)產(chǎn)生負(fù)面影響，因此是導(dǎo)致 LCP 不佳的明確原因。

服務(wù)器響應(yīng)時(shí)間緩慢通常是由于您的后端基礎(chǔ)設(shè)施問題、未優(yōu)化的數(shù)據(jù)庫查詢或需要很長時(shí)間才能解決的 API 響應(yīng)造成的——所有這些都發(fā)生在您站點(diǎn)的后臺。

改善這一點(diǎn)的第一步就是確保您在良好的服務(wù)器上托管您的網(wǎng)站。

2. 渲染阻塞 JavaScript 和 CSS

盡管自定義您的網(wǎng)站是讓它脫穎而出的好方法，但不幸的是，添加 JavaScript 和 CSS 來美化您的網(wǎng)站主題及其內(nèi)容也會(huì)影響您網(wǎng)站的加載時(shí)間。

有時(shí)，為了您的 LCP，堅(jiān)持使用不那么“重”的站點(diǎn)設(shè)計(jì)并減少您擁有的插件數(shù)量，尤其是首屏插件的數(shù)量是一個(gè)更好的主意。

3. 客戶端渲染

客戶端渲染（也就是使用 JavaScript 在瀏覽器中直接渲染網(wǎng)頁）是一種非常流行的 Web 開發(fā)方法。

但是，瀏覽器在呈現(xiàn)主要內(nèi)容之前會(huì)反復(fù)收集和加載 JavaScript，并且更多時(shí)間等待用戶。

如果您還依賴客戶端渲染，那么在處理 LCP 時(shí)可能需要考慮一下。

4. 緩慢的資源加載時(shí)間

頁面上的大量資源或具有可視化沖擊力的內(nèi)容必然需要花費(fèi)大量時(shí)間來加載——這就是生活中的事實(shí)。

如果您有大量未優(yōu)化的高質(zhì)量圖像、GIF 和文本框要在首屏呈現(xiàn)，您的 LCP 將會(huì)受到影響。

繼續(xù)閱讀以了解有關(guān)優(yōu)化這些內(nèi)容以改進(jìn) LCP 的更多信息。

LPC問題怎么解決

有一些針對較差 LCP 的修復(fù)程序 – 其中一些比其他更容易。我們將在這里帶您了解一些更簡單的方法。

1. 優(yōu)化你的 CSS

CSS 文件是阻止渲染的資源。在服務(wù)器渲染整個(gè)頁面之前，必須加載和處理資源。

您可以通過手動(dòng)刪除未使用的代碼、最小化正在使用的 CSS 文件或使用媒體查詢優(yōu)化 CSS 背景圖像來優(yōu)化 CSS 文件。

2. 優(yōu)化你的圖片

在優(yōu)化圖像時(shí)，您可以采取幾個(gè)步驟。主要有以下幾種：

壓縮您的圖像

考慮將您的圖像轉(zhuǎn)換為更有效的格式

使用視頻代替 GIF（加載時(shí)間更短）

確保您的圖像具有正確的尺寸

而且總是值得思考：我真的需要這張圖片嗎？它是否向我的頁面添加了任何內(nèi)容？如果沒有，可能值得擺脫它。

3. 優(yōu)化你的網(wǎng)頁字體

字體通常是大文件。因此，在加載字體文件之前，不常見字體的文本內(nèi)容不會(huì)顯示在頁面上。

用戶需要更長的時(shí)間才能在網(wǎng)頁上看到重要信息！那是不行的。

為了避免這種情況，您需要優(yōu)化您的 WebFonts。通過減小 WebFont 的大小、使用字體顯示或更新頁面樣式以使用自定義字體，頁面加載速度應(yīng)該會(huì)加快。

4. 優(yōu)化你的 JavaScript

您的 JavaScript 已經(jīng)運(yùn)行了一段時(shí)間，可能值得檢查一下，因?yàn)樗赡軙?huì)降低您的頁面加載速度。

您可以做一些事情來優(yōu)化您的 JavaScript（給定最新的 LCP 指標(biāo)）包括：

刪除未使用的代碼

檢查您的代碼是否是最新的并與現(xiàn)代瀏覽器兼容

安裝現(xiàn)代 JavaScript 并通過代碼拆分減少有效負(fù)載

怎么測式LCP

那么，您如何知道您的 LCP 是什么？

檢查 LCP 性能的一個(gè)好地方是使用 Google 提供的工具：Google Search Console、Google Page Insights 和 Lighthouse。

您會(huì)在 Google Search Console 的左側(cè)導(dǎo)航欄中找到 Core Web Vitals 標(biāo)簽。進(jìn)入此選項(xiàng)卡將顯示您的 URL 概覽。從那里，很容易看到可能存在的問題以及您可以進(jìn)行哪些調(diào)整來解決這些問題。

如果您沒有為您的網(wǎng)站設(shè)置 Google Search Console，請不要擔(dān)心。您還可以通過 Lighthouse 和 PageSpeed Insights 工具訪問此信息。

這是 Amazon 桌面站點(diǎn)的 Page Insights 概述。它向我們展示了所有 Core Web Vitals：

如您所見，Largest Contentful Paint 的表現(xiàn)相當(dāng)不錯(cuò)，但總有改進(jìn)的余地。前往“機(jī)會(huì)”部分，探索所有建議并抓住所有這些機(jī)會(huì)以獲得更好的排名。

及時(shí)完成這些建議以并經(jīng)常檢查以確保您的 LCP 和其他站點(diǎn)指標(biāo)持續(xù)的改進(jìn)。

總結(jié)

現(xiàn)在您知道如何使您的 LCP 性能保持最新以及在哪里可以發(fā)現(xiàn)改進(jìn)點(diǎn)。如果您定期完成站點(diǎn)審核中的每條建議，那么您的 LCP 和核心 Web 生命指標(biāo)就會(huì)得到改進(jìn)。，隨著時(shí)間推移，您一定會(huì)提升您的網(wǎng)絡(luò)速度性能。

• 上一章：工業(yè)企業(yè)如何做搜索引擎推廣和網(wǎng)絡(luò)營銷
• 下一章：INP 是什么？如何改進(jìn) INP 谷歌優(yōu)化