HTML Küçültücü

Bir kod parçası, e-posta gövdesi veya sayfanın tamamını yapıştırın; en fazla 1.000.000 karakter.

İleri: seçenekleri belirleyin

HTML kodunu yapıştırın veya bir HTML dosyası açın, ne kadarının kaldırılacağını seçin ve kaç bayt tasarruf ettiğinizi gösteren daha küçük sürümü kopyalayın ya da indirin. Güvenli seviye iki sözcüğü asla birleştirmez; böylece sayfa aynı görünür ve aynı şekilde çalışır. Satır içi CSS ve JavaScript de küçültülür.

HTML Küçültücü nasıl kullanılır

  1. 1

    HTML kodunuzu ekleyin

    İşaretlemeyi düzenleyiciye yapıştırın veya UTF-8 olarak kaydedilmiş, en fazla 1.000.000 karakterlik bir .html, .htm ya da .xhtml dosyası açın.

  2. 2

    Seviyeyi ve seçenekleri belirleyin

    Her türlü HTML için Güvenli seviyesini koruyun veya test edeceğiniz eksiksiz bir sayfa için Maksimum seviyesini seçin. Ardından yorumların kaldırılıp kaldırılmayacağına ve satır içi CSS ile JavaScript'in küçültülüp küçültülmeyeceğine karar verin.

  3. 3

    Sonucu kopyalayın veya indirin

    Küçültülmüş HTML'yi ve boyutları kontrol edin, ardından kopyalayın veya dosya olarak indirin. Sonuç sayfasında seçenekleri değiştirirseniz küçültme yeniden çalışır.

Küçültücü neleri değiştirir

Araç, yaygın olarak kullanılan açık kaynaklı bir HTML küçültücü olan html-minifier-terser’i, CSS için clean-css ve JavaScript için Terser ile birlikte kullanır. Her iki seviye de sözcükler arasındaki ve <b> ile <a> gibi satır içi etiketler arasındaki boşluğu korur. Maksimum, eksiksiz sayfalarda daha fazla tasarruf sağlar.

Değişiklik Güvenli Maksimum
Satır sonları ve art arda gelen boşluklar Tek boşluğa dönüşür Tek boşluğa dönüşür ve <div> ile <li> gibi bloklar arasında tamamen kalkar
Sözcükler ve satır içi etiketler arasındaki boşluk Korunur Korunur
</p>, </li>, <head> ve <body> gibi isteğe bağlı etiketler Korunur Kaldırılır
Öznitelik değerlerini çevreleyen tırnaklar Korunur HTML’nin izin verdiği yerlerde kaldırılır
checked="checked" gibi mantıksal öznitelikler Korunur checked olarak kısaltılır
Boş class, id ve style öznitelikleri Korunur Kaldırılır
<br/> içindeki kapanış eğik çizgisi Korunur Kaldırılır
type="text/javascript" ve type="text/css" Kaldırılır Kaldırılır

XHTML: bir .xhtml dosyası açtığınızda veya HTML, <?xml version="1.0"?> gibi bir XML bildirimiyle başladığında her iki seviye de isteğe bağlı etiketleri, öznitelik değerlerini çevreleyen tırnakları, checked="checked" gibi mantıksal öznitelikleri ve kapanış eğik çizgilerini korur; JavaScript ise küçültülmez. Böylece sonuç yine XML olarak okunabilir.

Seçenekler

  • Yorumları kaldır (varsayılan olarak açık): sıradan yorumlar kaldırılır. <!--! ile başlayan yorumlar (lisans bildirimleri gibi), sunucu tarafı ekleme (SSI) yorumları ve Internet Explorer koşullu yorumları korunur.
  • CSS’yi küçült (varsayılan olarak açık): <style> öğelerindeki ve style özniteliklerindeki CSS kısalır. Bir @import olduğu gibi kalır ve hiçbir şey indirilmez.
  • JavaScript’i küçült (varsayılan olarak açık): satır içi komut dosyaları ve onclick gibi olay öznitelikleri kısalır. Yerel değişken adları kısaltılır, genel adlar olduğu gibi kalır ve /*! ... */ biçimindeki lisans yorumları korunur. JSON-LD gibi yapılandırılmış verilerin içeriği küçültülmez.

