Web 2.0 ile birlikte içerikte köklü degisiklikler olmasinin yaninda tasarimda da büyük degisiklikler oldu. Artik daha basit, daha canli, daha kullanisli ve tamamen göze hos gelen tasarimlar görüyoruz. Bu trendi yakalamak için bazi ortak teknikler kullaniliyor. Yuvarlak köseli kutular, kalin yazi tipleri, yansimali grafikler… gibi. Bu teknikleri tamamen kendi becerinizle yapabileceginiz gibi hazir olarak kullanmanizi saglayan web araçlari da mevcut. Iste bu tip web araçlarindan derledigim kaynaklari sizlerle de paylasmak istiyorum.
1. Logolar
Web 2.0 ile birlikte birçok firma logosunu yeniden tasarladi. Logolara daha parlak bir görüntü verilirken, yansima efekti de bolca kullanildi. Ayrica pekçok yeni açilan servis, logosuna bir BETA ibaresi yerlestirmeyi aliskanlik haline getirdi. Eger siz de logonuzda degisiklikler yapmak istiyorsaniz bu kriterleri yerine getirmelisiniz. Elbette logo tasarimi profesyonel kisilerin ellerine birakilmali ama basit isleriniz için Logo Creatr ve Web2.0 Logo Creator araçlari da epey bir ise yarayabilir. Ayrica Photoshop kullanicilari su sayfadan web 2.0 logolari için hazirlanmis stil dosyasini indirebilirler.
2. Butonlar
Web 2.0 ile o eski çirkin gri butonlar terk edilmeye baslandi. Web tarayicilarinin sundugu klasik butonlari kullanmaktansa herkes imaj isleme yazilimlariyla kendi butonunu kendi tasarlamaya basladi. Resim olarak hazirlanan bu butonlarda özellikle cam efekti ve renk geçis (gradient) efekti hakim. Ayrica birçok butonda, anlamli küçük simgeler de kullanildigini görüyoruz. Kolay yoldan kendi web 2.0 butonunuzu hazirlamak içinse daha önce buradaki yazimda da bahsettigim Web 2.0 free buttons maker aracini kullanabilirsiniz. Ek olarak Web 2.0 Layerstyles paketiyle de butonlar hazirlayabilirsiniz.
3. Arkaplanlar
Web 2.0 ile birlikte web sitelerinin önplaninda bu kadar degisiklik yapilmisken arkaplan da unutulmadi tabi
Web 2.0 sitelerinin arkaplaninda çogunlukla iki farkli teknik gözümüze çarpiyor. Bunlardan birincisi yatay seritler iken ikincisi de düz renk geçisleri. Hazir olarak yatay seritleri Stripe Generator veya Stripe Designer ile kolayca hazirlayabiliyorsunuz. Eger ki yatay seritlere göre gözü daha az yoran renk geçisli arkaplanlardan kullanmak isterseniz Free Fading Background Images pakedini indirebilirsiniz.
4. Yuvarlak köseli kutular
Web 2.0 ile birlikte köseleri yuvarlatilmis kutularin kullanimi çok yayginlasti. Köseleri düz, kare veya dikdörtgen biçimde kutular kullanmak artik gerilerde kaldi. CSS‘nin 3.0 sürümüyle gelecek olan border-radius özelligiyle de tamamen tarihe karisacagini düsünüyorum. Simdilik, yuvarlak köseli kutular için farkli tekniklerden faydalanmamiz gerekiyor. Spiffy Corners, RoundedCornr ve CSS Rounded Box Generator araçlari resim, css ve html tekniklerini kullaniyorken Nifty Corners Cube ve curvyCorners araçlari da JavaScript teknigini kullaniyorlar.
5. Renk geçisleri
Bir renkten farkli bir renge veya ayni rengin koyu tonundan daha açik tonuna geçis yapmamizi saglayan efekte gradient ismi veriliyor. Ve bu efekti web 2.0 tasarimlarinda bolca görebiliyoruz. Butonlarda, arkaplanlarda veya menülerde… Tasarimlariniza derinlik hissi katan bu efekti hazir olarak kullanabileceginiz araçlar da mevcut. Özellikle Ultimate Web 2.0 Gradients renk geçisli nesneler olustururken epey bir yardimciniz olacaktir. Bununla birlikte 3. maddede bahsettigim Free Fading Background Images pakediyle de çesitli nesnelere renk geçisleri uygulayabilirsiniz.
6. Rozetler
Ilk maddede yeni açilan pekçok web 2.0 servisinin, logolarina bir BETA ibaresi yerlestirdiklerinden bahsetmistim. Bu beta ibaresini güçlendirmek için tasarimcilar, rozet (badge) seklinde imajlardan faydalaniyorlar. Bu rozetlerin asil kullanim amaci, kullanicinin dikkatini belli bir konu üzerinde yogunlastirmak. Daha iyi bir örnek vermek gerekirse %50 indirime sahip bir ürünün duyurusunu rozet biçimindeki bu imajlari kullarak yapabilir ve dikkatlerin o ürün üzerine çekilmesini kolayca saglayabilirsiniz. Rozet imajlarini kendiniz de hazirlayabileceginiz gibi internette hazir olarak da bulabilirsiniz. Web 2.0 Badges ve Free Vector Badges tavsiye edebilecegim kaynaklar.

