什麼是 Google Lighthouse 以及如何使用它

Google Lighthouse是一種開源 API，旨在幫助網絡開發人員根據特定指標審核其網站的性能和質量。 其中一項指標是搜索引擎優化 (SEO)，這使 Lighthouse 成為一個非常有用的工具，可幫助您提高網站的搜索引擎結果頁面 (SERP) 排名。

在本文中，我們涵蓋了您需要了解的有關 Google Lighthouse 的所有信息，包括它運行審計所依據的指標。 我們還向您展示瞭如何使用審核結果來優化您的網站以獲得更高的 SERP 排名、更高的點擊率、改善的用戶體驗和其他好處。

什麼是谷歌燈塔？

Google Lighthouse 經常被比作另一個名為 PageSpeed Insights 的軟件。 但重要的是要注意這兩個程序之間存在差異。

PageSpeed Insights 與 Lighthouse

Lighthouse 和 PageSpeed Insights 有一些共同特徵。 例如，它們都是由谷歌開發的，它們都具有評估給定網頁性能的能力。 此外，PageSpeed 由 Lighthouse 的分析引擎提供支持，這清楚地表明這些工具旨在相互補充。

但是，雖然 PageSpeed 更側重於性能指標（例如，網頁的加載時間、響應能力和視覺流暢度），但 Lighthouse 更進一步並評估其他元素，如 SEO 和可訪問性。

因此，為了更全面地評估您網站的性能，以及網站的用戶可訪問性、最佳實踐、SEO 等，Lighthouse 測試是比 PageSpeed Insights 更好的選擇。

運行燈塔的工具

Chrome 開發者工具

如何使用 Chrome DevTools 運行 Google Lighthouse

第 1 步：打開您要測試的網頁。

第 2 步：打開 Chrome DevTools，然後單擊標有“Lighthouse”的選項卡。

第 3 步：單擊“分析頁面加載”並啟用所有審核類別。

第 4 步：點擊“Run audit”，在 30-60 秒內，您的 Lighthouse 報告應該會出現。

如何在 web.dev 中使用 Google Lighthouse

第 1 步：轉到pagespeed.web.dev

第 2 步：輸入要審核的網站的 URL。

第 3 步：點擊“分析”。

Chrome 擴展程序

如何通過 Chrome 擴展程序使用 Google Lighthouse

第 1 步：在您的 Google Chrome 瀏覽器上安裝Google Lighthouse Chrome 擴展程序。

第 2 步：導航到您要測試的網站。

第 3 步：單擊 Chrome 地址欄右側的燈塔符號，或者通過擴展菜單訪問燈塔。

第四步：點擊“生成報告”。

節點模塊

如何在 Node 中使用 Google Lighthouse

第 1 步：在桌面上下載 Google Chrome。

第 2 步：安裝最新版本的 Node（確保它是長期支持版本）。

第 3 步：通過輸入“npm install -g lighthouse”將 Lighthouse 安裝為全局模塊。

第 4 步：使用提示符“lighthouse <url>”運行審核

Google Lighthouse 審計的工作原理

Google Lighthouse 審核根據五個不同的報告類別評估網站。

報告類別：

•性能
•無障礙
•搜索引擎優化
•最佳實踐
•漸進式網絡應用 (PWA)

每個類別的得分為 0-100，0 表示失敗，100 表示完美。

Google Lighthouse 性能指標是如何計算的？

最新版本的 Google Lighthouse（版本 8 和 9）根據七個不同的指標計算網頁性能的總體得分。 每個指標佔分數的一定百分比。

以下是七個性能指標的列表以及每個指標可以獲得的最高分數，總最高分數為 100%。

• Largest Contentful Paint (LCP)：25%
•總阻塞時間（TBT）：30%
• First Contentful Paint (FCP)：10%
•速度指數（SI）：10%
•交互時間 (TTI)：10%
•累積佈局偏移 (CLS)：15%

為什麼分數每次都變？

您可能會注意到，每次運行 Lighthouse 報告時，給定網頁的性能得分都不同——即使您快速連續運行多個報告也是如此。

這不是什麼值得擔心的事情，因為這通常是由於您無法控制的因素造成的。 例如，您的互聯網連接速度可能與上次測試時不同，或者網頁可能正在運行不同的廣告。

表現

您可能想知道我們之前提到的這七個性能指標實際上衡量的是什麼。 下面是每一個的概述。

FCP 測量網頁上的第一個文本塊或圖像完整顯示在屏幕上所需的時間。

速度指數 (SI)

SI 評估在特定時間段內平均加載網頁的多少可見部分（即每秒加載多少可見部分）。

SI評分

每個網站的目標都是 SI 分數不超過 4.3 秒。 高於 4.3 秒的 SI 分數表明該網頁完全加載所需的時間太長。 從用戶的角度來看，這意味著他們更有可能變得不耐煩並離開您的網站去尋找更快的網站。

互動時間 (TTI)

TTI 計算從網頁開始加載到網頁變得交互（即能夠接受用戶的命令或提示）之間的時間段。

累積佈局偏移 (CLS)

CLS 可以全面衡量網頁佈局在加載期間的變化程度。

輔助功能

