• malesef gene turk tasarimci ve gelistiricileri tarafindan golge atma, kose yuvarlatma, transition ile... oh oh ne guzel diye algilanmistir... zaten yillardir turkiye'de sikim gibi is yapilmasinin sebebi uretilen teknolojiyi derinlemesine anlamaya calismak yerine janjanli iki ornege bakarak, musteriye yapilan butun islerde, golgenin, yuvarlak koselerin dibine vurmaktan ibaret oluyor...

    flash ilk ciktigi zaman yapilan o flash intro sayfalarini hatirlatmak isterim... ne boka yaradigini kimsenin bilmedigi, yaraticiliktan yoksun sacma sapan animasyonlari sirf yapilabiliyor diye gazlayan insanlar gorduk.... malesef css3 konusunda da ayni durum sozkonusu... ozellikle adobe edge ile cikacak isleri dusunemiyorum...

    neyse gecelim...

    css3, yukarida belirtilen janjanlarin yaninda:

    - rgba, hsl, hsla gibi alpha destekleyen renk tanimlamalarinin yapilmasi
    - text-overflow (yazinin, icinde bulundugu kutunun sinirlarini asmasi durumunda ne olacagi) ozellikleri
    - generated content - css araciligiyla html elementlerine icerik ekleyebilme ozellikleri ki bu ozellik akilli kullanildiginda bir cok imaj gerektiren uygulamayi ortadan kaldirabilecek super bir ozellik (mesela tablo kolonlarini sort ederken yanda beliren asagi/yukari ok ikonu icin kullanilabilir)
    - box-sizing, yillardir bir kutunun boyunu bulmak icin her seferinde padding ve border uzunluklarini cikarip isyan ettikten sonra 'ulan bu gune kadar akliniz nerdeydi' diyerek karsiladigim guzel bir ozellik. artik kutunun boyu neyse o, yok border, yok margin vardi bilmemneydi yok...
    -multi-column layout, bence en bomba ozelliklerden biri ama daha en az iki uc yili var... dergi, magazin mizanpaji yapan arkadaslarin yakindan bildigi sayfayi kolonlara bolerek yaziyi otomatik olarak flow etme olayi sonunda geliyor... diyelim ki bir kutu yaptiniz, icine 4 sutun bir yazi atmak istiyorsunuz... normal sartlar altinda icine 4 adet div atip, float left ceker, clearfix atar, margin padding leri ayarlar sonra bir daha mna kodumun widthlerini hesaplarsiniz ya... ha iste onlarin hepsini bu ozellik ile yapabiliyoruz... kutunun kac sutuna ayrilmasini ve sutun aralarinin boyunu css de belirttigimiz anda kutu icindeki icerik kendini otomatik olarak sutunlara ayiriyor... ya daha guzel bir sey olabilir mi bilemiyorum!

    aslinda biliyorum...

    media queries - gerci bu arkadas css2 den beri ortamda ama hakkettigi sevgiyi gormedi.. sagolsun tablet, mobil vs cihazlar costu da artik web sitelerinin arayuzleri farkli olceklerde de dogru gorunme ihtiyacini dogurdu...eskiden 1024 x 768'e calisacak ya da fluid olacak layout kasardik konu kapanirdi simdi bunun super genis ekranindan tut 460px buyuklukteki akilli telefonuna kadar elli cesit cozunurluk ve varyasyon var... pitir aliminyum ltd. sti'nin websitesinin kendini bunlara uyacam diye kasmasina pek gerek olmayabilir ancak ulusal ya da uluslararasi duzeyde hizmet veren isletmelerin sundugu servisler artik farkli cihaz cozunurluklerinde calismak zo-run-da.

    iste media queries burada devereye giriyor... uretilen html ve css calisacak farkli cozunurluklere gore gerekli arayuz degisikliklerini kullanicinin kullandigi cihaza gore otomatik olarak yapiyoruz... geriye mutlu mutlu iphone'larinda oraya buraya tiklamaya calisan kullanicilar birakiyoruz....

    baska bir guzellik ise attribute selector'ler... yayginlastigi zaman javascript yardimiyla yaptigimiz ilk cocuk, son kardes, butun cocuklar gibi secimleri ve cok daha fazlasini css yardimiyla yapabilecegiz... sayfalar rahatlayacak, siteler daha hizli calisacak...

    gerci dusunecek olursaniz, content/presentation/behaviour ayrimi icerisinde eskiden content/presentation (html vs css) birbirine karisirken (inline style'lar, <font> tagleri, bgcolor attribute'leri falan)... simdilerde presentation/behaviour ile karisti (css vs js) bir elemanin boyunu, rengini, pozisyonunu degistirmek aslinda presentation ile ilgili bir sorun... ama browser desteklemiyor diye javascript kullanarak yapmak zorunda kaliyoruz, ya da yukarida bahsettigim pseudo selector olayi da ha keza...

    iste css3 browser'lardan tam destek almaya baslayinca bu c/p/b arasindaki ayrim bir adim daha belirginlesecek...herkes sorumlu oldugu konuyla ilgilenip birbirinin isine karismayacak... o zaman front-end programming daha zevkli ve mantikli bir hale gelecek ama ben goremem onu biliyorum...

    2021 edit: evet goremedim, ux'e gectigimden beri front-end teknolojilerini takipten ciktim. ama ta 2012 de o son paragrafta ne yazdiysam hepsi oldu. benim isim bu.
  • her şeyi image yapmaktan, basit animasyonları flashtan kurtarmış dehşet'ül vahşet. internet explorer'ın ta amına koyum o ayrı mesele.
  • fontların telif hakları konusunda sıkıntı yaşatacak teknoloji.
  • benim gibi bu işe girişen ancak mühendislik zekasından yoksun olanlar için güzel bir youtube kanalı var: (bkz: css tutorial for beginners) konular küçük parçalara bölünüp kısa sürelerle verildiği için izlemesi oldukça verimli. *

    https://www.youtube.com/…ulvf8jiglcu3shigvqjtw_ac9c
  • şu an geliştirilme aşamasında bulunan yeni css speci.
    http://www.w3.org/style/css/current-work
    http://www.w3.org/tr/css3-roadmap
  • bir çok yeni opsiyonunun yanında background layering özelliği ile css tabanlı web sitelerinde (bkz: eksisozluk) görünüm üzerindeki kontrolün daha fazla ele alınabilmesini sağlayacak teknoloji. ayrıca bu opsiyonlar ile yepyeni sozluk theme'leri tasarlayabilmek(m) de mümkün olacaktır. *

    backgound-image: w1,…wm
    backgound-repeat: x1,…xr
    backgound-size: y1,…ys
    backgound-position: s1,…sp
  • son browser uyumluluk tabloları için : http://geocities.com/…eanmhall2003/css3/compat.html

    (ulan ie)
  • multiple backgrounds diye bir özellik edinmiş. çok işe yarayacağını sanıyorum.

    http://www.css3.info/preview/multiple-backgrounds/
  • chrome altında hemen hemen tüm özellikleri çalışmakta. tümüyle çok seksi gözüküyor.
  • html5 ile beraber kullandığım çok çılgın arayüz düzenleme ortamı/

    transition, transform, shadow, radius, background oynatmaları, gradient gibi olaylarla şu anki site dizayn dengesinde büyük farklılıklar yaratacağına inanıyorum/

    css için yeni olan zaman kavramı, etki tipi, etki alanı gibi öğelerle flash a hep tek tık uzaklıkta olan ve o uzaklığı seven insanlar için de yeni bir dönem başlıyor/

    adobe un da css3 animation editor gibi bir şey çıkartacağı zaten io da gösterilmişti. hatta converter bile yapıldığına dair garip duyumlar aldım/

    yapılan işlemlerin basit ama ilerledikçe büyük kafa yormalara neden olması stil işine bir oyun havası katıyor gibi. empire at war da aldığım zevki şu sıra denenmemiş tipleri zorlarken alıyorum ve gerçekten google io da gösterilenden fazlası mevcut/

    şu an için gördüğüm kadarıyla html5 ile beraber tamamen destekleyen bir tek google chrome var. firefox bile firefogg a rağmen tamamen patlatmıyor durmuyor. birçok yerde kafa karışıklığına sebebiyet vermesi doğal. çünkü -webkit , ya da -moz diye kullanılan öğeler her zaman işe yaramayabiliyor. bir kaç öğeyi de başına hiç bir şey yazmadan bile çalıştırdım ama tabii ki chrome da/

    bu senenin sonuna kadar internet explorer (: dışında opera, safari ve firefox dan full destek bekleniyor/

    fontlar için web font kullanmanızı özellikle google fontlarından kullanmanızı tavsiye ederim, ama font-size a dikkat edin beklenmedik boyutlarla karşınıza çıkabiliyor/

    tüm bu konuya bağımlı kendi örneğimi verebilirim : passive tries http://passivetries.com/ tabii ki sadece chrome asıl tasarımını, stillerini ve öğelerini gösteriyor/
hesabın var mı? giriş yap