Menü

Anket

Sitemizi verilen bilgileri bilgilendirici ve yeterli buluyormusunuz ?
Ilgilenmiyorum (%60.4)
Eh iste (%10.8)
Valla faydalandigim zamanlar oluyor (%8.58)
Benim için gerçekten faydali bilgiler çok sagolun (%20.1)

Toplam Oy: 268

Tüm Anketler

Takvim

« November - 2008

»

PT SL ÇŞ CM CT PZ
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30

İstatistikler

 Toplam Hit: 129666
 Sitede Aktif: 1
 Ip: 38.103.63.60
 Browser: Default - 0.0
 Toplam Kategori: 16
 Toplam Blog: 114
 Toplam Yorum: 274
 Toplam Resim: 5
 Toplam Mesaj: 4

Etiket Bulutu

2008 öss sorulari 2008 öss sorulari ve cevap anahtari 2008 öss yanitlari afis tasarimi antitoksin Arkadaşlık Scripti chrome flash player sorunu cinsel güç çocuk oyun data recovery degisik fontlar degisik yazi stili DELL STUDIO 1535 xp driver dergi yazi stili diyet doğal viagra dxva_sig sorunu ekran görüntüsü yakalama en iyi web tasarım firması engellenmis youtube açmak Euro 2008 feedburner filter plus flash format sonrasi yüklenecek programlar formattan sonra fotograf galeri gençlik iksiri google webmaster tool Heroes 3. Sezon Tüm Bölümler internetin zararlari ip gizleme kanserden korunma kayip pc kereviz key ödeme key ögrenme key sorgulama köy ödemeleri kpss geçmiş yıllara ait sorular kurtlar vadisi 43 Kurtlar Vadisi Pusu Yeni 42. Bölüm izle indir lahana diyeti legal xp Lost Tüm Bölümler mp3 msn virüsü temizleme mülk suresi online grafik online photoshop orjinal xp öss 2008 PhotoShop Portable Prison Break - 4. Sezon Tüm Bölümler prorgamlariniz güncel kalsin proxy renk uyumu resim robot satis sağlık sata hdd sata windows sorunu sata xp kurulum seo site haritasi sitemap slide show sosyal imleme Türkiye Hirvatistan Ücretsiz Lig Tv ücretsiz rapidshare veri kurtarma web 2.0 wordpress wordpress eklenti wordpress plugin wordpress tema xp crack yahoo yasakli sitelere giris youtube alternatif youtube ban youtube çözüm youtube girmek youtube rakip zayıflama

Blog

RSS Takip Tavsiye Et İndir (.doc) Okunma: 364
Hazir Web 2.0 Tasarim Malzemeleri

Sitenize tek tikla iletisim formu kurun (Bedava iletisim formu) Bedava Ajax Galerileri

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.

Stripe Generator

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.

Nifty Corners Cube

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.

Renk geçisleri

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.

Web 2.0 rozeti

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.

Web 2.0 menüleri

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.

Web 2.0 simgeleri

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…

Web 2.0 renkleri

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.

Web 2.0 yazi tipi

Etiketler: web 2.0,  
  # Yorum Yaz #

İsim :

Yorum :
(Max. 400 Karakter)

 
» Benzer 5 Konu
 Konu Başlığı Tarih Okunma
 Flash tabanli dergi hazirlayin ( Flash E-Dergi) 5/13/2008 218

En Çok Okunanlar Son Yorumlananlar Hakkımda
Engellenmis youtube'e girme ( Yasaklanan Youtube Açma) (24378)
TC Kimlik Numarasiyla Key Ögrenme (10688)
Çin mali ucuz cep telefonlari (4902)
Youtube yi açmak (3504)
Autorun virüsü temizleme (3415)
Youtube 'a girme kesin çözüm ( Youtubeyi rahatça açin , girin ) (1662)
Youtube alternatifi video siteleri (1530)
Bedava Stilist Programi ( Bedava Tekstil Tasarim Programi ) (1438)
Top 10 bedava veri kurtarma programlari (1413)
Youtube dahil tüm yasakli sitelere girmek için kesin çözüm (1333)
DELL STUDIO 1535 xp driver download (2)
Öss 2008 sorulari ve cevaplari (4)
Engellenmis youtube'e girme ( Yasaklanan Youtube Açma) (95)
Sata HDD ye windows kurulumu (Windows Sata sorunu) (2)
Mülk suresi Alafasy gerçekten harika kuran okuyor (1)
Autorun virüsü temizleme (5)
TC Kimlik Numarasiyla Key Ögrenme (92)
Hazir Web 2.0 Tasarim Malzemeleri (4)
Bedava Stilist Programi ( Bedava Tekstil Tasarim Programi ) (9)
Çocuklara internetin zararlarini ögreten oyun (2)
Web tasarimi yaptirmak için www.celilcan.com