Düz Metni HTML'e Dönüştürme: Ne Değişir, Neden Önemlidir ve Nasıl Doğru Yapılır

Metni HTML'e Dönüştürdüğünüzde Gerçekte Ne Değişir?

Düz metin ve HTML gözünüze benzer görünebilir, ancak tarayıcılar ikisini çok farklı biçimde ayrıştırır. Düzgün bir dönüşümde beş temel değişiklik gerçekleşir:

• & → & — Ampersand her HTML varlığının başlangıcıdır, önce bu kaçırılmalıdır
• < → < — Bu olmadan metindeki her açı ayracı bir HTML etiketi başlatır
• > → > — Aynı nedenle etiket yorumunu kapatır
• Satır sonları → <br> etiketi veya <p> elementi — Ham satır sonları HTML'de görünmez
• Düz URL'ler → <a href="..."> bağlantısı — İsteğe bağlı ama neredeyse her zaman kullanışlı

Bu beş değişiklik bir metin-HTML dönüştürücünün yaptığının %95'ini kapsar. Sıra da önemlidir: ampersandı diğer şeyleri kodlamadan önce kaçırmalısınız, aksi takdirde kendi varlıklarınızı çift kodlarsınız.

HTML Karakter Kodlama: Neden Önemli?

Bu yalnızca temiz çıktı meselesi değildir. Bir güvenlik sorunudur.

Bir kullanıcının <script>alert(1)</script> içeren bir yorum gönderdiğini düşünün. Bu dizeyi kodlamadan doğrudan HTML sayfasına yapıştırırsanız tarayıcı bunu JavaScript olarak çalıştırır. Bu bir XSS (Cross-Site Scripting) saldırısıdır ve web uygulama güvenlik açıklarının önemli bir bölümünden sorumludur.

Çözüm basittir: çıktı vermeden önce kodlayın. PHP'de htmlspecialchars() dört kritik karakteri işler. JavaScript'te manuel veya bir kütüphane aracılığıyla yapılır. Python'da html.escape() yeterlidir.

Paragraf mı, Satır Sonu mu?

Çoğu kişinin yanıldığı yer burasıdır. HTML'de satır sonlarını işlemenin iki yolu vardır ve farklı amaçlara hizmet ederler.

Blok içerik için <p> etiketleri kullanın. Paragraf etiketi anlamsal bir değer taşır; tarayıcıya, ekran okuyuculara ve arama motorlarına bunun ayrı bir metin birimi olduğunu söyler. Paragrafların varsayılan üst ve alt kenar boşlukları vardır, bu nedenle metniniz ekstra CSS olmadan nefes alır.

Bir blok içindeki kasıtlı satır sonları için <br> kullanın. Şiir, posta adresleri, şarkı sözleri, kod örnekleri — bunların görsel satır sonlarına ihtiyacı vardır ama yine de tek bir mantıksal birimdir. Her satırı <p> ile sarmak istenmeyen boşluk ve yanlış anlam ekler.

Temel Karakterlerin Ötesinde Özel Karakterler

Dört ana varlığı hallettikten sonra, gerçek içerikte düzenli olarak karşılaşılan birkaç karakter daha vardır:

Gerçek Kullanım Senaryoları

İçerik yönetim sistemine içerik yapıştırmak en yaygın durumdur. WordPress veya benzeri sistemler genellikle kendi temizleyicilerine sahiptir, ancak ham HTML bloğu veya HTML'i doğrudan kabul eden bir headless CMS kullanıyorsanız kodlanmamış metin sorun çıkarır.

E-posta HTML şablonları daha az affedicidir. E-posta istemcileri ortak bir render motoru paylaşmaz ve birçoğu CSS'i yok sayar. Outlook 2019 ve Apple Mail'de aynı anda düzgün görüntülenebilmesi için karakter kodlamasını doğru yapmak zorunludur.

README dosyalarını dönüştürmek geliştirici odaklı bir senaryodur. Kod örneklerinde açı ayraçları içeren düz metin bir README, dönüştürülmeden HTML sayfasına eklenirse bozuk görünür.

Word veya Google Docs'tan blog yazılarını taşımak muhtemelen en dağınık senaryodur. Bu uygulamalar akıllı tırnak işaretleri, kıvrımlı kesme işaretleri, standart dışı tireler ve bazen özel işaretleme ekler. Düzgün bir dönüştürücü standart dışı karakterleri kaldırır ve bunları doğru HTML varlıkları veya UTF-8 eşdeğerleriyle değiştirir.

Metin-HTML Dönüştürücüler Genellikle Neler Sunar?

İyi bir dönüştürücü, tek tip bir dönüşüm uygulamak yerine dönüşüm üzerinde kontrol sağlar. Genellikle göreceğiniz seçenekler:

• <p> etiketlerine sar — çift satır sonları paragraf kesmeleri olur
• URL'leri bağlantıya dönüştür — http:// ve https:// dizelerini target="_blank" rel="noopener" ile çapa etiketlerine sarar
• Boşluğu koru — önceden biçimlendirilmiş içerik için çıktıyı <pre> ile sarar
• nl2br ekle — her satır sonunu <br>'ye dönüştürür
• HTML'yi soyundu — girişte zaten etiketler varsa dönüştürmeden önce bunları kaldırır