HTML Minifier & Formatter Online — Gratis, Tanpa Unggah

Tempel HTML di bawah ini untuk melakukan minify — menghapus komentar, atribut yang berlebihan, dan whitespace ekstra — atau beautify menjadi markup yang rapi dan berindentasi. Kedua arah proses ini sepenuhnya berjalan di browser Anda menggunakan parser HTML sungguhan, bukan trik regex, sehingga konten di dalam <pre> dan <textarea> tetap utuh.

Apa Itu Alat Ini?

HTML minifier menghapus semua hal yang tidak dibutuhkan browser untuk merender halaman dengan benar: komentar, whitespace ekstra antar tag, atribut berlebihan seperti type="text/javascript", dan garis miring penutup opsional. Hasilnya adalah HTML yang secara fungsional identik namun diunduh dan diparse lebih cepat.

Tool ini dibangun di atas html-minifier-terser, minifier yang sama dengan yang digunakan di banyak build tool populer, sehingga memahami struktur HTML alih-alih sekadar menghapus whitespace secara sembarangan — tool ini tidak akan menyentuh konten yang sensitif terhadap format di dalam <pre>, <textarea>, atau blok <script>/<style> inline, dan juga meminify CSS serta JS yang tertanam di dalam markup Anda.

Mengapa Menggunakannya?

Menggunakan parser sungguhan, bukan regex — aman untuk kasus khusus seperti blok <pre>, script inline, dan conditional comment.
Juga meminify konten <style> dan <script> yang tertanam, bukan hanya markup di sekitarnya.
Lihat persis berapa byte yang Anda hemat sebelum merilis file.
Mode Format mengubah HTML terkompresi satu baris kembali menjadi sesuatu yang bisa dibaca dan diedit manusia.
Pemrosesan 100% lokal — markup Anda, dan apa pun yang bersifat privat di dalamnya, tidak pernah meninggalkan browser.

Cara Menggunakan

Tempel HTML Anda ke kotak input, atau klik "Load Example" untuk mencoba contoh.
Klik "Minify" untuk mengompresinya, atau "Format" untuk merapikannya dengan indentasi 2 spasi.
Periksa pesan di bawah kotak — mode minify menampilkan pengurangan ukuran; jika HTML tidak bisa diparse, Anda akan melihat error yang jelas, bukan output rusak.
Klik "Copy" untuk mengambil hasilnya.

Contoh

Input

<!DOCTYPE html>
<html>
  <head>
    <title>Example</title>
  </head>
  <body>
    <!-- greeting -->
    <p class="greeting">
      Hello, world!
    </p>
  </body>
</html>

Output

<!doctype html><html><head><title>Example</title></head><body><p class="greeting">Hello, world!</p></body></html>

Komentar, indentasi, dan jeda baris dihapus; doctype diperpendek. Halaman yang terlihat tetap tampil sama persis.

Tips praktis

Lakukan minify tepat sebelum deployment, bukan saat pengembangan — simpan HTML yang mudah dibaca di version control dan hanya minify output build.
Jika sebuah halaman berperilaku aneh setelah diminify, periksa JavaScript yang mengandalkan whitespace persis di dalam text node (jarang terjadi, tapi ada pada beberapa widget lama).
Memformat HTML yang sudah diminify dari situs live adalah cara cepat untuk memeriksa strukturnya sebelum menulis scraper atau men-debug masalah tata letak.
Gabungkan dengan CSS minifier dan JS minifier di bawah jika proses build Anda menyimpan style dan script dalam file terpisah.

Di mana tool ini digunakan dalam workflow nyata

Situs statis, template email, dan landing page yang dibuat secara manual sering kali dirilis dengan indentasi dan komentar yang sama seperti saat dikembangkan. Minify sebelum deploy memangkas bobot transfer yang nyata, meski tidak besar — dan khusus untuk HTML email, jumlah karakter kadang memengaruhi ambang batas pemotongan Gmail, sehingga markup yang lebih kecil punya manfaat fungsional di luar kecepatan.

Arah Format sama bergunanya jika dibalik: menempel halaman terminifikasi dari view-source dan memformatnya kembali sering kali menjadi cara tercepat untuk memahami struktur landing page kompetitor atau men-debug embed pihak ketiga.

→ CSS Minifier · JS Minifier

Kasus penggunaan umum

Memangkas byte dari landing page statis atau template email sebelum dirilis.
Memformat ulang potongan HTML terminifikasi yang diambil dari view-source untuk memahami strukturnya.
Membersihkan HTML yang ditempel dari editor WYSIWYG atau ekspor CMS, yang sering membawa whitespace berlebih.
Memeriksa dengan cepat apakah potongan HTML tulisan tangan sudah valid, karena kegagalan parse langsung tampil sebagai error yang jelas.

Pertanyaan yang Sering Diajukan

Apakah HTML saya diunggah ke suatu tempat?

Tidak. Proses minify dan format keduanya terjadi secara lokal di browser Anda menggunakan JavaScript. Tidak ada yang Anda tempel dikirim ke server, jadi aman digunakan untuk template internal atau halaman yang belum dirilis.

Apakah minify akan merusak halaman saya?

Seharusnya tidak — tool ini menggunakan parser HTML sungguhan (html-minifier-terser) yang memahami struktur tag, sehingga menjaga elemen yang sensitif terhadap whitespace seperti <pre> dan <textarea>, dan tidak akan menggabungkan atribut secara salah. Selalu periksa halaman penting setelah minify, terutama jika Anda mengandalkan script inline yang tidak biasa.

Apakah tool ini juga meminify CSS dan JavaScript di dalam HTML?

Ya. Blok <style> dan <script> inline diminify langsung menggunakan engine yang sama dengan tool CSS minifier dan JS minifier khusus, jadi Anda tidak perlu mengekstraknya secara manual.

Seberapa besar biasanya ukuran HTML berkurang?

Tergantung berapa banyak whitespace, komentar, dan format yang ada di aslinya — HTML yang ditulis tangan dengan banyak indentasi dan komentar umumnya menyusut 20-40%. HTML hasil framework yang sudah ringkas akan menghemat lebih sedikit.

Bisakah saya mengubah HTML yang sudah diminify kembali menjadi format yang mudah dibaca?

Bisa — tempel HTML yang sudah diminify dan klik "Format" alih-alih "Minify" untuk mendapatkan kembali markup yang berindentasi rapi dan mudah dibaca.

HTML Minifier & Formatter