WordPress’in yol gösterici ilkesi, internetin herkes için olduğu ve herkesin, kodlama bilgisi olmadan bile bir web sitesi yapabileceğidir. Ve doğrudur – bir web sitesi oluşturmak için kesinlikle sıfır kodlama bilgisine ihtiyacınız vardır, fakat bu, başka birinin kodlamasına güvenmek anlamına gelir.
Buradaki tuzaklar açıktır: öyle olabilir ki web siteniz, genellikle CSS’de olmak üzere, gerçekten çalıştırılmasına gerek duymayan kodlar içerebilir. Bu eğitim, kullanılmayan CSS’yi WordPress web sitenizden nasıl kaldıracağınızla ilgilidir. Ama CSS nedir? Neden web sitenizde ihtiyaç duymadığı bir kod var? Kod hiçbir şey yapmıyorsa, neden öylece bırakmıyorsunuz? Bu soruları ve daha fazlasını cevaplamaya çalışacağız. İşte hakkında konuşacağımız konular:
-
CSS Nedir?
-
Kullanılmayan CSS Nereden Geliyor ve Neden Kaldırılıyor?
-
Web Sitemde Kullanılmayan CSS Olup Olmadığını Nasıl Belirlerim?
-
Kullanılmayan CSS Nasıl Güvenle Kaldırılır
CSS Nedir?
CSS, basamaklı stil sayfaları anlamına gelir. Bir web sayfasının kullanıcılara nasıl görüneceğini belirleyen, bir tarayıcı için bir dizi talimattır. Bir web sayfası, HTML gibi bir biçimlendirme dili kullanılarak yapılandırılmıştır, fakat HTML kullanıcı tarafından okunamaz. Bir web tarayıcısı HTML’yi okur ve içeriği bir kullanıcıya insan tarafından okunabilir biçimde sunar.
Fakat bir tarayıcının işaretlenmiş bir metni varsayılan olarak yorumlaması, pek çok ayırt edilemez sayfaya neden olur ve işte burada CSS devreye girer. CSS’nin birçok kullanımı vardır: yazı tipi boyutunu, renkleri ve türü değiştirme, satır sonlarını ve paragraf aralığını değiştirme, ekleme ve değiştirme arka plan resimleri ve çok daha fazlası.
Kullanılmayan CSS Nereden Geliyor ve Neden Kaldırılıyor?
Gereksiz kodun web sitenize girmesinin birçok yolu vardır. CSS söz konusu olduğunda, muhtemelen WordPress web sitenize yüklediğiniz ve kullanıcıya sunulma şeklini etkileyen bir şey olacaktır. Örneğin bir temanın kendi CSS’si vardır, bu da web sitenizi aynı temayı kullanmayan diğerlerinden farklı kılar. Sayfa oluşturucu gibi bir eklentinin kendi CSS’si olabilir ve dolayısıyla yazı tipleri, simge yazı tipleri ve yükleyebileceğiniz diğer birçok yazılım parçası olabilir.
Ama ne zararı var diye sorduğunuzu duyar gibiyiz. Püf Nokta: web siteniz çalışması gerekmeyen çok sayıda dosya yüklüyor, bu da yükleme sürenizin gereksiz yere uzaması anlamına geliyor. Yavaş yükleme süreleri yalnızca ziyaretçilerinizin kullanıcı deneyimini etkilemez – arama motorları, hemen çıkma oranlarını (bir kullanıcının web sitenizden ne kadar hızlı “vazgeçtiği”) ve yükleme süresini hesaba katar.
Ve CSS dosyaları küçük olma eğilimindeyken, herhangi bir web sitesinde çok sayıda olabilir. Bu yüzden zararsız işe yaramaz kod diye bir şey yoktur.
Web Sitemde Kullanılmayan CSS Olup Olmadığını Nasıl Belirlerim?
Bir web sitesinin kullanılmayan CSS sorunlarından muzdarip olup olmadığını belirlemek nispeten kolaydır: Google’ın özellikle bunun için bir aracı vardır. Google PageSpeed Insights’ı web sitenizde gereksiz yavaşlama olup olmadığını belirlemek ve bunlardan kaçının kullanılmayan CSS’ye atfedilebileceğini görmek için kullanabilirsiniz.
Testi, açıkça birçok sorunu olan bir web sitesinde gerçekleştirdik. Google’ın önerilerini görmek için kullanılmayan CSS’yi silme sonuçlarını genişletebilirsiniz.
Açıkçası, bu yalnızca Google’ın kriterleri için çalışıyor. Fakat tüm arama motorları farklı algoritmalara sahip olsalar da benzer şekillerde çalışma eğilimindedirler. Ayrıca yavaş yükleme süreleri, nasıl keserseniz kesin yavaş yükleme süreleridir ve bunu kimse istemez.
Kullanılmayan CSS Nasıl Güvenle Kaldırılır
Buradaki zorluk, hangi CSS’nin yararsız olduğunu bilmektir. Cevap? Bunu kendin bilmene gerek yok. Yine başka birinin koduna güvenebilirsin ve güvenmelisin. Bu durumda, bu bir eklentidir: Asset CleanUp.
Öncelikle eklentiyi kurun ve etkinleştirin. Hemen eklentinin Başlarken ekranına yönlendirileceksiniz. Kullanılmayan CSS’yi kaldırmaya başlamak için sağ taraftaki menüden Ayarlar’ı seçin.
Web sitesi ziyaretçilerini etkilemeden farklı ayarları test etmek için eklentinin test modunu etkinleştirmeniz gerekir. Bunu yapmak için Test Modu sekmesini seçin ve kaydırıcıyı kaydırın ve Tüm Ayarları Güncelle’ye tıklayın.
Şimdi bu eklentinin birçok seçeneği ve ayarı var. Kullanılmayan CSS’yi kaldırmaya odaklanacağız. Bunu yapmak için CSS & JS Manager ayarlarına ihtiyacımız var. Ana Sayfa alt sekmesinde açılacaktır. Burası, web sitenizin ana sayfasında hangi dosyaların yüklendiğini görebileceğiniz yerdir.
Listeyi aşağı kaydırarak, bu dosyaların her birinin yanı sıra kaynağı, konumu, dosya boyutu ve geri kalanı gibi pek çok ilgili veriyi görebilirsiniz. Ayrıca sayfada bir kod parçasına ihtiyaç olup olmadığına dair yararlı bir ipucu olan bir İpucu da alabilirsiniz.
Örneğin İletişim Formu 7 söz konusu olduğunda, dosyanın bir formla ilişkili olduğunu görebilirsiniz. Öneri, üzerinde form yoksa dosyanın Ana Sayfa’dan kaldırılmasıdır. Aynısı, form kullanmayan diğer tüm sayfalar için de geçerlidir.
İletişim Formu 7’nin CSS’sini Ana Sayfadan kaldırmak için kaydırıcıyı etkinleştirin ve Güncelle’ye tıklayın.
Bu kadar basit: artık kullanılmayan CSS’yi kaldırarak web sitenizin biraz daha hızlı yüklenmesini sağladınız.
Sorun şu ki, tüm bunları tüm gönderiler ve sayfalar için de yapmanız gerekiyor. Örneğin bir gönderi için bir CSS listesi yüklemek üzere Gönderi sekmesine geçin ve arama alanında onu arayın ve listeden bir gönderi seçin.
Kaldırdığınız CSS’den memnun kaldığınızda, her şeyin düzgün yüklenip yüklenmediğini test edin ve bitirdiniz. Daha sonra ayarların yalnızca oturum açmış yöneticilere değil tüm kullanıcılara uygulanmasını sağlamak için test modunu kapatabilirsiniz.
Çözüm Yolu
Gördüğünüz gibi, web sitenizin kullanılmayan CSS’den muzdarip olup olmadığından emin olmanız için iyi nedenler var. Kullanılmayan tüm CSS’leri web sitenizden kaldırmak, özellikle de çok sayıda sayfa içeriyorsa, biraz çalışma gerektirir, fakat sonuçlar buna değer – arama motorları sizi yavaşlık ve hemen çıkma oranı nedeniyle cezalandırmazken, ziyaretçileriniz daha hızlı yükleme sürelerini takdir edeceklerdir. , daha fazla potansiyel ziyaretçiye yol açar.