CSS'yi Denetlemek ve Optimize Etmek için 4 Araç

Web siteniz büyümeye başladığında, kodunuz da değişecek. Kodunuz genişledikçe, CSS'nin aniden bakımı zorlaşır ve bir CSS kuralının diğerine yazması ile sona erebilir. Bu işleri karmaşık hale getirir ve muhtemelen birçok hatayla karşılaşırsınız..

Bu sana oluyorsa, senin için zamanı sitenizin CSS’sini denetleyin. CSS’nizi denetlemek, CSS’nizin optimize edilmemiş kısımlarını belirlemenizi sağlar. Sitenizin performansını yavaşlatan kod satırlarını ortadan kaldırarak da stil sayfası dosya boyutunu azaltabilirsiniz..

CSS'yi denetlemenize ve optimize etmenize yardımcı olacak 5 iyi araç.

Tip-o-matic

Tip-o-matic bir web sitesinde kullanılan yazı tiplerini analiz etmek için bir Firebug eklentisidir. Bu eklenti, yazı tipi ailesi, boyut, ağırlık, renk gibi yazı tipi özelliklerini ve ayrıca yazı tipinin web sayfasında kullanılma sayısını içeren bir tabloda görsel bir rapor sunar. Rapor tablosu aracılığıyla font kullanımını kolayca optimize edebilir, gereksiz olanı kaldırabilir veya çok benzer stilleri birleştirebilirsiniz.

CSS Lint

CSS Lint bir pamuklanan CSS'inizin performansını, erişilebilirliğini ve uyumluluğunu ele alan belirli parametrelere dayanarak CSS sözdizimini analiz eden bir araçtır. Sonuçlara şaşıracaksınız, CSS’nizde çok fazla uyarı bekliyor olacaksınız. Ancak, bu hatalar sonunda CSS sözdizimini çözmenize ve daha verimli hale getirmenize yardımcı olur. Ek olarak, daha iyi bir CSS yazarı olacaksınız..

CSS ColorGuard

CSS ColorGuard nispeten yeni bir araçtır. Bir Node modülü olarak oluşturulmuştur ve tüm platformlarda çalışır: Windows, OS X ve Linux. CSS ColorGuard, stil sayfanızda benzer renkler kullanıyorsanız sizi bilgilendirecek bir komut satırı aracıdır; Örneğin. # f3f3f3 oldukça yakın # f4f4f4, yani ikisini birleştirmeyi düşünebilirsiniz. CSS ColorGuard yapılandırılabilir, benzerlik eşiğini ayarlayabilir ve aracın yoksaymasını istediğiniz renkleri belirleyebilirsiniz..

CSS Kazmak

CSS Kazmak Python betiğidir ve bilgisayarınızda yerel olarak çalışır. CSS Dig, CSS'inizde kapsamlı bir inceleme yapacaktır. Örneğin özelliklerini okur ve birleştirir. tüm arka plan rengi açıklamaları arka plan bölümünün altına gider. Bu şekilde, örneğin CSS sözdiziminizi standartlaştırmaya çalışırken, rapora dayalı kararları kolayca alabilirsiniz; aşağıdaki renk bildirimiyle stiller arasında renk bulabilirsiniz.

 renk: #ccc; renk: #cccccc; renk: #CCC; renk: #CCCCCC; 

Bu renk beyanları aynı şeyi yapar. Sen de gidebilirsin #ccc veya sermaye ile #CCC standart olarak. CSS Dig, bu fazlalığı diğer CSS özellikleri için de gösterebilir ve kodunuzun daha tutarlı olmasını sağlayabilirsiniz..