HTML 頁面權重分析工具會測量您貼上的 HTML 文件的 UTF-8 位元組大小，將該總和拆分為內嵌指令碼、樣式區塊、資料 URI 以及外部資源參考，並以一個 2,000,000 位元組的參考值進行標示，該參考值反映了 Googlebot 已記錄的每個 URL 2 MB 配額。標題上的數字是您提交文字的精確 UTF-8 位元組長度，使用瀏覽器的 TextEncoder API 計算，並附上 Unicode 碼點計數，讓您能看出 JavaScript 字串長度與位元組長度之間的差異。內嵌指令碼文字、內嵌樣式文字以及資料 URI 屬性值會計入該總和；參考的外部檔案僅依 URL 列出，但不會被擷取或稱重。所有處理都在一個分離的 template 片段中進行 — 分析工具不會請求資源、執行貼上的指令碼、提交表單，或上傳您的標記。2 MB 標籤僅是針對主體的十進位參考值，並非 Googlebot 會對該頁面建立索引的保證，該工具在回傳任何位元組總和時，都會一併顯示這個頁首免責說明。

how do i use html page weight html page size analyzer
HTML 頁面權重分析工具結果剖析

該工具實際測量的是貼上 HTML 的哪些內容

當您開啟 HTML 頁面權重分析工具並貼上一段回應主體時，分析工具會執行一條固定的處理流程。它首先使用瀏覽器的 TextEncoder API 測量您貼上文字的總 UTF-8 位元組數，因為 ASCII 字元通常佔用一個位元組，而帶腔字母、CJK 文字及表情符號會佔用更多，這正是字元計數不適合作為標題數字的原因。它也會回報 Unicode 碼點計數，讓 JavaScript 字串長度與 UTF-8 位元組長度之間的差異保持可見。接著，它在一個分離的 template 片段中解析標記，並走訪產生的樹狀結構，以分類來源各部分的實際貢獻。內嵌指令碼與內嵌樣式文字會被讀出並以 UTF-8 位元組重新稱重；外部 script 元素僅依 src 屬性列出，絕不會被擷取；樣式表、preload 以及模組連結透過 rel token 進行識別；直接的圖片、媒體及框架屬性會被盤點；而 srcset 值會作為單一宣告保留，因為資料 URL 會讓天真的逗號切分變得不安全。最終結果是貼上 HTML 的位元組總和、內嵌片段的百分比細分、資料 URI 位元組計數，以及一份有界線的外部參考清單 — 之所以設有界線，是為了避免非常大的回應產生無界線的結果檢視。

準備您將貼上的 HTML

誤導性數字的最大單一來源是不良的輸入，而您選擇的輸入會決定分析工具能告訴您什麼。檢視網頁原始碼是公開頁面最快速且可靠的擷取方式：它會顯示完整的原始回應主體，保留所有原始層級的空白與 HTML 註解。當伺服器因使用者代理、語系、驗證或裝置而產生不同輸出時，從 DevTools 儲存的回應主體或經授權的 curl 擷取會更為理想，因為您可以儲存伺服器實際發送給該代表性用戶端的精確位元組。請避免在 JavaScript 執行後從「Elements」面板複製。框架在執行階段所做的變更會與原始回應混在一起出現，而原始層級的細節（例如 HTML 註解、原始屬性順序，以及特定的 meta 標記）則可能會被遺失。請將「Elements」面板的複製視為除錯提示，而非測量輸入，並在首次數字看起來可疑時，從儲存的主體重新測量。

如何使用 HTML 頁面權重分析工具

完整的工作流程很短，每個步驟都對應到結果的特定部分。

  1. 使用「檢視網頁原始碼」、DevTools 儲存功能，或經授權的 curl 執行來擷取未壓縮的 HTML 回應主體，並複製整段回應主體文字。
  2. 將主體貼到 HTML 頁面權重分析工具中並執行分析。等待總 UTF-8 位元組計數、碼點計數、內嵌指令碼與樣式百分比、資料 URI 位元組計數，以及有界線的外部資源盤點以文字形式呈現。
  3. 將標題上的數字與分析工具顯示的 2,000,000 位元組參考值進行比對。若您在限額之下記錄剩餘位元組，若超過則記錄超出量，並記住分析工具僅標示主體。
  4. 開啟細分結果，找出單一最大的原始層級熱點：通常是一大段內嵌指令碼、一塊內嵌樣式，或一堆資料 URI。
  5. 在已部署的來源上套用最小且真實的修正：將某段指令碼或關鍵 CSS 移至可快取的外部檔案、移除重複的序列化資料、將 Base64 圖片替換為真正的檔案 URL，或修剪應延遲載入的內嵌承載內容。
  6. 使用相同的擷取方法（而非進行中的草稿）重新測量已部署的回應，並確認位元組計數朝正確方向變動。

