HTML'den Markdown'a Dönüştürücü
HTML'i tarayıcınızda temiz Markdown'a çevirin — GFM tabloları, görev listeleri ve bağlantılar. ATX/Setext başlıkları ile satır içi veya referans bağlantıları seçin. Web içeriği taşıma ya da LLM için ideal. %100 gizli.
Özel CSS
HTML'den Markdown'a Dönüştürme Nedir?
HTML'den Markdown'a dönüştürme, oluşturulmuş bir HTML belgesini — bir tarayıcının gösterdiği etiketler, öznitelikler ve iç içe yerleşim — alır ve onu, yazmak ve sürüm denetimi için inşa edilmiş hafif düz metin biçimi olan Markdown olarak yeniden yazar. Markdown'dan HTML'e, kompakt metni görüntü için işaretlemeye genişletirken, bu tersine ve indirgeyici yöndür: zengin, ayrıntılı HTML ile başlar ve onu Markdown'ın sunduğu küçük, okunabilir gelenek kümesine damıtırsınız.
Kaputun altında dönüştürücü HTML'inizi bir DOM ağacına ayrıştırır — bir tarayıcının oluşturduğu aynı düğüm yapısı — ardından o ağaçta yürür ve tanıdığı her düğüm için Markdown karşılığını yayar. Bir <h2>, ## olur; bir <strong>, **metin** olur; bir <ul>, madde işaretli liste olur; bir , bağlantı olur; bir <table>, GFM boru tablosu olur. Ham dize üzerinde düzenli ifadeler çalıştırmak yerine gerçek bir DOM dolaşmak, iç içe listeleri, karışık satır içi biçimlendirmeyi ve tabloları uç durumlarda bozulmak yerine doğru işlemesini sağlayan şeydir.
Bu dönüştürmeye, HTML'in içine değil dışına taşınırken başvurursunuz. Bir CMS'te, bir WYSIWYG düzenleyicide, eski bir web sayfasında ya da bir zengin metin alanında sıkışmış içeriği diff'lemek zor, gözden geçirmek zor ve taşımak zordur. Onu Markdown'a dönüştürmek, bir Git deposunda, bir durağan site oluşturucusunda ya da bir not uygulamasında mutlu mesut yaşayan bir biçime — ve giderek artan biçimde, büyük dil modellerinin verimli okuduğu bir biçime — özgür kılar. Dürüst araçların açıkça belirttiği sorun, dönüştürmenin kayıplı olmasıdır: HTML, Markdown'ın yapamadığı şeyleri ifade edebilir; bu yüzden bazı yapı ve her stilleme ayrıntısı, temiz, taşınabilir metin karşılığında bilerek atılır.
Ters işlem — yayımlamaya ya da önizlemeye hazır olduğunuzda Markdown'ı HTML'e geri çevirmek — eşit derecede yararlıdır. Markdown → HTML sekmesine geçin ya da özel Markdown'dan HTML'e dönüştürücüyü açın.
HTML in:
<h2>Pricing</h2>
<p>Plans start at <strong>$9/mo</strong>. See the <a href="https://example.com/pricing">details</a>.</p>
<table>
<thead><tr><th>Plan</th><th>Price</th></tr></thead>
<tbody><tr><td>Pro</td><td>$9</td></tr></tbody>
</table>
Markdown out:
## Pricing
Plans start at **$9/mo**. See the [details](https://example.com/pricing).
| Plan | Price |
| ---- | ----- |
| Pro | $9 |
<!-- <div>, classes, and inline styles in the source are dropped — Markdown can't represent them. --> Temel Özellikler
GFM Bilinçli Çıktı
Yalnızca düz CommonMark değil, GitHub Flavored Markdown'ı hedefler: HTML tabloları boru tabloları olur, onay kutusu <li>'leri görev listeleri olur (`- [x]`) ve <del>/<s> ~~üstü çizili~~ olur. Markdown bir README'ye, bir GitHub sorununa ya da bir belge sitesine doğrudan iner ve aynı şekilde oluşur.
ATX ya da Setext Başlıkları
Kare işareti önekli ATX başlıkları (# H1) ya da altı çizili Setext başlıkları (H1 için ===, H2 için ---) seçin. Setext yalnızca en üst iki düzeyi kapsar; bu yüzden dönüştürücü H3 ve daha derin için otomatik olarak ATX'e geri döner — asla geçersiz bir başlık almazsınız.
Satır İçi ya da Referans Bağlantılar
Satır içi bağlantılar — düz yazının yanında [metin](url) — ile referans bağlantıları arasında geçiş yapın; ikincisi her URL'yi belgenin altındaki numaralı bir listeye toplar. Referans biçimi bağlantı ağırlıklı paragrafları okunabilir tutar ve bir URL'yi etikete göre yeniden kullanmanızı sağlar.
Çitli Kod Blokları
Bir <pre><code> bloğu, üçlü ters tırnaklı bir çitli kod bloğu olur ve <code> öğesindeki bir language- sınıfı, çitin bilgi dizesi olarak taşınır. Satır içi <code>, ters tırnak aralıkları olur; böylece parçacıklar yolculuktan sağlam çıkar.
İç İçe Listeleri ve Tabloları İşler
Gerçek DOM'u dolaşır; böylece iç içe <ul>/<ol> yapıları doğru girintili Markdown listelerine dönüşür ve sıralı listeler 1'den yeniden numaralanır. Basit tablolar boru tablolarına düzleşir; gerçekten karmaşık olanlar veri kaybetmek yerine ham HTML'e geri döner.
%100 Gizli, Tarayıcı İçinde
Her dönüştürme yerel olarak JavaScript ile çalışır — HTML'iniz ve ortaya çıkan Markdown asla cihazınızdan ayrılmaz, asla bir sunucuya gitmez ve sayfa yüklendikten sonra çevrimdışı çalışır. Dahili CMS dışa aktarımları, müşteri içeriği ve yayımlanmamış sayfalar için güvenlidir.
Örnekler
Web <table>'ından GFM boru tablosuna
<table>
<thead><tr><th>Region</th><th>Sales</th></tr></thead>
<tbody>
<tr><td>EMEA</td><td>1,204</td></tr>
<tr><td>APAC</td><td>980</td></tr>
</tbody>
</table> | Region | Sales | | ------ | ----- | | EMEA | 1,204 | | APAC | 980 |
Kazınmış ya da kopyalanmış bir HTML <table>, bir GitHub Flavored Markdown boru tablosuna iner. <thead> satırı başlık olur, tireli ayırıcı satır sizin için üretilir ve her <tr> tek bir boruyla ayrılmış satır olur — bir README'ye ya da bir belge sayfasına bırakmaya hazır.
Bağlantılar: satır içi ile referans biçimi
<p>Read the <a href="https://example.com/guide">setup guide</a> and the <a href="https://example.com/api">API reference</a>.</p>
Inline: Read the [setup guide](https://example.com/guide) and the [API reference](https://example.com/api). Reference: Read the [setup guide][1] and the [API reference][2]. [1]: https://example.com/guide [2]: https://example.com/api
Aynı çapalar iki türlü oluşur. Satır içi, URL'yi metnin yanında tutar; referans biçimi her URL'yi alttaki numaralı bir listeye taşır; bu da bir cümle birkaç bağlantı taşıdığında uzun paragrafları okunabilir kılar. Biçimi Bağlantılar radyo düğmesiyle seçin.
İç içe <ul>/<ol>'dan girintili Markdown listelerine
<ul>
<li>Build
<ol>
<li>Compile</li>
<li>Bundle</li>
</ol>
</li>
<li>Ship</li>
</ul> - Build 1. Compile 2. Bundle - Ship
İç içe yerleşim girintiyle korunur: iç <ol>, üst <li>'sinin iki boşluk altında oturur ve bir `-` madde işaretinden `1.` numaralandırmaya geçer. Markdown sıralı listeleri otomatik yeniden numaralar; böylece HTML açık value öznitelikleri kullansa bile kaynak temiz kalır.
Bir web sayfası HTML parçasından temiz Markdown'a
<article> <h1>Changelog</h1> <p>We shipped <strong>dark mode</strong> and fixed <code>parseDate()</code>.</p> <blockquote><p>Thanks to everyone who reported it.</p></blockquote> </article>
# Changelog We shipped **dark mode** and fixed `parseDate()`. > Thanks to everyone who reported it.
Gerçek bir sayfadan bir dilim yapıştırın — <article> sarmalayıcısı düşürülür (Markdown'ın kapsayıcı öğesi yoktur), <h1> `#` olur, <strong> `**` olur, satır içi <code> ters tırnaklar olur ve <blockquote> bir `>` satırı olur. Markdown karşılığı olmayan yapısal sarmalayıcılar yalnızca düşer.
HTML'den Markdown'a Nasıl Çevirilir
- 1
HTML'inizi yapıştırın
Kopyalanmış bir web sayfası, bir CMS ya da WYSIWYG dışa aktarımı, ya da kazınmış bir HTML parçacığı bırakın. DOM, siz yapıştırırken tarayıcınızda ayrıştırılır ve Markdown'a seri hale getirilir — yükleme yok, tarayıcı belleğinizin ötesinde boyut sınırı yok.
- 2
Başlık ve bağlantı biçimlerini seçin
ATX (#) ya da Setext (===) başlıkları ve satır içi ya da referans bağlantıları seçin. Markdown canlı yeniden oluşur; böylece biçimleri anında karşılaştırabilirsiniz. Çıktı GitHub Flavored Markdown'ı hedefler — tablolar, görev listeleri ve üstü çizili dahil.
- 3
Kopyalayın ya da indirin
Markdown'ı almak için Kopyala'ya ya da bir .md dosyası kaydetmek için İndir'e tıklayın. Diğer yöne gitmek için Markdown → HTML sekmesine geçin ve oluşturulmuş HTML'i geri almak için Markdown'ınızı yapıştırın.
Yaygın Tuzaklar
<div>/<span> Yapısının Sağ Çıkmasını Beklemek
Genel kapsayıcılar Markdown karşılığı taşımaz; bu yüzden açılırlar — içerikleri kalır ama etiket ve üzerindeki herhangi bir sınıf ya da stil kaybolur. Düzeniniz bir sarmalayan <div>'e ya da stilli bir <span>'e dayanıyorsa, o stilleme Markdown'da gider. Bu beklenir, bir hata değildir; Markdown'ın onu ifade edecek bir yolu yoktur.
<div class="callout warning"><span style="color:red">Heads up!</span></div> <!-- expecting the callout box and red colour to survive -->
Heads up! <!-- container and styles dropped; only the text remains in Markdown -->
Paragraflar İçindeki Kayıp <br> Satır Sonları
Bir paragraf içindeki bir <br>, yumuşak bir satır sonudur; Markdown bunu satır sonundan önce iki sondaki boşlukla (ya da bir ters eğik çizgiyle) temsil eder. HTML yapıştırıp görünür satır sonlarının sağ çıkmasını beklemek, bitişik satırlar tek bir satıra yeniden aktığında sizi şaşırtabilir. Dönüştürücü sert kırılma biçimini yayar, ama sonradan elle düzenliyorsanız sondaki boşlukları çıkarmayın.
Line one<br>Line two <!-- if the break form is removed, these merge into one line -->
Line one Line two <!-- two trailing spaces preserve the <br> as a hard break -->
Derin İç İçe Tabloların Bozulması
GFM boru tabloları iç içe geçemez ya da blok içerik tutamaz. Bir tablo hücresine bir tablo (ya da bir liste ya da birden çok paragraf) koyan eski bir düzen, temiz bir boru tablosu olamaz — dönüştürücü yapabildiğini düzleştirir ve hiçbir şey kaybolmaması için geri kalanı ham HTML olarak bırakır. Çözüm çıktıyı değil, kaynağı basitleştirmektir.
<table><tr><td><table><tr><td>inner</td></tr></table></td></tr></table> <!-- nested table can't become a flat pipe table -->
<!-- Flatten to a single-level table first: --> <table><tr><td>inner</td></tr></table> → | inner | | ----- |
<script> ya da Stillerin Sağ Çıkmasını Beklemek
<script>, <style> ve başlık düzeyindeki öğeler kod ve sunumdur, belge içeriği değildir; bu yüzden tümüyle çıkarılır — dönüştürülmez, ham HTML olarak korunmaz. Bütün bir sayfa yapıştırıp davranışın ya da CSS'in Markdown'a taşınmasını beklemek hayal kırıklığına uğratır. Markdown bir içerik biçimidir; koda ya da stillemeye ihtiyacınız varsa HTML'i koruyun.
<style>.x{color:blue}</style>
<script>track()</script>
<p>Body</p>
<!-- expecting the style and script to come through --> Body <!-- only the content survives; <script>/<style> are dropped -->
Yaygın Kullanım Senaryoları
- Web ya da CMS içeriğini Notion, Obsidian ya da bir durağan siteye taşıma
- Sayfaları bir CMS'ten, bir WordPress dışa aktarımından ya da eski bir HTML sitesinden çekin ve doğrudan Notion, Obsidian, Hugo ya da Jekyll'e inen Markdown'a dönüştürün. Ayrıntılı işaretlemeyi, bir Git deposunda temiz yaşayan ve incelemede mantıklı diff'lenen taşınabilir metinle takas edersiniz.
- Bir WYSIWYG düzenleyiciden dışa aktarma
- Zengin metin düzenleyicileri yoğun, öznitelik ağırlıklı HTML yayar. O çıktıyı buraya yapıştırarak altındaki temiz Markdown'ı kurtarın — başlıklar, listeler, bağlantılar ve vurgu — böylece içerik düzenleyicide kilitli kalmak yerine bir belge ardışık düzenine ya da Markdown tabanlı bir bilgi tabanına taşınabilir.
- HTML'i Markdown'a temizleyip LLM ve RAG ardışık düzenlerini besleme
- Ham HTML, bir modelin asla ihtiyaç duymadığı etiketlere, betiklere ve stillemeye token yakar. Kazınmış bir sayfayı Markdown'a dönüştürmek, bir LLM'in iyi okuduğu yapıyı korurken o gürültüyü çıkarır; böylece bağlam penceresine daha fazla gerçek içerik sığdırır ve getirim için daha temiz gömmeler alırsınız.
- Bir zengin metin yapıştırmasını Markdown'a dönüştürme
- Bir web sayfasından, bir e-postadan ya da bir belgeden biçimlendirilmiş metni kopyalayın; panoya HTML olarak gelir. Onu buraya yapıştırarak o zengin metni commit'leyebileceğiniz, bir çekme isteğinde gönderebileceğiniz ya da notlarınıza yazabileceğiniz Markdown'a çevirin — biçimlendirme korunur, dağınıklık gider.
- Bir sayfayı Markdown olarak arşivleme
- Bir web sayfasının anlamlı içeriğini, betikler ve izleme dolu ağır bir HTML anlık görüntüsü yerine küçük, geleceğe dönük bir .md dosyası olarak kaydedin. Markdown, bundan onlarca yıl sonra herhangi bir metin düzenleyicide okunabilir kalır ve bir kesir kadar yer kaplar.
- Eski HTML belgelerini Markdown'a dönüştürme
- Elle kodlanmış HTML olarak yazılmış eski belgelerin bakımı zahmetlidir. Onu Markdown'a dönüştürerek modern bir kod-olarak-belge iş akışına getirin — burada linter'lanabilir, çekme isteklerinde gözden geçirilebilir ve bir durağan site oluşturucusu tarafından oluşturulabilir.
Teknik Ayrıntılar
- CommonMark'a Karşı GitHub Flavored Markdown Çıktısı
- Dönüştürücü düz CommonMark'ı ya da varsayılan olarak GitHub Flavored Markdown üst kümesini hedefleyebilir. CommonMark başlıkları, vurguyu, listeleri, bağlantıları, görselleri, kodu ve blok alıntıları kesin tanımlar. GFM, yaygın HTML'den doğrudan eşleşen dört yapı ekler: <table> → boru tablosu, onay kutusu liste öğeleri → görev listeleri, <del>/<s> → üstü çizili ve çıplak URL'ler → otomatik bağlantılar. Çoğu web içeriği tablolar ve benzerlerini kullandığından, GFM çıktısı pratik varsayılandır; yalnızca hedef oluşturucu GFM uzantılarını anlamadığında CommonMark seçin ki bu durumda tablolar ham HTML'e geri döner.
- Kayıplı, Geri Döndürülemez Dönüştürme — Açıkça Belirtilmiş
- HTML, Markdown'dan kesinlikle daha ifade edicidir; bu yüzden dönüştürme kayıpsız olamaz ve bu konuda dürüst olmaya değer. Markdown'ın <div>, <span> ya da diğer genel kapsayıcılar için söz dizimi yoktur; sınıf adları, id, satır içi style, colspan/rowspan ya da keyfi data-* özniteliklerini taşıyacak yolu yoktur; ve çoğu anlamsal ya da düzen öğesinin temsili yoktur. Bunlar açılır (içerik korunur, etiket düşürülür), atılır (öznitelikler) ya da — düşürmek anlam kaybettirecekse — ham satır içi HTML olarak korunur. Bir HTML → Markdown → HTML gidiş dönüşü orijinali yeniden üretmez. Bu kasıtlı bir takastır: Markdown, HTML'i yansıtmak için değil, temiz, diff'lenebilir ve insanca düzenlenebilir olmak için vardır. Çoğu rakip bunu geçiştirir; bunu belirtmek, Markdown'ın doğru hedef olup olmadığına gözünüz açık karar vermenizi sağlar.
- Biçim Takasları: ATX/Setext, Satır İçi/Referans, Çitli/Girintili
- Üç çıktı seçeneğinin gerçek takasları vardır. ATX başlıkları (#) altı düzeyin tümünü kapsar ve temiz grep'lenir; Setext (altı çizili) yalnızca H1/H2 için var olur; bu yüzden araç onu en üst iki düzey için yayar ve altında ATX'e geri döner. Satır içi bağlantılar URL'yi metnin yanında tutar — seyrek bağlantılar için en iyisi; referans bağlantıları URL'leri belgenin altına çeker — bağlantı yoğun düz yazı ve etikete göre yeniden kullanım için en iyisi. Kod için, çitli bloklar (üçlü ters tırnak) bir dil bilgi dizesi taşır ve güvenle iç içe geçer, oysa girintili (dört boşluk) kod blokları bir dili ifade edemez ve listeler içinde bozulur — bu yüzden bu dönüştürücü <pre><code>'dan her zaman çitli bloklar yayar.
En İyi Uygulamalar
- Dönüştürmeden Önce HTML'i Biçimlendirin
- Küçültülmüş ya da derin biçimde karışık HTML — özellikle iç içe yerleşik düzen tabloları ve başıboş satır içi öğeler — önce düzgün biçimliyken daha temiz dönüşür. Karışık kaynağı güzelce yazdırmak ve normalleştirmek için HTML Biçimlendiricimizden geçirin, ardından dönüştürün. Temiz girdi, daha az ham HTML geri dönüşüyle temiz Markdown verir.
- Kayıplı Düşmeleri Bekleyin ve Gözden Geçirin
- Dönüştürmeyi tasarım gereği kayıplı sayın. Sınıflar, satır içi stiller, <div>/<span> sarmalayıcıları ve egzotik öznitelikler çıktıda yok olur ve bu genellikle taşınabilir Markdown için istediğiniz şeydir — ama yalnızca bir öznitelikte yaşayan anlamsal olarak önemli herhangi bir şey için (bir aria-label, colspan ile birleştirilmiş bir hücre) sonucu gözden geçirin ve önemliyse elle geri ekleyin.
- Bağlantı Biçimini Belgenin Yoğunluğuna Göre Seçin
- Şurada burada bir bağlantı olan düz yazı için satır içi bağlantılar kullanın — URL metninin yanında kalır ve kaynak doğal okunur. Bir bölüm bağlantı ağırlıklı olduğunda ya da aynı URL'leri yeniden kullandığında referans bağlantılarına geçin: onları altta numaralı bir listeye çekmek paragrafları taranabilir tutar ve uzun URL'leri tekrarlamaktan kaçınır.
- Sayfaları Bir LLM'e Göndermeden Önce Markdown'a Dönüştürün
- Bir modele web içeriği beslerken — bir istem, bir gömme ya da bir RAG deposu için — HTML'i önce Markdown'a dönüştürün. Token harcayan ve gürültü ekleyen etiketleri, betikleri ve stillemeyi çıkarır, modelin gerçekten kullandığı yapıyı korur ve bağlam penceresine önemli ölçüde daha fazla gerçek içerik sığdırırsınız.
- Karmaşık Tabloları Dönüştürmeden Sonra Doğrulayın
- GFM boru tabloları düzdür — iç içe tablolar yok, hücrelerde blok içerik yok, birleştirilmiş hücreler yok. Veri ağırlıklı ya da düzen amaçlı bir tabloyu dönüştürdükten sonra Markdown'ı kontrol edin: basit ızgaralar kusursuz dönüşür, ama colspan'leri ya da iç içe blokları olan herhangi bir şey bozulur ve ham HTML olarak görünebilir. Temiz bir boru tablosu önemliyse kaynak tabloyu önce basitleştirin.
Sıkça Sorulan Sorular
Satır içi ile referans bağlantıları nasıl işlenir?
ATX'e karşı Setext başlıkları — hangisini kullanmalıyım?
Markdown'ın temsil edemediği HTML'e ne olur, <div> ve <span> gibi?
<script> ve stilleri çıkarıyor mu?
İç içe tablolar ve listeler nasıl işlenir?
HTML'den Markdown'a dönüştürme kayıpsız mı?
Markdown'ı bir LLM'e ya da ChatGPT'ye besleyebilir miyim?
Dosyalarım bir sunucuya yükleniyor mu?
Çevrimdışı çalışır mı?
Markdown'ı HTML'e geri çevirebilir miyim?
İlgili Araçlar
Tüm araçları görüntüleyin →Base64 Çözücü ve Kodlayıcı
Kodlama ve Biçimlendirme
Base64'ü ücretsiz çevrimiçi kodlayın ve çözün. Tam UTF-8 ve emoji desteğiyle gerçek zamanlı dönüştürme. %100 tarayıcıda — kayıt gerekmez.
Base64'ü Görsele Çevirme Aracı
Kodlama ve Biçimlendirme
Bir Base64 dizesini ya da data URI'yi tarayıcınızda görsele geri çözün. Önizleyin, boyutları ve MIME'ı okuyun, ardından PNG, JPG, GIF, SVG olarak indirin. Yükleme yok.
CSV'den JSON'a Dönüştürücü
Kodlama ve Biçimlendirme
CSV'yi tarayıcınızda JSON'a dönüştürün. RFC 4180, tür çıkarımı, başlık satırı, büyük tam sayı güvenli. %100 gizli, yükleme yok.
Görseli Base64'e Çevirme Aracı
Kodlama ve Biçimlendirme
Görselleri tarayıcınızda Base64 data URI'lerine çevirin — PNG, JPG, GIF, WebP, SVG, ICO. HTML, CSS, Markdown ve JSON çıktısını kopyalayın. %100 gizli, yükleme yok.
JSON Diff Karşılaştır
Kodlama ve Biçimlendirme
Tarayıcınızda iki JSON dosyasını anında karşılaştırın. Yan yana vurgulama, RFC 6902 JSON Patch çıktısı, zaman damgaları ve kimlikler gibi gürültülü alanları yoksayma. %100 gizli, yükleme yok.
JSON Biçimlendirici ve Doğrulayıcı
Kodlama ve Biçimlendirme
JSON'u tarayıcınızda anında biçimlendirin, doğrulayın ve güzelleştirin. Sözdizimi denetimi, hata tespiti, sıkıştırma ve tek tıkla kopyalama. %100 gizli.