このツールは構造の読みやすさを重視しています。ネストした要素を適切な深さに配置しながら、属性、コメント、宣言、テキスト内容を残します。コメントの削除やデータ量の圧縮は行わないため、HTML圧縮ツールとは用途が異なります。マークアップはローカルで処理され、アップロードされません。
無料HTML整形ツール
すべてブラウザー内で動作します。アップロードも登録も不要です。
HTML
整形済みHTML
HTMLを貼り付けると整形します
HTML整形ツールとは？
HTML整形ツールは、圧縮されたマークアップやインデントが不規則なコードを、読みやすく統一されたHTMLに整えます。文書または断片を貼り付け、2スペース、4スペース、タブから選んで結果をコピーできます。HTML5の空要素、一般的な省略可能終了タグ、scriptやstyleの生テキストも判別します。処理はすべてブラウザ内で完結します。
使い方
- 1HTMLを貼り付ける. 完全なHTML文書、テンプレート、断片を入力欄に貼り付けるか、サンプルを読み込みます。
- 2インデントを選ぶ. 2スペース、4スペース、タブから選びます。整形結果はすぐに更新されます。
- 3構造を確認する. 要素数、属性数、深さを確認してから、インデントされた結果を読みます。
- 4結果をコピーする. 整形済みHTMLをコピーし、エディター、CMS、コードレビューへ貼り付けます。
こんな方に
- フロントエンド開発者が、ネストの不具合を調べたりdiffを確認したりする前に、圧縮されたテンプレートを読みやすくできます。
- メール開発者が、キャンペーンの非公開HTMLをサーバーへ送らずに、エクスポートしたニュースレターのマークアップを確認しやすくできます。
- CMS編集者が、クラス、リンク、内容を変更する前に、コピーしたコンポーネントやページ断片の構造を整理できます。
- 学習者が、統一されたインデントを通じて、実際のHTML文書にある親子構造を確認できます。
よくある質問
HTML整形ツールは無料ですか？
はい。無料で使えます。登録、ダウンロード、利用回数の制限はありません。HTML文書や断片を貼り付け、インデントを選び、ブラウザで整形結果をコピーできます。
HTMLはどこかにアップロードされますか？
いいえ。整形処理はブラウザ内でローカルに実行され、貼り付けたHTMLはサーバーへ送信されません。社内テンプレート、公開前のランディングページ、メールのマークアップ、非公開URLや識別子を含む断片にも使えます。
どのくらいのHTMLを整形できますか？
アップロードしないため、サーバー側の固定上限はありません。非常に大きな文書ではブラウザや端末のメモリに左右されますが、通常のページ、コンポーネント、メールテンプレート、コピーしたソース断片ならすぐに整形できます。
終了タグがないタグにも対応していますか？
はい。img、br、input、meta、linkなど、終了タグが不要なHTML5の空要素を認識します。リスト項目、段落、option、表の行やセルで終了タグを省略できる場合も考慮し、正しいインデントを決めます。
scriptやstyleの内容は変更されますか？
scriptとstyleの内部は生テキストとして扱います。そのため、比較演算子、CSSセレクター、小なり記号を含む文字列をHTMLタグと取り違えません。ブロックのインデントは調整しますが、JavaScriptやCSS自体は書き換えません。
不正なHTMLの検証や修復もできますか？
いいえ。これは整形ツールであり、標準への適合を検証したり自動修復したりするツールではありません。明らかに閉じていないコメント、宣言、タグ、生テキスト要素は通知しますが、HTMLで許可される終了タグの省略には対応します。適合性の確認にはNu HTML Checkerを使ってください。
HTML整形と圧縮の違いは何ですか？
整形は改行とインデントを加え、人がマークアップを読み書きしやすくします。圧縮は不要な空白を削り、場合によってはコメントも取り除いて転送量を減らします。このページはHTMLの整形だけを行い、書式とコメントを残します。