HTML 是結構樹，不只是排整齊的標籤
HTML 格式化線上工具 — 程式碼美化、縮排與壓縮
好用的 HTML 格式化會讓父子層級與元件邊界變得清楚，也要尊重各種元素不同的解析規則。它能協助閱讀與暴露 parser 錯誤，卻不能取代 HTML conformance checker 或人工語意檢查。
展開接近 DOM 的巢狀層級
一致縮排能攤開頁面區段、landmark、清單與元件邊界。結束標籤出現在意外深度時，可能反映結構問題；但瀏覽器本身也有錯誤復原與隱含結束標籤規則，不能只靠縮排判定有效性。
<main><article><h1>標題</h1><p>內容</p></article></main>
<main>
<article>
<h1>標題</h1>
<p>內容</p>
</article>
</main>Parser boundary
不同 HTML 元素有不同解析規則
Void element 沒有結束標籤；script 與 style 是 raw text element，裡面分別可能包含 JavaScript 與 CSS。格式化模式載入對應的 Prettier parser；若內嵌語法或模板不是它能辨識的形式，結果就必須另外檢查。
Void elements
img · input · meta · link · br · hr
內嵌語言
script → Babel parser · style → PostCSS parser
審查前先格式化；確認畫面後再壓縮
做 code review、舊頁面遷移或無障礙稽核前，先用一致縮排和行寬把 HTML 結構展開。
此壓縮設定會摺疊空白、移除一般註解、縮短 doctype 與布林屬性；屬性引號、optional tags、空元素及 script/style 內容則刻意保留。
空白可能影響 inline flow、文字節點、preformatted content 與模板。正式網站應把 minify 放進可測試的 build pipeline；這裡較適合檢查片段與比較輸出差異。
排版成功，不能證明 HTML 語意或規範都正確
Prettier parser 或 minifier 能拒絕部分無法處理的語法，也可能正規化可復原的標記；它們不會替你檢查 content model、標題順序、label、landmark、ARIA、metadata 或整份文件是否符合 HTML Standard。
- 檢視 parser 錯誤與格式化前後 diff
- 確認巢狀層級、空白與頁面區段邊界
- 另用 Nu Html Checker、無障礙工具與瀏覽器測試
HTML 格式化常見問題
格式化會自動修復無效 HTML 嗎？
不保證。parser 可能正規化部分可復原寫法，也可能直接報錯，但無法推測你原本的 DOM 或語意意圖。請比較輸出差異，並用專門的 HTML conformance checker 檢查。
script 和 style 裡的程式碼會怎麼處理？
格式化模式載入 Babel、Estree 與 PostCSS plugin，Prettier 在能辨識時會處理內嵌語言；minify 模式明確關閉 minifyJS/minifyCSS，不會壓縮 script 或 style 內容。特殊模板與非標準語法仍需人工複核。
壓縮 HTML 會改變頁面空白嗎？
可能會。設定會摺疊會形成文字節點的空白，並移除大多數一般 HTML 註解；inline 元素、preformatted content、email HTML 與模板尤其需要比較實際渲染。