CSS Nedir - CSS' in Yararları Nelerdir?

0 Üye ve 1 Ziyaretçi konuyu incelemekte.

Çevrimdışı D®agon

  • Ezberletmez Öğretir
  • *******
  • Join Date: Mar 2008
  • Yer: Ankara
  • 11655
  • +524/-0
  • Cinsiyet: Bay
    • Arif Hocam
CSS Nedir - CSS' in Yararları Nelerdir?
« : 19 Ocak 2015, 13:08:51 »
CSS 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.

HTML'e ek olarak metin ve format biçimlendirme alanında fazladan olanaklar sunan bir Web teknolojisidir.

Ö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.

Bir 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ı

Daha iyi ve kolay sayfa kontrolü
Kolay renk yönetimi ve değişimi
Etkin kenar boşluğu denetimleri
Metin biçimlendirme, yazı tipi ve özellikleri belirleme
Geçişler gibi görsel efektler yaratabilme
Görsel konumlandırma kolaylıkları
Tek bir yerden tüm sitenin kontrol edilebilmesi imkanı

CSS 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 linkden sorgulayabilirsiniz.

CSS Kodlamasını sorgulamak için You are not allowed to view links. Register or Login


Örnek bir CSS kodu:

Kod: You are not allowed to view links. Register or Login
<html>
<head>
 
<style>
#WikipediaBox{
             width:350px;
             height:150px;
             border:solid 2px}
 
.WikipediaLogo{
             background:url(http://uyanangenclik.com/resimlerim/logo/uyanan.png)}
</style>
 
</head>
<body>
 
<div id="uyanan">
<div class="uyanangencliklogoLogo"> </div>
</div>
 
</body>
</html>