依據 2 MB 參考值解讀數字

分析工具將 2,000,000 位元組標示為 Google 已記錄的每個 URL Googlebot 2 MB 配額的保守十進位參考值，其中所述限制適用於未壓縮資料，而 HTTP 標頭會佔用每個 URL 配額的一部分，如 Google 的 Inside Googlebot 文章所述。由於分析工具僅能看見主體，它無法證明 Googlebot 實際會在哪裡停止，且它也會告訴您這一點。顯示的比較結果是一個透明的主體參考值，而非認證。在位元組總和下方，分析工具會以佔完整來源的百分比顯示內嵌指令碼位元組、以百分比顯示內嵌樣式位元組，以及資料 URI 位元組計數。外部資源盤點會列出該標記所指向的外部指令碼、樣式表、圖片、框架、preload 及媒體參考的數量，但絕不會將其承載位元組加總至總和中。接近參考值的數字仍需對回應標頭、傳輸大小，以及您所設定的任何快取進行合理性檢查。

分析工具稱重與僅列出的內容

分析工具會回傳兩類結果，將其混淆是最容易誤讀輸出的方式。

分析工具計入位元組總和的內容 分析工具僅列出但不稱重的內容
貼上 HTML 主體的總 UTF-8 位元組 外部 script 的 src URL
同一主體的 Unicode 碼點計數 外部樣式表、preload 及模組連結目標
script 元素內的內嵌指令碼文字 圖片、媒體及 iframe 參考計數
style 元素內的內嵌樣式文字 srcset 作為單一宣告保留
每個屬性值計算一次的資料 URI 位元組 標頭大小、快取行為及傳輸壓縮
工具不會讀取任何標頭位元組 外部指令碼、CSS、圖片及媒體的承載大小

找出最大的原始層級熱點

請將細分結果視為除錯地圖，而非效能評分，因為分析工具向您展示的是來源本身在哪些地方龐大。較大的內嵌指令碼位元組通常指向序列化的應用程式狀態、重複的水合資料，或應存在於具有長快取生命週期之可快取外部檔案中的程式庫。較大的內嵌樣式位元組通常代表重複的關鍵 CSS，這類內容應歸入外部樣式表，而非在每次頁面渲染時重複。龐大的資料 URI 總和幾乎總是反映出因歷史因素而內嵌的 Base64 圖片或字型，這類內容若改為獨立檔案，會更小、可快取，且可平行擷取。冗長的外部資源盤點則是另一種訊號。僅憑參考數量本身並非效能評分，但一長串重複或近乎重複的標記，通常指向會多次發出相同分析、行銷或樣式程式碼片段的樣板程式碼。分析工具將計數設有界線，讓您能看出模式，而無需捲動數千列。

依據結果採取行動並重新測量已部署的回應

找出熱點後，請在已部署的來源上進行最小且真實的變更，並重新測量真實的回應，而非編輯器中的草稿。將適當的程式碼移至可快取的外部檔案、移除重複的序列化資料、停止在資料 URI 中嵌入大型二進位承載內容，並將關鍵中繼資料與可見內容置於回應的較前位置，使最實用的文字落在位元組參考值以下。接著，請驗證已部署的位元組、回應標頭、渲染輸出，以及您能收集到的任何索引證據。較小的貼上數字是除錯線索，而非排名保證，它是迴圈中的第一步，而非最後一步。每次變更後，請重新執行相同的擷取與相同的貼上，以保持比較公平，並在細分結果不再指向單一主導熱點時停止最佳化來源。

如果您正在權衡各種方案，從 HTML 原始碼取得您的 LinkedIn 個人檔案連結對此有詳細介紹。