Autoptimize Eklentisi Kullanılarak HTML, CSS ve JavaScript Nasıl Küçültülür

Google ve diğer Arama Motorları, çok hızlı yüklenirse web sitenize değer verir. Çünkü hiçbir izleyicinin içeriğinizi görüntülemek için uzun süre beklemesi gereken pek çok hasta yoktur ve dikkatlerini çekmek için sadece 1,5 saniyeniz vardır. Sitenizin açılması uzun sürüyorsa, genellikle görüntüleyenlerinizi kaybedersiniz. Yani, bu web sitenizi hızlandırmak için önemlidir. Sitenizi optimize etmenin birkaç yolu vardır. Ama en önemli kısımlardan biri HTML, CSS ve JavaScript’i küçültün.


Şimdiye kadar bir Hız testi yaptıysanız Google PageSpeed veya GTmetrix, muhtemelen bu seçeneği görüyorsun.

Her web sitesi HTML, CSS ve JavaScript içeren çok sayıda dosyayla yüklenir. Ve dosyaların çoğu çok fazla alan, yorum, Blok sınırlayıcı vb. İçerir..

Bu aynı zamanda Tema kalitesine de bağlıdır. Örneğin, premium tema kalitesi her zaman Ücretsiz temadan daha iyidir. Premium temalar iyi kodlanmış ve son derece yetenekli geliştiriciler tarafından oluşturulmuştur. Ancak tüm temalar aynı değildir ve farklı türde işlevlere sahiptir. Yani, tarafından küçültülmesi bu HTML, CSS ve JavaScript dosyası ile site hızınızı stratejik olarak artırabilir ve ziyaretçilerinizi mutlu edebilirsiniz.

Küçült nedir ve neden faydalıdır??

Minification işlevselliğini değiştirmeden tüm gereksiz karakterleri kaynak kodundan kaldıran bir programlama dilidir. Bu gereksiz karakterler genellikle “beyaz boşluk karakterler, yeni satır karakterleri, yorumlar, ve sınırlayıcıları engelle ”. 

Küçültmeden Önce ve Küçültmeden Sonra

Koda okunabilirlik eklemek için kullanılırlar, ancak kodun çalıştırılması gerekmez. Bu şekilde web üzerinden aktarılması gereken kod miktarını azaltır ve bant genişliğinizi korur. Böylece HTML, CSS ve JavaScript’i küçültme, bu gereksiz karakterleri sitenizden kolayca kaldırabilir ve artırmak site hızınız. 

HTML, CSS ve JavaScript Nasıl Küçültülür

HTML, CSS’yi Küçültmenin iki yolu vardır & JavaScript. Tema kodunuzu düzenleyerek yapabilir veya adlı bir WordPress eklentisini kullanabilirsiniz. Autoptimize. Bu makalede, size her iki işlemi de göstereceğiz HTML, CSS ve JavaScript Nasıl Küçültülür.

Soruna neden olan tam HTML, CSS veya JavaScript dosyasını bilmek için, aşağıdaki gibi herhangi bir site hızı test aracında kontrol etmeniz gerekir Google PageSpeed ​​aracı veya GTmetrix. Çünkü tüm dosyalarınız bu tür gereksiz karakterler içermiyor.

Site sonucunuzu kontrol ettikten sonra elde edersiniz. İşte sitemin aşağıda dikkate alan bir resmi sabitleme CSS ve JavaScript.

Css, JavaScript'i küçültme

Tema kalitenizi bozar. Yani, her ikisini de görürseniz endişelenecek bir şey Küçült’e söylenir ve Premium bir tema almak daha iyidir.

HTML, CSS ve JavaScript kodunu Küçültebileceğiniz bazı çevrimiçi araçlar vardır. 

Herhangi bir değişiklik yapmadan önce, o dosyanın yedeğini alın.

1. Kodu Küçült:

Kod Küçültme Aracı

Kodu Küçült Hepsi Bir Arada Küçültme aracıdır. JavaScript, CSS ve HTML kodlarınızı küçültebilir. Tek yapmanız gereken HTML veya CSS veya JavaScript kodunu kopyalayıp buraya yapıştırmak. Sonra tıklayın küçültmek Seçeneği. Bu araç kodunuzu otomatik olarak küçültün. Bundan sonra, bu dosyadaki Küçültülmüş kodu kopyalayın.