Lighthouse 為您的網站評分的另一個方面是可訪問性。

根據谷歌的說法，每個站點都應該盡可能地讓各種用戶訪問，包括那些有身體障礙的用戶。 這些人無法像您一樣瀏覽或瀏覽您的網站。 但是，通過適當的無障礙措施，他們也可以最大程度地利用它。

“可訪問”是什麼意思？ 有多種方法可以將此元素應用於您的網站，但其中一些最重要的方法包括：

•您的網站可以通過鍵盤訪問和導航，而不僅僅是鼠標。
•您的站點使用語義 HTML 編碼，以便視障人士可以使用它。
•您的站點具有高對比度文本，讓所有類型的讀者都可以在不影響視力的情況下查看和閱讀它。

搜索引擎優化

Lighthouse 在您的網站上運行的最重要的報告之一是用於 SEO 或搜索引擎優化。

為谷歌等搜索引擎優化您的網站是使您的網站在搜索引擎結果頁面 (SERP) 中排名更高的方式。 排名越高，用戶點擊它的可能性就越大。

谷歌在評估網站的搜索引擎優化時會考慮幾個因素，包括：

•關鍵詞
•反向鏈接
•展示專業知識、權威性和可信度 (EAT) 的有用內容
•網站速度

最佳實踐

最佳實踐是技術的總稱，您可以使用這些技術來提高網站運行的流暢性和直觀性。 它涵蓋了廣泛的優化，例如：

•修復記錄的瀏覽器錯誤
•以正確的寬高比顯示圖像
•讓您的網站運行得更快
•提高網站的安全性
•向用戶請求地理定位和通知權限，以創建更具吸引力和實用性的體驗

漸進式網絡應用程序 (PWA)

漸進式 Web 應用程序(PWA)是一種以網頁形式交付應用程序的軟件。 它適用於任何符合標準的瀏覽器，包括 Chrome。

PWA 提供的應用程序可以由站點訪問者填寫，以向站點所有者提供重要數據，例如聯繫信息。

Lighthouse 審核網站上的 PWA，以評估它們的速度、可見性、可靠性等。

以下是構成優秀 PWA 的綜合清單。

Core Web Vitals (CWV) 如何融入 Google Lighthouse 報告

核心網絡生命力 (CWV)是適用於所有網站的指標，因此無論網站的設計目的或目標受眾是誰，都應始終對其進行衡量。

核心 Web Vitals 由三個指標組成：大量內容繪製 (LCP)、總阻塞時間 (TBT) 和累積佈局偏移 (CLS)。

我們在有關性能的部分中討論了這些指標。 以下是每個術語的含義的簡要概述。

• LCP：衡量網頁上最大文本塊、圖像或視頻對用戶完全可見的點。
• TBT：衡量網頁在 LCP 加載後完全可見所需的時間。
• CLS：衡量網頁佈局在加載元素時發生的變化。

CWV 佔 Lighthouse 績效審計分數的 65% 左右。

使用 Google Lighthouse 進行性能測試

Lighthouse 是一個非常有效的性能測試工具。 它會生成一份強大、全面的報告，可以幫助您識別導致網站速度變慢或導致其 SERP 排名較低的弱點。

如何使用 Google Lighthouse 提高網站性能

優化網站速度和加載時間

如果您需要優化網站的速度和加載時間，Lighthouse 的性能和最佳實踐審核將向您展示可以改進的地方。

改善網站的可訪問性和用戶體驗

為了改善網站上的用戶可訪問性和體驗，性能、可訪問性、最佳實踐和 PWA 審核最有效。

確保網站安全和數據隱私

Lighthouse 通過運行最佳實踐審核幫助您確保網站安全和用戶的數據隱私。

為網站優化做出數據驅動的決策

數據是網站所有者和管理員的朋友。 它向您展示了您需要在何處進行更改以優化您的網站以接近完美。 運行 Lighthouse 是獲取所有類型指標數據的一種聰明而簡單的方法，尤其是性能，其中可能隱藏了弱點。

Google Lighthouse 的高級功能

自定義審計和腳本

由於 Lighthouse 是開源的，您可以選擇根據您的獨特需求設置自定義審計和腳本。

例如，您可以編寫審計程序來衡量您網站上的某個頁面是否包含在站點地圖中。 這很重要，因為谷歌在 SERP 中對網頁進行排名時主要讀取站點地圖。

將 Google Lighthouse 與其他性能工具集成

如果您有一個已用於站點的性能工具，則可以將 Google Lighthouse 與其集成以進一步增強您的審核。

使用 Google Lighthouse 進行移動優化

通過一些技巧，您甚至可以使用 Google Lighthouse 來審核您的網站以進行移動優化。

結論

如果您的網站的 SERP 排名較低，因此沒有獲得任何有意義的有機流量，則全方位審核可以幫助您確定是什麼阻礙了您的網站取得成功。

Google Lighthouse 是終極網站審核工具。 它會準確地向您顯示您的網站在幾個不同指標（包括 SEO）中的問題所在，這些指標阻止了它被 Google 的算法排名更高。

一旦知道問題區域在哪裡，您就可以開始進行優化，以提高您的 SERP 排名，從而增加有機流量。