什麼是Google Lighthouse?

blank

什麼是Google Lighthouse?

blank

谷歌有大量工具可用於優化您的網站。 Google Ads、Google 我的商家和 Merchant Center 就是這類工具的好例子。 你聽說過谷歌燈塔嗎?

Google Lighthouse 是一種工具,可讓您對您的網站進行審核。 它將為您分析的不同類別提供分數,以説明您盡可能地優化您的網站。 在本文中,我們將解釋Google Lighthouse究竟是什麼以及您可以用它做什麼。

什麼是谷歌燈塔?
Google Lighthouse 是一種工具,您可以使用它對您的網站進行審核。 您可以將其用作簡單的Google Chrome擴展程式或與Chrome DevTools(這是一個Web開發人員工具的集合,直接在Chrome中)一起使用。 我們將在本文中討論 Chrome 擴展程式。 如果您有興趣,可以在此處找到有關 DevTools 的更多訊息。

blank

如果您已經安裝了 Chrome 擴展程式,它看起來像上圖。

轉到您要調查的頁面,按下該工具的圖示,然後按兩下"生成報告"。

然後擴展程式打開一個新螢幕,在該螢幕中網站以不同的形式載入,因此在不同的點上進行測試。 載入頁面后,Lighthouse 會打開一個包含報告的新螢幕。

該網站在5個不同的點上進行了測試:

表現

漸進式網頁應用

無障礙

最佳實踐

搜尋引擎優化

谷歌燈塔報告
報告的第一部分如下所示:

blank

您會立即看到不同的部分以及您如何按照從 0 到 100 的等級為每個部分評分。 獲得 0 是您在任何類別中可以獲得的最低分。 但是,0 分通常表示 Lighthouse 中存在錯誤。 如果您反覆看到 0 分,您可以在 Lighthouse 儲存庫中提交錯誤。

讓我們仔細閱讀以下所有部分並解釋它們的含義:

表現評分
績效審計包括許多要檢查的點。 例如,第一次有意義的繪製 (FMP) 審計,它測量頁面的視覺內容何時顯示。 這裡準確測量的是開始頁面載入和呈現視覺圖像之間的時間。 根據谷歌網站數據,非常好的評分網站在大約 1,220 毫秒內呈現 FMP。 因此,這次對應的分數為99。

下圖基本上顯示了網頁始終如何載入。 7個步驟,先載入圖形,然後就可以實際使用出現在頁面上的第一個按鈕之類的了。 最後,整個網站都被載入了。 這個過程是Google Lighthouse的基礎。

blank

並非 Performance Score 的每一分都被同等計算。 在這裡您可以瞭解不同點的重量(每個部分)。

如果您多次執行 Lighthouse 審核,您可能會發現 Performance 元件的結果存在差異。 這是因為網站將始終以不同的方式和不同的速度載入。 這是完全正常的。

漸進式 Web 應用程式得分
漸進式 Web 應用程式(或 PWA)是具有應用程式功能的普通網站,該應用程式也可離線使用。 這意味著您的網站可以用作一種簡化的應用程式(例如,星巴克網站允許您以類似於其原生應用程式的方式訂購商品)。 這是當今的一項重要發展,因為幾乎所有事情都通過行動裝置發生。 所以這個分數衡量你的網站作為一個簡化的移動應用程式的運行情況。

PWA 分數基於Google的"Baseline Progressive Web App Checklist"。 這包含您的網站必須滿足的14點。 在審核期間,Lighthouse 會自動檢查清單上 14 點中的 11 點。 與性能分數相反,PWA 分數中的每個點都具有相同的權重。 因此,每個滿意的類別對應於 PWA 分數的 9 分。

無障礙評分
對於可訪問性分數,不同的點以不同的方式衡量(就像性能分數一樣)。 但是,這裡的不同之處在於,只有完全滿足條件才能獲得積分。 在 Performance Score 中,如果您獲得了部分分數,則可以獲得部分分數。 在這裡,情況並非如此。 要麼全有要麼全無。

對於可訪問性,您必須滿足非常明確的條件,例如:圖像具有替代文本、頁面具有可理解的語言、元素結構清晰等。

最佳實踐得分
最佳實踐評分測試了各種內容,例如 HTTPS 的使用、使用者是否可以在「密碼」欄位中粘貼文本以及不同的技術問題。

這些是其他網站上經常使用的東西,並且效果很好。 這是當今網站的標準。 此分數向您顯示您的網站如何符合此標準。

搜尋引擎優化分數
SEO 分數表明您的網站對搜尋引擎的友好程度以及您的網頁在Google(和其他搜尋引擎)中排名的難易程度。

您的網站是否適合行動裝置? 字體大小正常嗎? H1 和 H2 的標題有區別嗎?

這主要是關於頁面的外觀,技術上的設置,以及您是否可以得分並在Google上獲得高排名。

結論
您是否已經為您的企業建立了一個網站,但想要進一步優化它? 然後,讓Google Lighthouse輕鬆免費地創建報告。 您可以查看需要處理的元素以及已經優化的部分的所有詳細訊息。 通過這種方式,您可以使您的網站完全適合Google,並使其在任何設備上使用時盡可能流暢!

獎勵下載:我們為您創建了一個 SEO 清單,以優化您的產品頁面! 免費檢視:seoclubcd.com

想了解更多關於 Facebook 與 Google 廣告投放?

What do you think?

Written by marketer

使用 Chrome 開發者工具的 lighthouse 功能分析 web 應用的性能問題

Chrome團隊:如何曲線拯救KPI