§

Tempel HTML

§

Mentah

§

Pratinjau

Pratinjau disanitasi melalui DOMPurify — tag script, event handler, dan URI javascript: dihilangkan sebelum dirender.

Markdown telah menjadi bahasa dokumentasi default komunitas dev Indonesia: Medium ID, KOMPAS tech, dan dev.to Indonesia menerbitkan artikel Markdown-first setiap hari, sementara tim engineering Gojek, Tokopedia, Bukalapak, dan Traveloka memakai Markdown untuk RFC internal, ADR, dan runbook sebelum mendorong ke Confluence atau GitBook. Mahasiswa ITB, Universitas Indonesia, dan UGM mengirim skripsi melalui pipeline Pandoc Markdown-to-LaTeX, sedangkan engineer fintech yang diawasi OJK di GoPay, OVO, DANA, dan LinkAja menulis SDK reference docs di Markdown untuk dibangun menjadi Docusaurus. Kominfo mendorong standar publikasi digital cloud-native berbasis Markdown, dan setiap README di GitHub Indonesia mengalir melalui jalur parse-sanitize-render yang sama saat ditampilkan.

// Alat Terkait

./markdown-html-converter
Konverter Markdown ke HTML
Konversikan Markdown ke HTML di peramban Anda.
→
./html-beautifier
Pemerelah HTML
Pretty-print HTML yang diminify atau berantakan dengan indentasi dan pembungkusan baris yang dapat dikonfigurasi.
→
./html-minifier
Minifier HTML
Hapus spasi dan komentar dari HTML di browser Anda.
→
./
Semua Alat
Telusuri rangkaian lengkap alat daring Ultim8Soft.
→

Apa itu konversi HTML ke Markdown?

HTML adalah markup yang dirender yang ditampilkan peramban — <h1>, <ul>, <table>, <a>, dan seterusnya. Markdown adalah format teks ringan yang menggunakan tanda baca minimal (# untuk heading, * untuk penekanan, - untuk item daftar) untuk mengkodekan struktur yang sama. GitHub Flavored Markdown (GFM) memperluas spesifikasi CommonMark asli dengan tabel, coretan, daftar tugas, dan autolinks. Mengonversi HTML ke Markdown menarik HTML yang dirender atau diekspor kembali ke Markdown teks biasa yang dapat diedit — persis apa yang dibutuhkan untuk migrasi konten dari CMS, atau pembersihan README.

Fitur GitHub Flavored Markdown mana yang didukung oleh keluaran?

Mesin turndown@7.2.0 yang dibundel dengan ekstensi turndown-plugin-gfm menghasilkan superset GFM penuh dari HTML Anda: heading gaya ATX # hingga ###### dari <h1>–<h6>, daftar terurut dan tidak terurut dengan nesting, tebal **text** dan miring *text*, coretan ~~text~~ dari <del>, tautan inline [text](url) dan gambar inline ![alt](src), blok kode fenced dengan petunjuk bahasa (```js), span kode inline `code`, tabel pipe dari <table>, daftar tugas GFM - [ ] / - [x] dari input checkbox, blockquotes >, dan garis horizontal ---. Panel pratinjau me-render ulang Markdown yang dihasilkan dengan marked@12.0.2 sehingga Anda dapat mengonfirmasi konversi secara visual.

Bagaimana cara kerja konversi HTML ke Markdown?

Setiap konversi berjalan secara lokal di peramban Anda menggunakan tiga pustaka bawaan — tanpa CDN, tanpa fetch, tanpa telemetri. Langkah-langkah tingkat tinggi adalah:

  1. Sanitasi: HTML yang ditempel pertama-tama dijalankan melalui DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }) untuk menghapus elemen <script>, setiap event handler on*, dan URI javascript: sebelum apapun menelusuri markup. DOMPurify adalah sanitizer XSS yang sama yang digunakan oleh Mozilla MDN, Atlassian, dan Microsoft 365.
  2. Konversi: turndownService.turndown menelusuri DOM yang sudah dibersihkan dan menghasilkan GitHub Flavored Markdown — heading menjadi prefiks #, daftar menjadi item - / 1., <table> menjadi tabel pipe, dan seterusnya. Markdown ditulis ke <textarea> keluaran hanya-baca melalui value (tidak pernah innerHTML), sehingga secara inheren aman.
  3. Render: Markdown yang dihasilkan diurai ulang oleh marked.parse, disanitasi lagi melalui DOMPurify, dan ditetapkan ke innerHTML panel pratinjau sehingga Anda mendapat konfirmasi visual bahwa Markdown round-trip ke struktur yang diharapkan. Mode langsung men-debounce masukan selama 150 ms agar keluaran diperbarui saat Anda menempel tanpa membebani parser.

Mengapa mengonversi HTML ke Markdown dengan alat ini?

  • Privasi: setiap proses sanitasi, konversi, dan render terjadi di peramban Anda. HTML — termasuk kiriman CMS yang diekspor, dokumentasi internal, dan sumber halaman rahasia — tidak pernah mencapai server kami.
  • Aman XSS secara default: HTML yang ditempel dijalankan melalui DOMPurify sebelum turndown menelusurinya, dan panel pratinjau menjalankan HTML yang dirender ulang melalui DOMPurify sekali lagi sebelum innerHTML, sehingga menempelkan markup yang berisi tag <script> atau handler onerror= menghasilkan pratinjau yang inert dan Markdown yang bersih.
  • GFM-lengkap: elemen <table> dikonversi ke tabel pipe Markdown, <del> ke coretan, dan daftar checkbox ke daftar tugas GFM. Kebanyakan konverter daring menjatuhkan tabel pada jalur HTML → Markdown — ekstensi turndown-plugin-gfm bawaan mempertahankannya.

