Evrimnette Haftanın Konusu olarak Neden Css Tasarım konusunu seçiyoruz...

Web ve teknolojileri gündelik yaşamımıza gireli pek de fazla olmamasına rağmen, bu alandaki gelişmeler göz kamaştırıyor. Hergün yeni bir mucize duyar olduk. Alın birisi işte, Google! RSS değil mi bir diğeri? Flash her yerde karşımıza çıkmıyor mu?

Web teknolojilerinde gün geçtikçe vites arttıran bir gelişme süredursun, bizim yani web tasarımcıları için başımıza gelmiş en güzel mucizelerden biridir CSS…

Cascading Style Sheets’den, yani stil sayfalarından kısaca CSS diye bahsedeceğiz… CSS sayfalarının oluşturulması ve uygulanmasına bu yazıda hiç bulaşmadan, CSS’in bize sağladığı artı-değerden bahsetmek istiyorum. Böylece neden CSS öğrenmeliyiz? sorusunu da açıklığa kavuşturmuş olacağız…

CSS öğrenmeliyiz çünkü;

Yapı (Structure) ve Tasarımın (Design) Sevindirici Ayrılığı

Bir web sayfasınında içeriğini, yani yapıyı oluşturan şey yalın XHTML kodudur. Tasarımdan kasıt ise bu içeriğin görsel davranışıdır. Yani bir menünün web sayfasında nerede duracağı, bir spot haberin yazısının rengi, karakteri, sayfanın arkaplan rengi gibi görsel davranışların bir toplamıdır tasarım. Bunların birbirinden ayrılması mümkün olduğunda, bu bizim için içerik ve görselliğin farklı yerlerden yönetilmesi anlamına gelmekteydi.

Bu anlattığımız somutlamak istersek; takip ettiğim blog yazarlarında biri olan Fatih Turan‘ın web sitesine, Firefox web tarayıcınızla girdiğinizde güzel bir anasayfa sizi karşılar. Eğer tarayıcınızda CSS’i kapatırsanız, alacağınız görüntü şu şekilde olacaktır…

Bu sade görüntü XHTML’in CSS’siz yorumlanmasıdır… CSS ile tasarım, XHTML’den (Yapı’dan) başarılı bir şekilde ayrılmıştır…

Temiz ve Anlaşılır XHTML

Bir web sayfasında görsel unsurların ayrılması, doğalında XHTML tarafında kodsal temizliği sağlamış olur. Bu da herkes için anlaşılabilirliği arttıracaktır. Anlaşılabilir kod, müdahale edilebilir koddur.

Yönetilebilir CSS

Görünüme dair unsurları bir, ya da birkaç CSS dosyasında topladığımızda görünümü XHTML sayfalarından çıkarmış, merkezi bir yerden yönetebilir duruma gelmiş oluruz. Yapı ve tasarımın iç içe girdiği karmaşık sayfaları tek tek düzenlemek yerine, hızlıca tek merkezden CSS dosyamızı modifiye ederiz. Bu dosyaya bağlı olan web sayfaları otomatik olarak etkilenirler. Böylece bakım ve müdahaleler oldukça kolaylaşır. Zamandan ve iş yükünden tasarruf etmiş oluruz.

Doyasıya Özgürlük

CSS’in yaygınlaşması öncesinde revaçta olan tablo kullanılarak yapılan tasarımların yarattığı hantallıktan, CSS ve onun zengin özelllikleri sayesinde kurtulmuş olururuz. Web sayfasını oluşturan blokların nerede duracaklarını tabloların hücreleri değil, CSS dosyalarında tanımladığımız kurallar belirler. İstetiğimiz zaman sitemizin sağ tarafında duran bir menuyu, sitemizin soluna taşıyabilir, blokları birbirine göre konumlayabiliriz. Bu anlattıklarıma en güzel örneği www.csszengarden.com sitesinde göreceksiniz. Bu sitede sergilenen bütün örnek siteler aynı XHTML koda sahipken hepsinin görselliği, menülerin yeri, linklerin şekli özgündür. Bu siteler tasarım ve yapının birbirinden ayrılmasına en güzel örneklerdir.

Platformlara Özel Tasarım

CSS kullanarak web tabanlı uygulamalarımızın bir yazıcıdan çıkış alınırken nasıl görüneceğini, bir monitörden bakıldığında nasıl davrancağını, ya da bir mobil cihazda nasıl görüneceğini, XHTML dosyalarımıza dokunmadan ayrı ayrı CSS üzerinden tanımlayabiliriz…

Daha ne olsun, bugün için mükemmel