css

Css kullanarak eÄŸer tek kelimelik ya da tek satırlık bir yazınız varsa bunu dikey olarak ortalamak çok zor olmayabilir ancak metniniz birden fazla satıra sahipse, her browser'da sorunsuz çalışan, dikey olarak hizalanmış bir görünüm elde etmek zordur.

Yandaki resimde görülen konuÅŸma balonu örneÄŸini ele alalım. AÅŸağıdaki gibi bir html kodumuzun olduÄŸunu varsayalım :

Åžimdi ise css'in table gösterimi ile dikey ortalamamızı yapıyoruz:

Css 'de son zamanlarda sıkça kullanılmaya baÅŸlanan bir yöntem olan sprite tekniÄŸi ile nasıl ovalleÅŸtirilmiÅŸ köÅŸelere sahip kutular oluÅŸturabileceÄŸiniz ÅŸurada anlatılmış. Peki bu teknik diÄŸer rounded corner tekniklerinden baÅŸka bize ne katacak derseniz , eÄŸer sitenizde çok sayıda oval köÅŸeli kutular kullanıyorsanız , biraz hız biraz da bandwith karı diyebiliriz. Ä°ncelemekde fayda var.

Öncelikle eÄŸer bu konuya ilginiz var ise , daha önce web'in bilinen isimleri ile yaptığım web tasarımı ve kodlaması üzerine olan ÅŸuradaki araÅŸtırma yazısını okumalısınız.

O yazıdan çeÅŸitli püf noktalarını kaptıktan sonra kendinize bir yol haritası belirlemeli ve ona göre çalışmaya baÅŸlamalısınız.Ä°lk adım olarak Css ve Xhtml kodlamayı öÄŸrenmelisiniz.Css için yeterince kapsamlı olan , Fatih HayrioÄŸlu'nun yazdığı ÅŸuradaki e-kitap 'ı indirebilir ve yine aynı yerden kitapta anlatılan çalışmaların kaynak kodlarına ulaÅŸabilirsiniz.

Xhtml ve Css ile ilgili basılı bir kitap isterseniz de şuradaki kitap işinize yarayabilir.

Uzun zamandır aklımdaydı ve merak ediyordum , acaba blog yazarları tasarımlarını nasıl yapıyorlar ? , xhtml-css çevrimini kendileri mi yapıyorlar ? Bu iÅŸleri yaparken izledikleri yollar neler? vs. Sonunda ufak bir araÅŸtırma yaptım ve bazı arkadaÅŸların görüÅŸlerini aldım.3 soru sordum kendilerine.Sorular ÅŸunlardı :

1- Web tasarımı yaparken hangi programları kullanıyorsunuz ?
2- Yaptığınız tasarımı xhtml/css kodlamasına siz mi dönüÅŸtürüyorsunuz? EÄŸer dönüÅŸtürüyorsanız izlediÄŸiniz yollar nelerdir?
3- Tasarım yaparken özellikle dikkat ettiÄŸiniz noktalar var mı? Varsa bunlar nelerdir?

Bakalım hepimizin blog dünyasından az çok tanıdığı kiÅŸiler tasarım aÅŸamasını nasıl hallediyorlar ?

Dmry'den Hakan'ın cevapları :

Drupal ile ilgilenmeye baÅŸlayan kiÅŸilerin ilk etapta en çok zorlandığı konu temalardır.Sıfırdan tema yapmayı boÅŸverin , bir temayı modifiye edebilmek dahi bu aÅŸamada drupal'a aÅŸina olmayanlar için çok çok zor gelecektir.Halbuki drupal'ın tema yapısı , rakiplerine nazaran çok daha esnek , basit ve pratiktir.Temaları düzenleyebilmek ve kendinize ait özel temalar ortaya çıkarabilmek için xhtml/css bilmeli ve drupal terminolojisine hakim olmanız gerekmektedir.

Şimdi temel olarak bir drupal temasında olması gereken dosyaları inceleyelim:

Page.tpl.php : Temanızın ana ÅŸablonunun belirlendiÄŸi dosya'dır.Genel olarak tüm konum deÄŸiÅŸikliklerini buradan yaparsınız.Tema'nın ana dosyası diyebiliriz.

+ WebDesignerWall , dekoratif css resim galerileri oluşturmayı anlatmaış : [bağlantı]

+ 25'den fazla , inanılmaz photoshop dersleri , ilgilenenler için seçilmiÅŸ :  [baÄŸlantı]

+ Siz başlık ve yazınızı girin o size rastgele bir afiş oluştursun : [bağlantı]

Bu yazı tamamen kiÅŸisel :) Bazen , "yahu geçenlerde bir yerde görmüÅŸtüm ama neydi acaba?" diyerek yana yana aradığım web tasarım / programlama araçlarını,kütüphanelerini frameworkleri,hazır uygulamaları , kısaca ne kullanıyorsam onları bu yazıda birleÅŸtirmeye karar verdim.Her aradığımda elimin altında olmasını istediÄŸim  ÅŸeylerin yanında , adresini ezbere bildiklerimi de yazayım ki baÅŸkaları da  faydalansın :)

Programlar:

Wamp(win) / Geany / gPhpEdit /  Dreamweaver(win) / PhotoShop(win) / Quanta Plus / FileZilla

Kütüphaneler:

 Jquery / Mootools / LightBox / FaceBox / Multibox