CSS Nedir? Nerelerde Kullanılır?

Cascading Style Sheets (CSS) Nedir: CERN çalışanları tarafından HTML’e ek olarak metin ve format biçimlendirme alanında çeşitli olanaklar sunan bir doküman biçimlendirme dili ve web teknolojisidir. CSS’in Türkçe’si basamaklı stil şablonları veya basamaklı biçim sayfaları şeklindedir.

CSS üstelik öğrenmesi kolay dillerden birisi olarak nitelendirilmekte ve internet başta olmak üzere pek çok yerde varlığını sürdürmektedir. Biz de bu yazımızda bu biçimlendirme dilinin kullanım alanları, avantajları ve dezavantajları gibi çeşitli alt başlıklar üzerinden CSS nedir, ne işe yarar ve ne zaman CSS kullanmalıyım sorularını da cevaplayacak ve CSS tarihçesi konusundan da bahsedeceğiz.

CSS Nedir? CSS Ne İşe Yarar?

1- CSS Nerelerde Kullanılır?

✅ Tüm cihazlara (mobil, tablet, masaüstü vb.) uygun duyarlı (responsive) tasarımlar hazırlamada
✅ Mobil programlamada tasarım ve efekt yapmada
✅ Sayfadaki tüm bileşenlere stil (renk, yazı tipi, boyut vb.) vermede ve bileşenleri konumlandırmada
✅ Geçiş ve dönüşüm işlemlerinde

✅ Animasyon ve efekt işlemlerinde
✅ Tablolama ve listeleme işlemlerinde
✅ Kullanımı kolay açılır menüler yapmada
✅ Slaytlar ve resim galerilerinde
✅ Ve nice çeşitli alanlarda kullanılır.

2- CSS’in Avantajları Nelerdir?

📌 Hızlı Tasarım İmkanı: CSS kodlarını yazmak için herhangi bir geliştirme ortamı (IDE) kullanmak zorunlu değildir, bilgisayardaki not defterleri ile de yazılabilir. Ayrıca CSS kodlarını çalıştırmak için internet tarayıcılarının haricinde herhangi ek bir yazılım gerekmez.

📌 Web Tasarım İçin İdeal Olması: CSS konumlandırma, renk, metin, medya (görsel, video vb.), sayfa, alan vb. özellikler ve bileşenler için esnek ve ciddi bir biçimlendirme olanağı sunar. CSS bu özelliği sebebiyle internet sitelerinde çok ciddi bir oranda kullanıldığı ve görselliği basit ve sıradan durumundan kurtararak mükemmel bir görselliğe kavuşturduğu için web siteleri için vazgeçilmezler arasındadır. Ayrıca CSS duyarlı tasarım yapmak için de kullanılır.

📌 Performans Optimizasyonları: CSS kodları sunucuda yorumlanmak yerine kullanıcıların internet tarayıcılarında çalıştıkları için hem sunucu yükünü azaltır, hem de kullanıcıya en düşük düzeyde internet trafiği sağlar. Ayrıca HTML’de satır içi olarak kullanılarak daha hızlı bir şekilde çalışması sağlanabilir. Farklı kullanım şekillerinden dolayı zaman kaybının önlenmesi konusunda avantajlıdır. Fakat bu tecrübe ve profesyonellik ister.

📌 Verimli Sayfa Kontrolü: CSS bazı özellikleri birden fazla ögede tekrar tekrar kullanabilme, tasarımsal özelliklerin istenilen kısımların istenildiği gibi yönetebilmesi ve bir çok programlama dili ile iç içe kullanılabilmesi sebebiyle kolay ve verimli bir sayfa kontrolü imkanı sunar. Bu konuyla alakalı bir örnek şu görseldeki gibidir:

📌 CSS’in Diğer Avantajları: CSS İngilizce bilgisi olan bir kişi için diğer dillere göre öğrenilmesi kolay bir dil olmakla beraber; CSS internette kullanılan en yaygın biçimlendirme dili olması, tutarlı olması ve çoklu tarayıcı desteği sebebiyle internet üzerinde CSS ile ilgili pek çok kaynak bulmak mümkündür.

3- CSS’in Dezavantajları Nelerdir?

CSS; her ne kadar çeşitli alanlarda kaliteli uygulamalar yazmak için bir çok avantajı bize sunsa da elbette kimi eksiklikleri ve gücünün yetmediği yani dezavantajlı olduğu alanlar da vardır. CSS’in dezavantajları ise şunlardır:

.#. Çeşitli Kullanım Biçimleri: CSS’den en yüksek performans ve en yüksek verimi elde edebilmek için dahili CSS, harici CSS ve satır içi (inline) CSS kullanımının dikkatli ve profesyonel bir şekilde yapılması gerekmektedir. Bu da belli bir tecrübe birikimi gerektirir.

.#. Uyumsuzluk: Bir tarayıcıda çalışan CSS kodları başka bir internet tarayıcısında sorunsuz bir şekilde çalışmayabilir. Bu sebeple ilgili tasarımı yayınlamadan önce farklı internet tarayıcıları (özellikle en çok kullanılan tarayıcılar) üzerinden tasarımın test edilmesi gerekir.

.#. Güvenlik Eksikliği: CSS açık metin tabanlı bir sistem olduğu için geçersiz kılınmasını (override) önleyecek yeterli yerleşik bir güvenliğe sahip değildir. Okuma / yazma izni olan herkes kendi bilgisayarında CSS dosyalarını değiştirerek tasarımı bozabilir.

.#. Farklı Seviyeler: CSS1, CSS2 ve CSS3 gibi farklı CSS sürümleri bulunmaktadır. Bu sebeple projelerde olası sorunların, uyumsuzlukların ve bugların önüne geçmek amacıyla bunlardan bir tanesi tercih edilip, sadece o CSS sürümü kullanılmalıdır.
(Ayrıca Bakınız: Bug Nedir? Debugging Nasıl Yapılır? [Rehber])

.#. CSS’in Diğer Dezavantajları: CSS doğru ve profesyonel bir şekilde kullanılmazsa yavaşlıklar, uyumsuzluklar, tuhaflıklar ve komplikasyonlar oluşabilir. Bu sebeple her yeni özelliğin varsayılan diğer özellikleri de etkileyebileceği hesaba katılarak ince eleyip sık dokumak suretiyle çalışma yapılması gerekir.

4- CSS’in Özellikleri

• Seçiciler kullanılarak istenilen bileşenler istenildiği gibi renk, boyut, yazı tipi, kenarlık, hizalama, dolgu, arka plan, animasyon, düzen gibi konularda biçimlendirilebilir. Bu sebeple CSS doküman işaretleme ve biçimlendirme dilidir.

• Tek bir defa tanımlanarak farklı farklı sayfalarda kullanılarak çok ciddi bir hafıza tasarrufu sağlanabilir ve sunucu verimliliği arttırılabilir.
• CSS kodları tıpkı şu görseldeki gibi seçici ve tanımlama bölümlerinden, tanımlama bölümü ise bir özellik ve bir değerden meydana gelmektedir:

• CSS dahili yani aynı kaynaktan, harici yani dış kaynak(lar)dan ve / veya satır içi olarak kullanılabilir. Burada öncelik satır içi CSS kodlarına ait olmakla beraber, “!important” etiketi sayesinde CSS kodlarını istediğimiz gibi kolaylıkla geçersiz kılabiliriz. (Override)
(Ayrıca Bakınız: Override Nedir? Ne İşe Yarar? [Yakında…])

• CSS öğrenmesi, kullanması ve uygulaması kolay olan diller arasındadır.
• CSS kodları HTML sayesinde Javascript kodları ile beraber kullanılarak projelerin özellikleri ve fonksiyonelliği arttırılabilir.

5- CSS’in Tarihçesi Nasıldır?

HTML işaretleme dili büyüdükçe ve geliştikçe kullanıcıların taleplerini karşılaması daha zor, daha karışık bir hal almaya başladı. Bu durumdan dolayı internet sitelerinin tutarlı bir görünüme sahip olması da zorlaştı. İşte bu sebepten ötürü Cascading Style Sheets (CSS); MIT ve CERN bünyesinde kurulmuş olan Dünya Web Konsorsiyumu (World Wide Web Consorsium – W3C) tarafından geliştirilmiştir.

CSS 10 Ekim 1994 tarihinde, Avrupa Nükleer Araştırma Merkezi olan CERN’de Tim Berners – Lee ve Håkon Wium Lie tarafından önerilmiştir. Çeşitli platformlarda yapılan incelemelerin sonucunda 1996 yılında ilk kez CSS 1.0 kullanılmaya başlanmıştır. Elbette kullanım kolaylığı, esneklik, performans, güç ve yetenekler konusunda doğan yeni talepler doğrultusunda 12 Mayıs 1998’de 2.0 sürümü ve 19 Haziran 2012’de de 3.0 sürümü sunulmuştur.

➽ Eğer programlama öğrenmek istiyor ama nereden başlayacağınızı ve nasıl öğreneceğinizi bilmiyorsanız “Programlama ve Yazılım Öğrenmek [Rehber]” konulu yazımıza göz atabilirsiniz.