Apa saja aplikasi umum konversi HTML ke Markdown?

Mengonversi HTML ke Markdown muncul di migrasi konten, dokumentasi, dan pengarsipan:

  • Migrasi CMS: mengekspor kiriman WordPress atau Ghost sebagai HTML dan mengonversi ke Markdown untuk rebuild static-site Hugo / Jekyll / 11ty / Astro. Konversi mempertahankan level heading, tautan, daftar, dan penekanan inline.
  • Pembersihan README: menempelkan HTML yang dirender dari halaman wiki atau artikel web dan menariknya kembali ke Markdown yang dapat diedit untuk README proyek atau situs dokumen, daripada mengetik ulang struktur secara manual.
  • Pengarsipan dan catatan: mengambil email HTML atau web clipping dan mengonversi ke Markdown untuk disimpan di Obsidian, Notion, atau basis pengetahuan teks biasa — Markdown tetap diff-friendly dan bertahan dari pergantian format.

Seperti apa contoh konversi HTML ke Markdown?

Menempelkan <h2>Heading</h2><ul><li>a</li><li>b<ul><li>nested</li></ul></li></ul> menghasilkan Markdown dengan ## Heading, daftar bullet bertingkat, dan panel pratinjau yang dirender ulang ke struktur bertingkat yang sama. Menempelkan <table> dengan baris header dan dua baris data menghasilkan tabel pipe | col | col | yang setara — mengonfirmasi konversi mempertahankan heading, daftar, dan tabel.

Apakah konverter HTML ke Markdown ini berjalan sepenuhnya di peramban saya?

Ya. Setiap proses sanitasi, konversi, dan render berjalan secara lokal sebagai JavaScript di dalam tab peramban Anda. Tiga pustaka bawaan — turndown@7.2.0 (dengan turndown-plugin-gfm@1.0.2), marked@12.0.2, dan DOMPurify@3.1.7 — dilayani dari origin yang sama dengan halaman, sehingga tidak ada ketergantungan CDN, tidak ada fetch, tidak ada XMLHttpRequest, tidak ada navigator.sendBeacon pada masukan. Alat juga bekerja luring setelah halaman dimuat, karena ini adalah bundel HTML/CSS/JS statis dengan pustaka vendor disalin di sampingnya. Kiriman yang diekspor, dokumen internal, dan sumber halaman rahasia tetap di perangkat Anda.

Apakah panel pratinjau yang dirender aman terhadap XSS?

Ya. Setiap string HTML yang ditugaskan ke innerHTML melewati DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }) terlebih dahulu. DOMPurify adalah sanitizer XSS open-source yang dipelihara oleh Cure53; ini adalah pustaka yang sama yang digunakan oleh Mozilla MDN, Atlassian, dan Microsoft 365 untuk mengamankan HTML yang disuplai pengguna. Profil html default menghapus elemen <script>, setiap atribut event handler on* (onerror, onclick, dll.), skema URI javascript: di dalam href / src. Menempelkan <img src=x onerror=alert(1)> menghasilkan pratinjau di mana document.querySelector('#output-preview img[onerror]') mengembalikan null dan tidak ada alert yang muncul.

Apakah tabel GFM dikonversi dari HTML?

Ya. Arah HTML → Markdown menggunakan turndown-plugin-gfm, yang menambahkan aturan turndown kustom yang menelusuri node <table> dan menghasilkan pipe-table Markdown yang setara — baris header, baris alignment |---|---|, kemudian baris data. Kebanyakan konverter daring menjatuhkan tabel pada jalur ini; yang ini mempertahankannya. Coretan (<del>text</del> → ~~text~~) dan daftar tugas (<input type="checkbox"> → - [ ] / - [x]) dikonversi dengan cara yang sama.

Apakah HTML saya akan terkonversi dengan bersih?

Untuk set fitur GFM kanonik — heading h1 hingga h6, daftar terurut dan tidak terurut dengan nesting, tebal / miring / coretan, tautan inline, gambar inline, blok kode fenced dengan tag bahasa, span kode inline, tabel pipe, daftar tugas, blockquotes, garis horizontal, dan autolinks — konversi bersih dan dapat diprediksi. Kasus tepi: komentar HTML (<!-- ... -->) dihapus (Markdown tidak memiliki sintaks komentar); inline styling dan atribut class dihapus karena Markdown tidak memiliki padanannya; dan tag inline yang jarang seperti <sub> / <sup> dikonversi ke teks biasa. Ini adalah perilaku turndown yang terdokumentasi, bukan bug.

Apakah penyorotan sintaks dalam blok kode fenced didukung?

Tidak di v1. Blok kode fenced dirender dengan font monospace dan latar belakang halus tetapi tanpa penyorotan token per bahasa. Menambahkan penyorotan sintaks akan memerlukan bundling Prism atau highlight.js, masing-masing menambahkan 15–40 KB ditambah file tata bahasa per bahasa dan matriks tema yang perlu diselaraskan dengan palet Workshop Terminal. Untuk saat ini, renderer fokus pada kebenaran dan keamanan XSS; jika ada permintaan pengguna untuk penyorotan inline, toggle opt-in adalah follow-up yang dapat ditangani.

Konverter HTML ke Markdown ini hadir dengan turndown@7.2.0 (+ turndown-plugin-gfm@1.0.2), marked@12.0.2, dan DOMPurify@3.1.7 dibundel di origin yang sama, menghasilkan set fitur GFM penuh, dan mensanitasi setiap string HTML yang dirender sebelum menyentuh DOM. Tanpa unggah, tanpa CDN, tanpa telemetri — setiap byte tetap di peramban Anda.