Asla değiştirilmeyenler

  • <pre> ve <textarea> içindeki metin; bu öğelerde boşluklar ve satır sonları sayfada görünür.
  • &nbsp;, &amp; ve &eacute; gibi karakter başvuruları.
  • PHP (<?php ... ?>) ve ASP tarzı (<% ... %>) bloklar ile iki <!-- htmlmin:ignore --> yorumu arasındaki her şey.
  • Doctype, <a name> bağlantı noktaları, giriş alanlarındaki type="text" ile SVG içindeki büyük/küçük harfler ve kapanış eğik çizgileri.

Görebileceğiniz notlar

  • Bir komut dosyası okunamadı: tek başına geçerli JavaScript olmayan bir satır içi komut dosyası veya olay özniteliği küçültülmeden bırakılır ve araç hatanın satırını ve sütununu gösterir. Sayfanın geri kalanı yine de küçültülür.
  • Bir CSS bloğu okunamadı: bu CSS küçültülmeden bırakılır.
  • UTF-8 dışında bir karakter kümesi: indirilen dosya her zaman UTF-8 olarak kaydedilir; bu nedenle sayfanın <meta charset> bildirimini UTF-8 olarak değiştirin veya sonucu kendi dosyanıza kopyalayın.
  • Kazanç yok: HTML, bu seçeneklerle ulaşılabilecek en küçük boyutta.

Bir <script> veya <style> öğesi hiç kapatılmamışsa hiçbir şey küçültülmez ve araç bu öğenin başladığı satırı ve sütunu gösterir. Hangi seviyeyi seçerseniz seçin, yayımlamadan önce küçültülmüş sayfayı açıp gezinerek kontrol edin.

Sık Sorulan Sorular

Güvenli seviyede evet. Boşluklar tek boşluğa indirilir ama asla silinmez; bu yüzden <b>Merhaba</b> <i>dünya</i> yine “Merhaba dünya” diye okunur ve yan yana duran öğeler aralarındaki boşluğu korur. Yalnızca CSS’nin boşluklarını koruyarak gösterdiği metin, örneğin white-space: pre ile gösterilen metin, değişebilir.

Yayımlamadan önce test ettiğiniz eksiksiz sayfalarda. Bloklar arasındaki boşlukları ve </p> gibi isteğe bağlı etiketleri kaldırarak daha fazla bayt tasarrufu sağlar. İki şeyi kontrol edin: display: inline-block ile yan yana duran öğeler aralarındaki boşluğu kaybedebilir ve son </p> etiketi kaldırılmış bir parça, arkasından eklenen HTML kodunu içine alabilir.

Yorumları kaldır açıkken sıradan yorumlar silinir. <!--! ile başlayan yorumlar, <!--#include virtual="/footer.html" --> gibi sunucu tarafı ekleme yorumları ve <!--[if IE]> gibi Internet Explorer koşullu yorumları korunur. Bir bölümü tam olarak yazıldığı gibi tutmak için onu iki <!-- htmlmin:ignore --> yorumunun arasına koyun. Bu iki işaret kaldırılır.

JavaScript yalnızca geçerli kod olarak okunabildiğinde küçültülür. Satır içi bir komut dosyasında söz dizimi hatası veya tek başına JavaScript olmayan şablon kodu varsa bu komut dosyası küçültülmeden bırakılır, sayfanın geri kalanı küçültülür ve araç hatanın satırını ve sütununu gösterir.

Hayır. Yapıştırdığınız veya açtığınız HTML kodu tarayıcınızda kalır. Sunucularımıza gönderilmez ve sayfa bağlantısına eklenmez. Adımlar arasında, sekmeyi kapatana veya Yeniden başla’yı seçene kadar bu tarayıcı sekmesinde saklanır. Siz bir sonuç istediğinizde sayfa küçültücünün kodunu indirir ve bir küçültme yapıldığını sunucumuza HTML kodunu göndermeden bildirir.

Yapıştırılan veya UTF-8 olarak kaydedilmiş bir dosyadan açılan en fazla 1.000.000 karakter. Dosya başka bir kodlama kullanıyorsa araç bunu bildirir: dosyayı bir düzenleyicide açın, HTML kodunu kopyalayıp buraya yapıştırın. 30 saniyeden uzun süren bir küçültme durdurulur. Bu durumda HTML kodunun daha kısa bir bölümünü deneyin.

İlgili Araçlar

Araç diğer dillerde mevcuttur