Herkese Merhaba. Bu yazımızda sizlere “CSS Nedir? Ne İşe Yarar? CSS Nasıl Öğrenilir?” Sorularına –kısaca- cevap vermeye çalışacağım. Bu makaleyi okumadan önce sizlere birkaç hatırlatmada bulunayım. Öncelikle CSS bir kodlama dili değildir. Sadece “CSS öğrenerek” hiçbir tasarımı geliştiremezsiniz. CSS tek başına hiçbir şey ifade etmez. Bunun için HTML dediğimiz; “Hiper Metin İşaretleme Dili” dediğimiz (Hypertext Markup Language) web sayfalarını oluşturmak için kullanılan standart metin işaretleme dilini beraberinde öğrenmeniz gerekiyor. Dilin son sürümü HTML5‘tir.
Bir hatırlatma daha yapmam gerekirse CSS’te olduğu gibi HTML’de bir programlama dili değildir. Zira HTML kodlarıyla kendi başına çalışan bir program yazılamaz. Ancak bu dili yorumlayabilen programlar aracılığıyla çalışabilen programlar yazılabilir. Programlama dili denilmemesinin nedeni tam olarak budur. Temel gereği yazı, görüntü, video gibi değişik verileri ve bunları içeren sayfaları birbirine basitçe bağlamak, buna ek olarak söz konusu sayfaların web tarayıcısı yazılımları tarafından düzgün olarak görüntülenmesi için gerekli kuralları belirlemektir. HTML kodunu web tarayıcıları okur, yorumlar ve görsel hale dönüştürürler, dolayısıyla aynı HTML kodunun farklı tarayıcılarda farklı sonuç vermesi olasıdır. CSS ve JavaScript ile beraber kullanıldığında HTML vasıtasıyla görsel ve dinamik web siteleri oluşturulabilir.
HTML, 1980 yılında CERN‘de görevli olan Tim Berners-Lee, CERN araştırmacılarının bilgilerini ve dökümanlarını birbirleriyle paylaşabilmeleri için bir sistem olması fikri ile geliştirilmiştir . 1990 yılında HTML işaretleme dilini geliştirmesinden sonra World Wide Web(WWW) sistemini kurmuştur. Bu şekilde CERN‘de bilgi paylaşımını kolaylaştırma amacı doğrultusunda ortaya çıkan HTML günümüzde hayatımızın vazgeçilmezi olan webin başlıca temelini oluşturmuş ve yapılan çalışmalar neticesinde CSS geliştirilmiştir.
HTML, Küçüktür ve büyüktür işaretleri arasına yazılan komutlar kullanılarak yazılır (ör: <html>). İşaretlenen metnin başını ve sonunu belirtmek için çoğunlukla çift olarak kullanılırlar (Örnek: <h1>Selam</h1>) ancak işaretlemek yerine metnin bir yerine bir işaret konacaksa tek olarak da kullanılabilirler.
CSS yani Cascading Style Sheets HTML’e ek olarak metin ve format biçimlendirme alanında fazladan olanaklar sunan bir internet teknolojisidir. İnternet sayfaları için genel-geçer şablonlar hazırlama olanağı verdiği gibi, bağımsız olarak harflerin stilini, yani renk, yazı tipi, büyüklük gibi özelliklerini değiştirmek için de kullanılabilir. Bu tekniğin en önemli özelliği kullanımındaki esnekliktir.
Bir web sayfası içerisinde birbiriyle uyumlu birkaç renk ve birkaç yazı tip kullanılır ve bunları her sayfada ayrı ayrı tekrar belirtmek yerine CSS yardımıyla bir sefer tanımlayıp bütün Web sayfalarında ortak olarak kullanılabilir. Böylece sayfaların hafızadaki boyutu epey küçüldüğü gibi güncelleme yapmak da kolaylaşır.
Anlayabilmeniz açısından başlangıç olarak şöyle bir örnek vereyim. Bir bina düşünün; binanın iskeleti HTML ise binanın görselliğini sağlayan renk, tasarım CSS’dir. Bir internet sayfasını gezindiğinizde sayfanın tüm renk ve tasarımı CSS ile yapılır. Sayfanın omurgası ise HTML kodları üzerine inşa edilir. CSS kodları, HTML kodlarının içine yazılabildiği gibi harici bir CSS dosyası oluşturularak da işlem yaptırılabilir.
CSS ve HTML Öğrenilmesi oldukça kolay kodlardır. Bunun için orta derece İngilizce bilmeniz yeterlidir. İngilizce bilmiyorsanız bu iki yapıyı öğrenmeniz biraz zor olacaktır. Kitabi bilgilere bakarak öğrenmesi biraz zor olan CSS ve HTML’i ilk olarak görsel içerikleri izleyerek öğrenmenizde fayda var. Bunun için Youtube’de bolca materyal olduğunu söyleyebilirim. Zaten kafanızda ben kod yazmak istiyorum, programcı olmak istiyorum gibi bir düşünce varsa ilk ve zorunlu olarak HTML/CSS mantığını çözüp uygulamada kullanabilmeniz gerekiyor.
Biraz başa sarıp daha anlayabileceğiniz bir düzeyde ifade etmeye çalışacağım.
Web siteleri dinamik ve statik olmak üzere ikiye ayrılmaktadır. Dinamik web siteleri sürekli içerik eklenebilen, içeriğini değiştirilebilen veya sorgu girilebilen sitelerdir. Örneğin bir çok haber sitesi dinamiktir. Bu gibi sitelerden herhangi bir sorgulama yapabilirsiniz. Bu sitelere ait olan haberler değişebilir veya yeni haberler girilebilir. Bu içeriklerin tamamı databasede (veritabanında) saklanır. Bir haberin gösterilmesi veya sorgulanabilmesi Programlama Dilleri ile gerçekleştirilir. Ancak statik bir web sitesinde böyle bir durum söz konusu olmayabilir. Salt CSS/HTML ile bir web sitesi oluşturulabilir. Ancak değişiklik yapılması veya yeni içerik girilmesi istendiğinde HTML/CSS kodları arasında başka bir ifade ile sitenin doğrudan temasına müdahale edilerek yapılabilir.
CSS öğrenmek için ilk olarak yapmanız gereken w3schools adlı platformu ziyaret ederek başlayabilirsiniz. Denemelerinizi ilk olarak NotePad (txt) dediğimiz Metin Belgesi ile yapabilirsiniz. Daha sonra derleyici uygulamalarla öğrenmelerinizi pekiştirebilirsiniz. Herhangi bir web sitesinde iken sağ klikleyerek Sayfa Kaynağını Görüntüle ve İncele diyerek HTML/CSS kodlarının konumu hakkında bilgi sahibi olabilirsiniz.
