Bir web sitesinin görünümü ve ya da "stili" CSS (Basamaklı Stil Sayfaları) tarafından belirlenir. Bu, web sitenizin dizinine ekleyeceğiniz ve sayfalarınızın görsel tasarımını ve düzenini oluşturan çeşitli CSS kurallarını içerecek bir dosyadır.
Siteler birden fazla stil sayfası kullanabilir ve çoğu zaman kullanabilse de, bunun yapılması gerekli değildir. Tüm CSS kurallarınızı tek bir dosyaya yerleştirebilir ve birden fazla dosya alması gerekmediğinden, daha hızlı yükleme süresi ve sayfaların performansı da dahil olmak üzere, aslında bunun faydaları vardır. Çok büyük olsa da, kurumsal sitelerin zaman zaman ayrı stil sayfalarına ihtiyaç duyabileceği gibi, birçok küçük ve orta ölçekli site, yalnızca tek bir dosyayla mükemmel bir performans sergileyebilir. Bu, web tasarım çalışmamın çoğunda kullandığım şey - sayfalarımın ihtiyaç duyduğu tüm kurallara sahip tek bir CSS dosyası. Şimdi soru şimdi olur - bu CSS dosyasını ne adlandırmalısınız?
Adlandırma Konusu Temelleri
Web sayfalarınız için harici bir stil sayfası oluşturduğunuzda, HTML dosyalarınız için benzer adlandırma kurallarını izleyerek dosyayı adlandırmanız gerekir:
Özel Karakterler Kullanmayın
CSS dosya adlarınızda az, 0-9, alt çizgi (_) ve tireleri (-) harflerini kullanmalısınız. Dosya sisteminiz, içinde başka karakterler bulunan dosyalar oluşturmanıza izin verse de, sunucu işletim sisteminizin özel karakterlerle ilgili sorunları olabilir. Sadece burada belirtilen karakterleri kullanarak daha güvenlisiniz. Sonuçta, sunucunuz özel karakterlere izin verse bile, gelecekte barındırma sağlayıcılarını taşımaya karar verirseniz durum böyle olmayabilir.
Herhangi bir boşluk kullanmayın
Özel karakterler gibi, boşluklar web sunucunuzda sorunlara neden olabilir. Dosya adlarınızda bunları engellemek iyi bir fikirdir. Hatta bunları bir web sitesine eklemem gerekecek olursa, aynı kuralları kullanarak PDF'ler gibi dosyalara isim vermeyi bile düşünüyorum. Dosya adını daha kolay okunması için bir alana ihtiyacınız olduğunu düşünüyorsanız, bunun yerine tire veya alt çizgi tercih edin. Örnekler için, "bu, file.pdf" yi kullanmak yerine "this-is-the-file.pdf" yi kullanırdım.
Dosya Adı Bir Harfle Başlamalıdır
Bu mutlak bir gereklilik olmasa da, bazı sistemler bir harfle başlamayan dosya adlarıyla ilgili sorun yaşar. Örneğin, dosyanıza sayı karakteri ile başlamayı seçerseniz, bu sorunlara neden olabilir.
Tüm Küçük Harfleri Kullan
Bu bir dosya adı için gerekli olmasa da, bazı web sunucularının büyük / küçük harfe duyarlı olması ve dosyanın farklı bir durumda unutup referans olarak gönderilmesi iyi bir fikirdir. Kendi işimde, her dosya adı için küçük harf karakterleri kullanıyorum. Bunu birçok yeni web tasarımcılarının yapmayı hatırlamak için çabaladığı bir şey olarak buldum. Bir dosya isimlendirilirken varsayılan eylemleri, ismin ilk karakterini büyütmektir. Bundan kaçının ve yalnızca küçük harfli karakterlerin alışkanlığına girin.
Dosya Adını Mümkün Olduğu Kadar Kısa Tutun
Çoğu işletim sisteminde dosya adı sınırı söz konusu olsa da, bir CSS dosya adı için makul olandan çok daha uzun. İyi bir başparmak kuralı, uzantı içermeyen dosya adı için en fazla 20 karakterdir. Gerçekçi olarak, bundan daha uzun bir şey çalışmak ve yine de bağlantı kurmak istemiyor!
CSS Dosya Adınızın En Önemli Parçası
CSS dosya adının en önemli kısmı dosya adı değil, uzantıdır. Macintosh ve Linux sistemlerinde uzantılar gerekli değildir, ancak bir CSS dosyası yazarken bir tane eklemek iyi bir fikirdir. Bu şekilde, her zaman bir stil sayfası olduğunu ve gelecekte ne olduğunu belirlemek için dosyayı açmayacağını bileceksiniz.
Muhtemelen büyük bir sürpriz değil, ancak CSS dosyanızdaki uzantı şöyle olmalıdır:
.cssCSS Dosyası Adlandırma Kuralları
Sitede sadece bir CSS dosyanız varsa, onu istediğiniz gibi adlandırabilirsiniz. Ben de tercih ederim:
styles.css veya default.cssÇalıştığım sitelerin çoğunda tek bir CSS dosyası bulunduğundan, bu isimler benim için iyi çalışıyor.
Web siteniz birden çok CSS dosyası kullanacaksa, işlevlerinden sonra stil sayfalarını adlandırın, böylece her dosyanın amacının tam olarak ne olduğu açık olur. Bir Web sayfasının kendilerine eklenmiş birden çok stil sayfası olabileceğinden, o sayfanın işlevine ve içindeki stillere bağlı olarak stillerinizi farklı sayfalara bölmenize yardımcı olur. Örneğin:
- Düzen vs Tasarım layout.css design.css
- Sayfa bölümleri main.css nav.css
- Alt bölümler mainstyles.css subpage.css ile tüm site
Web siteniz bir çeşit çerçeve kullanıyorsa, her biri sayfaların farklı bölümlerine veya sitenin yönlerine (tipografi, renk, düzen vb.) Ayrılmış birden fazla CSS dosyası kullandığını fark edeceksiniz.
Jennifer Krynin tarafından yazılmış orijinal makale. Jeremy Girard tarafından 9/5/17 tarihinde düzenlendi