Ayrıca, bu araçla CSS ve JavaScript kodunuzu HTML kodu gibi küçültebilirsiniz.

# 2 Willpeavy:

Willpeavy

Willpeavy başka bir harika araç HTML’yi küçültün kodlar. Bu araç, kodu küçültme ile aynı şekilde çalışır. HTML ve işaretlemenize dahil olan herhangi bir CSS veya JS’yi küçültür. Bu aracı kullanmak için kodunuzu buraya kopyalamanız ve Küçült’ü tıklamanız yeterlidir..

Autoptimize Eklentisini Kullanarak Küçült

Autoptimize

Böyle bir kodlamaya aşina değilseniz, bir eklenti kullanmak daha iyidir ve yeni başlayanlar için önerilir. İşte geliyor Eklentiyi otomatik olarak optimize et için WordPress kullanıcılar.

Autoptimize tüm komut dosyalarını ve stil kodlarını birleştirir ve çok hızlı yüklenecek şekilde küçültür. Tüm HTML, CSS’yi küçültür & Javascript kodu kendisi ve sayfanızı gerçekten hafif yapmak. Minification ile bu eklenti, sona eren üstbilgiler ekler ve stilleri sayfa başına taşır ve komut dosyalarını altbilgiye taşıyabilir.

Tavsiye Ayarlarını Otomatik Olarak Optimize Et

Eklenti ayarlarından her şeyi kolayca yapabilirsiniz. Bu eklentiyi etkinleştirdikten sonra şu adrese gidin: Ayarlar> Autoptimize.  “Gelişmiş ayarları göster” düğmesini tıklayın.

İçinde HTML bölümünde, daha hızlı performans için “HTML Kodunu Optimize Et” ve “HTML yorumlarını koru” seçeneklerini işaretleyin.

HTML seçeneklerini otomatik olarak optimize etme

İçinde JavaScript bölümünde, “JavaScript Kodunu Optimize Et” i etkinleştirin. JS’yi erken yüklemek ve JS hatalarının olasılığını azaltmak için “JavaScript’i zorla” özelliğini de etkinleştirebilirsiniz. JS’niz komut dosyalarını bozarsa, “Try-catch sarma ekle” özelliğini etkinleştirebilirsiniz.
JavaScript Seçeneklerini Otomatik Olarak Optimize Edin

İçinde CSS bölümünde, “CSS Kodunu Optimize Et”, “Ayrıca satır içi CSS’yi topla” seçeneğini etkinleştirin. CSS’yi küçültdüyseniz “Satır İçi ve Ertele” seçeneğini de etkinleştirebilirsiniz. CSS’nizi küçültmek ve kutuya yapıştırmak için bu aracı deneyin.

CSS seçeneklerini otomatik olarak optimize et

Girin CDN “CDN Temel URL” alanındaki URL. Örneğin, ‘//cdn.example.com/’.

Son olarak, “Birleştirilmiş komut dosyasını / css’yi statik dosya olarak kaydet” seçeneğini etkinleştirin. Ancak, web sunucunuzun sıkıştırma ve süre sonu işlemlerini doğru bir şekilde yapabildiğinden emin olun.

CDN seçeneklerini otomatik olarak optimize et

Kodunuzu Küçültdükten sonra, sitenizin hızını tekrar kontrol etmeyi unutmayın. Sonra bunu geçmiş sonuçlarla karşılaştırın. Siteniz bir sorunla karşılaşıyorsa veya düzgün bir şekilde gösterilmiyorsa, sitenizi temizlemeyi deneyebilirsiniz. Önbellek

Sonuç

HTML, CSS’yi küçültme ve JS siteniz için yararlıdır. Kodunuzun gereksiz karakterlerini kaldırır ve tarayıcı dostu olan karakterleri küçültür. Bu şekilde site yükleme hızınızı artırabilirsiniz.

Bu eğitici HTML, CSS ve JavaScript’i Küçültmeye yardımcı oluyorsa, lütfen bu makaleyi Facebook, heyecan, Google+.

İlgili Makaleler,

  • WordPress’de Tarayıcı Önbelleğe Alma Özelliğinden Nasıl Yararlanılır
  • WP-Sweep Kullanarak WordPress Veritabanını Optimize Etme
  • WordPress 2017 için En İyi Görüntü İyileştirici 2017
  • Daha Hızlı Yükleme için WordPress’te Gzip Sıkıştırmasını Kolayca Etkinleştirme
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map