CSS tabanlı tasarım ile görsel olarak nelerin yapılabilecegine dair bir örnek. Bu sayfanın içine yüklemek için herhangi bir CSS dosyası seçin.

Örnek html dosyasını ve css dosyasını indirin.

Aydınlanmaya giden yol

Browser'lara özgü tag'ler, uyumsuz DOM'lar, ve eksik CSS desteğinin kalıntılarının yer aldığı, karanlık ve kasvetli bir yolu sil baştan değiştirerek...

Artık eski uygulamalara dair alışkanlıklarımızı bir kenara bırakmalıyız. Web'de aydınlanma, W3C, WaSP ve yaygın browser geliştiricilerinin yorulmaksızın gösterdikleri efor sayesinde elde edildi.

css Zen bahçesi sizi rahatlamaya ve üstadların önemli derslerine kulak vermeye çağırıyor. Etrafınızı daha berrak görerek başlayın. Yeni ve canlanan tasarımda, zamanın onurlandıracağı teknikleri kullanmayı öğrenin. Web ile, onlardan biri olun.

Peki bu ne anlama geliyor?

CSS'nin grafik sanatçıları tarafından ciddiye alınması gerekiyor. Zen Bahçesi, heyecanlandırmayı, ilham vermeyi ve katılımı cesaretlendirmeyi amaçlıyor. Başlamak için listedeki var olan tasarımlardan birini seçin. Herhangi birine tıklamak o stil dosyasını bu sayfaya yükleyecektir. HTML kodu aynı kalıyor, değişen tek şey CSS dosyası. Evet, gerçekten.

CSS bir HTML dökümanı üzerindeki stilin her yönüyle kontrol edilmesini sağlar. Bunu insanları heyecanlandıracak bir şekilde kanıtlamanın tek yolu, dizginleri "yapı"dan güzellik yaratabilecek insanların eline verip, gerçekten neler yapılabileceğini göstermekle olur. Günümüze kadar, zekice "numara"ların ve hack'lerin çoğu, yapı oluşturucuları ve kod yazarlarının elinden çıktı. Tasarımcılar henüz fazla bir şey ortaya koyabilmiş değiller, bu değişmeli.

Katılım

Lütfen sadece grafik tasarımcıları. Düzenlediğiniz şey bu sayfa olduğu için güçlü CSS bilgisi gerekiyor. Buna rağmen örnek dosya CSS ile fazla deneyimli olmayanların anlayabileceği düzeyde açıklamalar içeriyor. Lütfen ileri düzey dersler CSS ile çalışırken kullanabileceğiniz metodlar için CSS Resource Guide sayfasını inceleyin.

Stil dosyasını istediğiniz gibi değiştirebilirsiniz, fakat HTML aynı kalacak. Bu söylenilen, bu yolla daha önce hiç çalışmadıysanız başta biraz yıldırıcı görünebilir, buna rağmen aşağıdaki bağlantıları takip edebilir, ya da örnek dosyaları bir kılavuz olarak kullanabilirsiniz.

Örnek html dosyasını ve css dosyasını indirip yerel olarak üzerlerinde çalışabilirsiniz. Şaheserinizi bitirdikten sonra (lütfen yarım kalmış çalışmalar göndermeyin) css dosyasını kontrolünüz altında bir siteye gönderin. Bize bir link gönderin, eğer gönderdiğiniz çalışmayı kullanmaya karar verirsek resimler de taranacak. Nihai sunuşlar sitemizde bulundurulacaktır.

güncelleme: Çevirmenler arıyorum. Eğer İngilizce ve başka bir dili akıcı olarak biliyorsanız, projeye başka yollarla katılabilirsiniz. Lütfen detaylar için benimle iletişim kurun. Cemre GŸngšr tarafından evrildi.

Kazanımlar

Neden katılım? Tanıtım, ilham ve CSS tabanlı tasarım kullanırken öne çıkarabileceğimiz bir örnek/kaynak için. Günümüz için bile bu gerekiyor. Gittikçe daha fazla site sıçramayı gerçekleştirmesine rağmen hâlâ yeteri kadar katılım sağlanmış değil. Bir gün bu galeri tarihsel merakı giderme amacına hizmet edecektir, fakat o gün, bugün değil.

Gereksinimnler

Olabildiğince fazla CSS1 görmek istiyoruz. CSS2 kullanımı yaygın olarak desteklenen unsurlarla sınırlanmalı. css Zen Bahçesi sadece kullanışlı, pratik CSS kullanımıyla ilgilidir, interneti kullananların %2'sinin görebileceği son teknoloji uygulamaların değil. Tek istediğimiz şey CSS onaylarına sahip olmanız.

Ne yazık ki bu tür tasarım CSS hatalarını da ortaya çıkarabiliyor. Tamamiyle geçerli CSS bile zaman zaman farklı browserlarla farklı görünebilir. Bu bir browser için yapılan yamanın bir diğer browserda hataya neden olması nedeniyle çıldırtıcı olabilir. Kaynaklar sayfasından şu anda kullanılan yamaları inceleyebilirsiniz. Bütün browserlar ile uyumlulukm bir rüya gibi görünebilir, ve sizden her platformda mükemmel görünen bir çalışma beklemiyoruz; yine de elinizden geldiğince deneme yapın. Eğer tasarımınız en azından IE5+/Win ve Mozilla (nüfusun %90'ı tarafından kullanılıyor) altında görünmüyorsa, onu kabul etmeyebiliriz.

Sizden orijinal sanat çalışmaları göndermenizi rica ediyoruz. Lütfen telif hakkı kanunlarına saygı gösterin. Rahatsız edici içeriği asgari düzeyde tutun; leziz çıplaklık kabul edilebilir, pornografi reddedilecektir.

Bu bir gösteri olduğu kadar bir ders olarak algılanabilir. Grafikleriniz üzerinde tam telif hakkı saklı tutabilirsiniz, fakat CSS dosyasını Zen Bahçesi'ninki ile benzer bir "Creative Commons" lisansı ile bırakmanızı rica ediyoruz, bu sayede başkaları çalışmalarınızdan faydalanabilir.

Bant genişliği mediatemple tarafından cömertçe sağlanmaktadır.