工具用的順手嗎?
你的回饋能幫助我們做得更好
線上壓縮HTML程式碼,移除空格、註釋等冗餘字元,最佳化CSS、JS和SVG,減小檔案體積。
概覽
了解工具能解決的問題、計算或處理邏輯,以及資料邊界。
貼上 HTML 原始碼後,壓縮模式會將連續空白字元合併成一個空格、移除標籤與標籤之間的空白、刪除 HTML 註解,並清除文字開頭和結尾的空白。輸出仍是 HTML 文字,可複製或下載;頁面也會顯示輸入與輸出的字元數,以及依字串長度計算的變化比例。
這是以文字替換規則整理原始碼,不會逐一解析元素,也不會分開壓縮內嵌的 CSS、JavaScript 或 SVG。畫面上的比例代表字元長度變化,不是實際檔案位元組或網站傳輸量的保證;檔案編碼、換行格式及傳輸壓縮都會影響不同的大小口徑。
HTML 的空白和註解會依所在位置而有不同作用。一般區塊標籤之間的縮排常只是排版;但行內文字之間的空格可能是詞語分隔,pre 等預先格式化內容也會保留空白樣式。此工具不辨別這些語境:例如 <span>紅</span> <span>茶</span> 中間的空白可能被移除,顯示結果因而連成「紅茶」。腳本字串或樣式文字中的空白也可能被合併。WHATWG HTML Standard 說明了文件語法中空白、註解及預先格式化文字的規則;因此壓縮輸出應視為待檢查的版本,而非已證明等價的成品。
指南
依步驟完成操作,並透過範例核對輸入與結果。
準備要處理的 HTML 文字並貼入輸入區;也可以載入範例確認輸入和輸出區的位置。
確認模式為「壓縮」。輸入內容變更後會自動產生結果;這個模式沒有移除空格、註解或壓縮內嵌程式碼的個別選項。
查看輸出及字元數變化,優先搜尋行內標籤間距、pre/textarea 內容,以及 JavaScript 字串或 CSS 文字。
確認頁面顯示和互動符合預期後,再複製結果或下載文字檔。需要易讀縮排時,可切換到格式化模式。
例如原碼中的 <p>請按 <strong>繼續</strong> 查看</p> 含有文字分隔空白。壓縮後請實際檢查「按」與「繼續」之間、以及「繼續」與「查看」之間是否仍有合適間距;不要只憑字元變少就採用輸出。
情境
查看這項工具在不同工作與生活流程中的用法。
整理有較多縮排和註解的短片段時,可先壓縮一份副本,再貼回教材或說明文件預覽;確認程式碼中的文字間距仍正確後再使用。
想快速了解排版空白對一段 HTML 字串長度的影響,可記錄壓縮前後字元數。若要比較實際檔案大小,請將最後採用的內容存檔後,以相同編碼和檔案格式另行量測。
問答
集中解答常見疑問與容易混淆的問題。
不會。它不會分別剖析或最佳化內嵌 CSS、JavaScript 或 SVG,而是對輸入文字套用空白和註解替換規則。
因為連續空白會合併,標籤之間的空白會刪除,且處理不辨識一般文字、預先格式化區域或程式碼字串。請對照原文檢查可見間距和功能;若差異不能接受,就不要使用該輸出。
不是。它按輸入與輸出字串的字元長度計算變化,不能直接代表以特定編碼儲存後的位元組數,也不包含伺服器或傳輸層的處理。
須知
使用前了解適用範圍、結果限制與必要提醒。
此結果沒有語義等價保證,請不要覆蓋唯一的原始碼。
合併空白或刪除註解可能改變文字呈現、預先格式化內容或腳本字串。建議保留原稿,在測試頁面檢查實際排版、互動與程式輸出,再決定是否採用。它適合快速整理和初步比較短段文字;若正式專案需要依 HTML、CSS、JavaScript 語法判斷哪些字元可安全移除,請使用具相應語法處理能力的建置流程並執行專案測試。
推薦
查找相關工具、專題與可用的 API 能力。