Page Size Checker
輸入一個 URL
網頁大小檢查器
這個免費工具可以估算網頁 — 瀏覽器需要下載的 HTML、CSS、程式碼、圖片及其他資源的總傳輸大小。當你覺得網頁載入緩慢、新增了媒體內容，或是在進行基本的效能評估時，都可以使用它。
執行快速檢查
- 貼上完整的網頁網址 (URL)
- 點擊檢查
- 檢視總大小（通常以 KB 或 MB 顯示）
- 比較你網站上的重要頁面，而不單只檢查一個網址
單純的大容量並不一定代表有問題，但這是一個強烈的訊號，提示某些部分可能需要進行最佳化。
「網頁大小」實際上包含什麼
當有人開啟網址時，瀏覽器下載的不只是文字，它還會載入：
- HTML 文件
- 樣式表 (CSS)
- JavaScript 檔案
- 圖片與圖示
- 字型
- 嵌入式媒體
- 第三方指令碼（分析工具、廣告、小工具、聊天工具）
網頁大小就是這些資源的總和。較重的網頁通常需要較長時間才能變得可用，特別是在流動網絡 (流動數據) 環境下。
為什麼網頁重量會影響真實用戶
緩慢的網頁會消耗用戶的專注力。
使用手機、較差網絡連線或有限數據計劃的訪客會最先感受到影響。即使在高速 Wi-Fi 下，過大的圖片和過多的指令碼也會延遲互動。
從業務和 SEO 的角度來看，過多的網頁重量通常會表現為：
- 更高的跳出率
- 較差的手機瀏覽體驗
- 關鍵頁面的轉換率降低
- 更難達到效能目標（包括與核心網頁指標 Core Web Vitals 相關的指標）
搜尋引擎不會單為了「小網頁」而給予更高的排名 — 但速度和可用性很重要，而網頁大小正是影響這兩者的其中一個關鍵因素。
是什麼通常讓網頁變得過重
| 常見原因 | 為什麼會增加重量 |
|---|---|
| 未最佳化的圖片 | 未經壓縮就上載的原尺寸相片 |
| 過多的指令碼 | 追蹤器、標籤、輪播圖片和未使用的 JS |
| 大型影片嵌入 | 自動播放或高位元率的媒體 |
| 臃腫的主題/外掛程式 | 每個頁面都載入額外的 CSS/JS |
| 未精簡的程式碼 | 比實際需要更大的 CSS/JS |
| 多個字型檔案 | 一次載入多種字重和字型系列 |
在實際情況中，圖片和第三方指令碼是最常出現的問題來源。
實用的網頁大小目標（參考指引而非金科玉律）
沒有任何一個數字適合所有網站。情境至關重要 — 相片作品集的網頁重量自然會比純文字文章重。
不過，以下是一些有用的實務指引：
- 盡可能保持主要著陸頁 (landing pages) 簡潔
- 將達數 MB 的頁面視為警告訊號，除非該媒體內容是必需的
- 在進行重大設計、外掛程式或內容更改後重新檢查
- 比較同類型的頁面（例如：所有網誌文章、所有產品頁面）
如果某個產品頁面明顯比其他頁面重得多，請檢查究竟新增了甚麼內容。
如何在不破壞設計的情況下縮減網頁大小
- 在上載前壓縮並調整圖片尺寸；在支援的情況下，優先使用 WebP 等現代格式
- 對首屏以下的圖片和非關鍵媒體進行延遲載入 (lazy-load)
- 移除全站載入但未使用的外掛程式/指令碼
- 精簡 CSS 和 JavaScript，並避免載入你沒有用到的程式庫
- 限制第三方標籤，只保留你真正需要的
- 更有效率地寄存字型，且只載入你實際用到的字重
- 審查嵌入內容 — 一個沉重的小工具，其重量隨時超越其他地方小心翼翼的最佳化成果
在每次進行有意義的修改後，在相同的網址再次執行檢查器。
網頁大小 vs 完整速度測試
這個工具專注於網頁有多重。
完整的速度測試（實驗室或實際欄位數據）還會評估時間、渲染和互動指標。建議兩者並用：
- 網頁大小檢查器 → 快速找出重量問題
- 速度 / PageSpeed 工具 → 了解載入時間與以用戶為中心的指標
網頁重量通常是最容易入手的地方，因為修正方法非常具體明確。
常見問題
網頁大小檢查器是免費的嗎？
是的，無需註冊。
較小的網頁排名一定比較好嗎？
不一定。較小的網頁通常載入較快，而更佳的效能有助於 SEO 和轉換率 — 但內容品質和相關性依然十分重要。
為什麼我的網頁比預期的還要大？
通常是由於圖片、影片或第三方指令碼所致。請檢查最近新增了甚麼內容。
我可以完全信賴單一次的測量結果嗎？
請將其視為有用的估算值。快取、CDN 行為和動態內容可能會導致微小的差異。
是不是每個網頁都應該越小越好？
目標是保持高效而非空洞。保留必要的媒體內容，剔除無謂的浪費。
相關工具
備註：結果反映的是檢查當刻所偵測到的資源。動態載入的內容和個人化資產可能會改變用戶在真實瀏覽器中所體驗到的最終網頁重量。