HTML Formatter dan Minifier

Cara memformat HTML

1. Tempel HTML Anda, atau klik Buka file untuk memuat file .html atau .htm (hingga 10 MB).
2. Pilih Indentasi (2 spasi, 4 spasi, atau tab) dan apakah ingin Bungkus baris pada 80 atau 120 karakter.
3. Centang Indentasi dan jika Anda ingin keduanya diberi indentasi di dalam <html>, dan Hapus komentar untuk membuang komentar <!-- … -->.
4. Klik Format (rapikan) untuk kode yang mudah dibaca, atau Minify untuk versi aman yang paling kecil.
5. Salin atau unduh hasilnya. Baris status menampilkan ukuran sebelum dan sesudah.

Hasilnya ditampilkan sebagai teks biasa di kotak hasil. HTML Anda tidak pernah di-render atau dijalankan di halaman ini, sehingga skrip di dalam kode yang Anda tempel tidak bisa melakukan apa pun.

Rapikan: HTML yang mudah dibaca dengan indentasi konsisten

Format (rapikan) memakai js-beautify, formatter di balik banyak editor kode:

• elemen blok ditaruh di barisnya sendiri, diberi indentasi sesuai kedalaman susunannya, sedangkan elemen inline seperti <a>, <b>, atau <span> tetap berada di dalam teks;
• isi <script> dan <style> diformat sebagai JavaScript dan CSS;
• <pre> dan <textarea> dibiarkan persis seperti aslinya, karena spasi di dalamnya terlihat;
• baris kosong berturut-turut dikurangi menjadi satu;
• dengan lebar pembungkusan, baris teks panjang dan daftar atribut panjang akan dibungkus.

Merapikan kode tidak memperbaiki markup yang rusak: <div> yang tidak ditutup tetap tidak tertutup, dan indentasi setelahnya menunjukkan letak masalahnya.

Minify: HTML lebih kecil tanpa mengubah tampilan halaman

Minify memakai pendekatan yang sengaja dibuat konservatif:

• deretan spasi, tab, dan baris baru di dalam teks menjadi satu spasi, persis seperti yang ditampilkan browser;
• spasi di sebelah elemen tingkat blok dan elemen head (<div>, <p>, <li>, <td>, <meta>, <br>…) dihapus, karena tidak pernah ditampilkan;
• satu spasi di antara elemen inline dipertahankan, sehingga <b>big</b> <i>world</i> tidak berubah menjadi “bigworld”;
• komentar dihapus saat Hapus komentar dicentang, kecuali conditional comment (<!--[if IE]>) dan komentar yang diawali <!--!;
• isi <script>, <style>, <pre>, dan <textarea> tidak pernah disentuh, dan nilai atribut dipertahankan persis, termasuk tanda kutipnya.

Minify ini tidak menghapus tag penutup opsional, menulis ulang atribut, atau mengompres JavaScript dan CSS inline: optimasi semacam itu menghemat sedikit lebih banyak tetapi bisa merusak halaman. Untuk sebagian besar halaman, kompresi HTTP (gzip atau Brotli) menghemat jauh lebih banyak daripada minifier mana pun, sehingga minify paling berguna untuk HTML yang disisipkan di email, template, atau string JavaScript.