Kullanılmayan CSS ‘ leri Kaldırma – Web Sitesi Hızlandırma

Yazar: Editor | 21 Ağustos 2019 tarihinde düzenlendi.

Kullanılmayan CSS Kaldırma & Temizleme

Site hızı ve performansı artık SEO çalışmalarında en önemli kriterler arasında yer alıyor. WordPress gibi hazır yazılımlar veya web tasarımcıların oluşturduğu özel siteler fark etmeksizin; sayfalarınızda kullanılmayan gereksiz CSS ve JSS satırlarını bulmanız, ardından bu kodları temizlemeniz gerekir. Böylece sayfa boyutunu ve yüklenme süresini düşürebilirsiniz.

Google PageSpeed & Lighthouse gibi site hızı analizi ve ölçümü yapan araçlarda bu hatayla karşılaşmanız oldukça normal: “JavaScript + CSS’leri kaldırın veya erteleyin!


Kullanılmayan CSS – Sıkça Sorulan Sorular

Kesinlikle. Web sitenizi hızlandırabilmek adına kullanılmayan CSS satırlarını mutlaka temizlemeniz / kaldırmanız gerekiyor.
Maalesef hiçbir önbellekleme (cache) eklentisi bu görevi üstlenemez. Bu işlemin manuel olarak yapılması gerekli.
Evet sizin yerinize bu işlemi yarı otomatik olarak yapan online araçlar bulunuyor.
Bunun için en etkili yöntem Google Chrome tarayıcısıyla web sitenize girerek birkaç ufak işlemi gerçekleştirmek.


Cache Eklentileri, Kullanılmayan CSS satırlarını temizler mi?

Maalesef, hiçbir cache eklentisi bu işlemi sizin yerinize yapamaz. Bahsi geçen işlem, CSS küçültme veya birleştirme ile alakalı değildir.

  • WordPress alt yapılı sitelerde yüklenen eklentilerle beraber farklı css ve js dosyaları çağrılır.
  • Bu nedenle eklenti kullanımını minimum seviyede tutmaya özen gösterin.
  • Manuel olarak halledebileceğiniz özelleştirmeler için plugin kullanmaktan kaçının.
  • Yine tema seçiminde dikkatli olmanız gerekiyor.
  • Tercihiniz çok amaçlı (Multipurpose) tasarımlardan yana asla olmasın.

Kullanılmayan CSS + JS Nasıl Temizlenir? [1]

  • Google Chrome tarayıcısından sitenize girin.
  • Sayfa üzerinde herhangi bir yere sağ tıklayarak incele yazısına basın. ( Klavye kısayolu:  Ctrl + Shift + I )
  • DevTools ekranına eriştiyseniz, tebrikler!
  • Çarpı işaretinin hemen altında sağ üst menüde bulunan üst üste üç nokta olan yere tıklayın » More tools » Coverage
  • Alt panele Capture sekmesi gelecek, kayıt butonuna tıklayarak işlemi başlatın.
  • Listedeki dosyaların son sütununa bakarak değerlendirme yapabilirsiniz.  (kırmızı = sitede kullanılmayan kodlar, yeşil = kullanılanlar)Kullanılmayan CSS ve JSS
  • Herhangi bir  js veya css stil dosyasına tıkladığınızda kaynak kodu alanında kullanılan / kullanılmayan kodları satırlar halinde görebileceksiniz.
Ayrıca Bakınız :   WordPress Resimlere ALT Etiketi Ekleme (Eklentisiz)

Gereksiz CSS satırlarından Kurtulun!

CSS temizlemesi yapan Online Araçlar Neler? [2]

Bu iş için yardımınıza koşan aşağıdaki online tools-lardan da faydalanabilirsiniz. Ancak en sağlıklı sonucı Chrome tarayıcı ile alırsınız.

  1. https://purifycss.online/
  2. https://unused-css.com/ (ücretsiz paketi seçin!)

Bunların dışında grunt-uncss yöntemini de (teknik bilgi içerir – otomatik Türkçe çeviriyi açabilirsiniz) deneyebilirsiniz. Firefox için “Dust-Me Selectors” eklentisine maalesef artık ulaşılamıyor.

Kurumsal bir SEO Uzmanına ihtiyacınız mı var?
Seokaos SEO Uzmanı

Kimler Neler Demiş?

avatar