CSS Nedir?

CSS ÖrneğiCSS yani açılımıyla "Cascading Style Sheets" Türkçe' siyle "Basamaklanmış Stil Katmanları" bir web sitesi içerisinde birbiriyle uyumlu renk ve yazı tipi gibi öğelerin her sayfa için ayrı ayrı değil de tek bir yerden yönetilmesi anlamına gelen bir çeşit kodlama türüdür.

Örnek vermek gerekirse bir web sayfasında başlığın rengini kırmızı yapalım, yazı fontunu verdana yapalım. Diyelim ki 100 sayfadan oluşan bir web sitemiz var ve her sayfa için biz başlık rengini, yazı tipini ayrı ayrı belirlemeye kalkarsak hem bu bizim çok zamanımızı alacaktır hem de bunların değiştirilmesi gerektiğinde yine her sayfadaki kodu değiştirmek gerekecektir.

CSS burada imdadımıza yetişmektedir ve tek bir harici dosyaya yazacağımız CSS kodu ile tüm site geneline etki etmesini sağlayabiliriz. Bu hem zamandan tasarruf anlamına gelmekte hem de 100 kez yazılacağına 1 kez yazılan kodun sayfa yükleme süresini kısaltması anlamına gelecektir.

Örneğin bu web sitesi, harici bir CSS dokümanı tarafından yönetilmektedir ve içerisinde çok az miktarda kod barındırarak sayfaların hızlı yüklenmesi sağlanmaktadır. Bu sitenin css dokümanını görmek için tıklayınız.

CSS MenuBir diğer örnek ise; daha önceki teknolojilerle rollover dediğimiz ve menünün ya da resmin üzerine geldiğimizde bize başka renkte bir resmin gösterilmesi şeklindeki sistemi kullanmaktaydık. Bu hem resmin normal hali, hem de üzerine gelindiğindeki ikinci bir hali demekti ve bu sistemde iki adet resim dosyası kullanılmaktaydı. Oysa ki CSS ile sadece bir adet resim dosyası kullanarak rollover efektini kodlar ile tanımlayabiliyoruz ve bu da web sayfalarının hızlı yüklenmesi anlamına gelmektedir.

Bin sayfalık bir sitemiz var diyelim ve tüm sitedeki arka alan rengini (background) değiştirmek istiyoruz. Bunu yapmak saniyelerimizi alacaktır ve sitemizin tümündeki arka alan değişecektir. Ne kadar kullanışlı değil mi?

CSS' in Yararları

CSS' in W3C Standartları

CDD ValidatorCSS kodlaması dünya Web Birliği' nin belirlediği standartlara sahip olmalıdır. Bu standartlara uyulması hem görüntü birliği açısından hem de Google dostu olmasından önem taşımaktadır.

3C Bilişim tüm müşterilerinin web tasarımlarını standart olarak hem XHTML hem de CSS olarak W3C Standartlarına uygunluğunu garanti etmektedir. Bunu da sayfaların altına koyduğumuz doğrulama linkleriyle ispat etmekteyiz.

Bu sayfanın W3C Standartlarında kodlanıp kodlanmadığını aşağıdaki linklerden sorgulayabilirsiniz.

XHTML ve CSS Kodlamasını sorgulayın.

3C Bilişim Web Tasarımı ve Yazılım Hizmetleri