Navigasyon sistemi bir web sitesinde oldukça önemli bir yer tutar. Bu yüzden yeterince anlasilir ve karmasadan uzak bir navisyon sistemi tasarlamaniz gerekiyor. Basitligin ve kullanilabilirligin önplanda tutuldugu Web 2.0 sitelerinde oldukça hos menüler/sekmeler görüyoruz. Kendi web sitenizde bu menülerden/sekmelerden kullanmak için CSS Tab Designer isimli ücretsiz yazilimdan faydalanabilirsiniz. Bu yazilim ile yatay veya dikey olarak pratik bir sekilde menüler/sekmeler hazirlayabilmeniz mümkün. Dynamic Drive CSS Library ise bu konuda bir diger güzel kaynak.
8. Simgeler
Web 2.0 sitelerindeki bir diger trend ise simge kullanimidir. Simgeleri kullanarak anlatmak istediginiz veya dikkat çekmek istediginiz bir konuya odaklanilmasini kolaylastirabiliyorsunuz. Dogru yerde dogru simgeyi kullanirsaniz son derece etkili görünümler elde edebilirsiniz. Eger simge hazirlamak istemiyorsaniz veya simge satin almak istemiyorsaniz ücretsiz simge sunan siteleri kullanmaniz gerekiyor. Internette yeterince ücretsiz simge sunan site var ama ben size kalite olanlardan bahsetmek istiyorum. Pixelgirl Presents, Icon Archive, Icon library ve Free Icons Web bunlardan birkaçi… Ayrica Icon Finder ve Iconlet isimli simge arama motorlari da istediginiz bir simgeyi ararken isinizi oldukça kolaylastiracaktir.
9. Renkler
Renk kullanimi elbette yeni birsey degil ama web 2.0 ile birlikte üzerinde daha önemle durulan bir nokta. Artik birbiriyle maksimum düzeyde uyumlu renkler kullaniliyor. Renkler eskine oranla simdi daha sicak, daha canli ve daha ferah. Kendi gözlemlerinde web 2.0 tasarimlarinda agirlikli olarak mavi, yesil, kirmizi, turuncu, pembe ve gri tonlarinin kullandigini görüyorum. Bu tonlari yakalamak için hazir renk paletlerinden faydalanabilirsiniz. Web 2.0 Colour Palette, Web 2.0 Secret Weapon ve Web 2.0 Color Scheme bu amaçla hazirlanmis renk paletlerinden…
10. Yazi tipleri
Web 2.0 ile birlikte özellikle yazi boyutlarindaki artis hemen göze çarpiyor. Eskisine oranda daha büyük ve daha kalin yazilar kullaniliyor. Yine basitlik adina eskisine oranla daha az yazi kullanildigini görüyoruz. Böylece ferah bir görüntü elde etmek için web sayfasinda yer yer bosluklar olusturulmus da oluyor. Yazi tipine gelince ise aslinda bu konuda pek bir sinirlama yok. Yine de düzgün hatlari olan, kolayca anlasilabilir yazi tipleri kullanmaya özen göstermeliyiz. Web 2.0 sitelerinde ne tür yazi tipleri kullanildigini görmek açisindan Great Fonts for Web 2.0 sayfasina bakabilirsiniz. Ücretsiz olarak yazi tipi indirmek içinse Urbanfonts, Dafont ve Better fonts gibi kaynaklari kullanabilirsiniz.