bildirgec.org - ndb - beğendikleri

İyi Yazılımcı Olmak İçin 5 Alışkanlık

ndb — Tue, 27 Jul 2010 09:31:00 GMT

İyi Yazılımcı Olmak İçin 5 Alışkanlık

Hepimiz yaptığımız şeylerde kendimizi geliştirmek isteriz ve web geliştirme alanında zaman ayırdığımız ana konulardan biri kodlarımızdır. Bu HTML, CSS, JavaScript, PHP, Python, ActionScript veya web sitelerini yapmak için kullandığınız herhangi bir dil olabilir.
Bu yazıda, yeteneklerimizi geliştirecek ve kodlarımızın daha iyi olmasını sağlayacak bazı pratik adımları paylaşacağım.

1. Bir Anda Sadece Bir Dile Odaklanın

Eğer web tasarım ve geliştirme yapıyorsanız, çoğu zaman birbiriyle ilişki kurmanız gereken bir hayli dil vardır ve bilhassa hepsinin birbirleriyle nasıl bağlandığı göz önüne alınırsa hepsini birden öğrenmek cazip gelebilir.

Zannediyorum ki bir dereceye kadar, bu kaçınılmaz bir durum. Ama eğer gerçekten çabuk gelişmek istiyorsanız yanlızca bir uzmanlık alanına odaklanmanızı tavsiye ederim. CSS kullanımınızın daha iyi olmasını mı istiyorsunuz? Odağınızı ona verin. Başka bir şey kullanmadan, sadece CSS ile tek HTML sayfası ile çeşitli arayüzler yapmayı deneyin. Mesela CSS Zen Garden bu konuda sizin için muhteşem bir örnek. Örneğin, eğer siz CSS2 ile rahatsanız, fakat CSS3 ile neler yapılabileceğini anlama konusunda kendinizi geliştirmek istiyorsanız, CSS3’ün özelliklerine çalışabilirsiniz ve bunlar üzerinde teker teker iş yapmaya başlayabilirsiniz. Güncel CSS3 tanımlamalarını, anlatımlarını okuyabilirsiniz. Hangi tarayıcılarda nelerin çalışıp çalışmadığını deneyip görebilirsiniz.

JavaScript ve PHP gibi benzer yazım özellikleri gösteren dilleri kullanmaya çalışabilir, biraz sıkıcı olsa da fonksiyonlarını sırayla çalıştırmayı deneyebilirsiniz. Diğer bir seçenek bu dillerle yazılmış özgün örneklerle çalışmak olabilir.

Daha iyi bir WordPress geliştiricisi mi olmaya ihtiyacınız var? Bu konuda bir ton örnek var. Server taraflı resim işleme konusunda daha çok şey öğrenmek ister misiniz? Bu konuda da bir sürü örnek var. Arayın-bulun, bir tarafa yazın ve onlar üzerinde çalışın. Bir tanesini seçin ve ona hakim olana kadar uğraşın, sonra diğerine geçin.

2. Mantığınızı Yorum Satırlarında Dile Getirin
Kodlama söz konusu olunca aklımda bir sürü fikir var. Bir tanesi şu ki kodun yüzde 95'i mantıktır. Diğer bir düşüncem ise: mantık, insan dilinden programlama diline çevrildiği zaman, değişmez.
Düşüncelerinizi kodlarla yazabiliyorsanız, bunu Türkçe ve İngilizce gibi bir konuşma dilinde de yazabilirsiniz.

Örneğin, farzedin ki ben bir fonksiyon yazmak istiyorum. Bu fonksiyon zamana bağlı olarak bazı şeyleri kilitleyecek ya da açacak. Direk kodun içine dalmak yerine düşüncelerimi yorum olarak yazabilirim.

Örnek
// FONKSİYON: Zamanı Gelince Kilitle
// Bu fonksiyion iki zaman değeri kabul edecek,*
// sırası gelince açık duruma geri dönmesi gerek.* * //Yeni bir veri nesnesi oluştur**
// Bu nesneyi kullanarak o anki zamanı al* *
// IF: o anki zaman, belirlenen aralıktaysa** // Return false – şu an açık durumdayız**
// ELSE**
// Return true – şu an kilitli durumdayız.**
// ENDIF **// FONSIYON SONU

Burada, bizim fonksiyonlarımız için düşündüklerimizin hepsi var. Bunlar neredeyse bir bina inşaatının taslağı ile aynı özellikleri taşıyor. Yorumların izin verdiği nispette, asıl kodlarımı yazmaya buradan başlayabilirim.

Belli ki, bu çok basit bir örnek, ama ben bir fonksiyon kurmaya ihtiyacım olduğu zaman, özellikle de daha karmaşık bir fonksiyonsa, bu tekniği bir prensip olarak uyguluyorum. Bu sayade, asıl kodu yazmadan önce bütün mantığı düşünebiliyor ve sorunları gidermeye çalışıyorum. Çok az hata yapma açısından bu alışkanlığı olağanüstü değerli buluyorum. Hem de kodlarım bu sayede dökümante edilmiş oluyor.

3. Şablonlara, Eklentilere ve Açık Kaynak Kodlara Çalışın

Web inanılmaz derecede ulaşılabilir ve açık bir yer, özellikle de yazılımcı toplulukları için. Web’in bu yapısı daha iyi bir yazılımcı olmak isteyenler işin çok değerli bir kaynak olabilir. Örneğin, HTML’e yeni başlıyorsanız internet üzerindeki sayısız beleş şablonlardan birini indirebilir ya da favori sitenizin kodlarına çalışabilirsiniz. Çünkü bu şablonlar tipik olarak sadece HTML’dir (ve CSS, ve belki de JavaScript). Bunlar küçük çaplı çalışmalarınız için uygundur, kodları karıştırmanız için iyi bir fırsattır. Daha iyi anlamak için sayfanın yapısıyla ve tag’ler ile oyalanın. Sayfadaki nennelerin yerlerini değiştirmeye çalışın. Biçim özelliklerini değiştirdiğiniz zaman neler olduğunu görün.

Elbette, büyük ölçüde tavsiyem şu ki: edindiğiniz bu deneyimleri standartlar hakkında okuduğunuz kaynaklarla birleştirin. Bunların yanında, kötü kodlama alışkanlıklarını kendiniz bulmak istemezsiniz herhalde. Bu teknik muhtemelen HTML veya CSS’den daha karmaşık olan JavaScript veya PHP gibi programlama dilleri için daha kullanışlıdır.

Meselâ, WordPress gibi bir içerik yönetim sistemi inşa edilirken neredeyse PHP’nin bütün niğmetlerinden yararlanılmıştır. Bir de bu paylaşım platformu çekirdeğinin genişletilebilmesi için geniş ve güçlü bir mimariye sahiptir ve sizin yeni eklentiler indirip kurmanıza izin verir.
Bunların yararı şu ki, WordPress ve eklentileri tümüyle açık kaynaklıdır bu da kodların hepsine erişebileceğiniz anlamına gelir. Öyleyse, kodları karıştırarak, eklentileri inceleyerek bu hizmetten faydalanmaya ve kendinizi geliştirmeye çalışın. Ayrıca, bu, kodları denemek için iyi bir fırsattır.
Bu alışkanlık için son tavsiyem: diğer insanların kullandığı teknikleri koşulsuz olarak olduğu gibi kabul etmeyin, ne yaptığınızdan emin olun, neler olup bittiğini anlamaya çalışın ve sadece başkasının kodunu taklit etmeyin. Her zaman, “niçin bu böyle?” diye sorun.

4. Kitap Okumayı İhmal Etmeyin

Web üzerindeki çeşitli bloglarla tonlarca malumat olduğu halde, sadece bir konu hakkında tam anlamıyla bir kitap yok. Bloglar spesifik konulardaki makale ve örnekler için mükemmel kaynaklardır ve hızlı taktiklerle harikalar yarattırabilirler, ama benim görüşüm, büyük bir konuyu sağlam bir şekilde anlamaya yardım edecek iyi bir kitap yok.
Tablo - tabanlı tasarım beni baya yormuştu. Ama en sonunda karar verdim ki ‘div’ler bu konuda en iyi yöntem.
Ancak bu noktaya yükselmek için, ben sadece daha iyi nasıl yazılacağını kendi kendime öğrenmeyi başarmaya çalıştım. Fakat CSS’in bazı önemli noktalarını tam olarak anlayamadım. Aslında, ben gerçekten ne sözde sınıfları (hover gibi) ne de kalıtımın tüm kavramlarını anlamadım, çünkü bana önemsiz geliyordu.
Muhtemelen CSS’in kapsamlı resmini tümüyle görebilmek için, bu dili yavaşça ve tonlarca blog’dan aldığım ufak parçaları birleştirerek öğrendim. Bu şekilde öğrenmek çok zamanımı aldı ve başıma bir sürü iş çıkardı ve böyle olunca da daha uygun bir çözüm aramaya başladım.
Bu yüzden dışarı çıktım ve Charles Wyke-Smith’in Stylin’ With CSS adlı kitabını satın aldım. Bu benim için vahiy gibi bişeydi. Sadece birkaç kısa bölümde CSS’in temellerini öğrendim. Daha varlığını bile bilmediğim şeyler uygun adımlarla ve düzenli bir şekilde bana öğretildi. Her bölüm sanki bir binayı inşa ediyormuş gibi tuğlaları birbiri üstüne koyuyordu. Gün geçtikçe okuduğumun değeri artıyordu. Bu bilgileri makalelerden ve bloglardan çekip çıkarmam haftalarımı, belki de aylarımı alırdı.

Style in CSS

Şüpesiz, bu kitaptan sonra da birçok şey öğrendim ama bu kitap benim CSS ilmimin temeli olmuştu ve onu hala bir başvuru kaynağı olarak kitaplığımda saklıyorum. Eğer yeni bir teknolojiyi inceleyip anlamak istiyorsanız, iyi bir kitap bulun, bu en iyi yöntemdir.

5. Tecrübe

Kazanmanızı önereceğim son alışkanlık ise sadece eğlence. Oturun, deneyin ve görün sizden neler çıkabiliyormuş, neler yapabiliyormuşsunuz.
Bu günlerde CSS3 oldukça popüler. Bir sürü yazılımcı CC3'ün kabiliyetlerini keşfetmek için bu teknolojiyi ve tekniklerini zorluyor.
Denemek için burada sadece birkaç örnek vereceğiz.
CSS3 Transforms & @font-face Örneği

CSS3 transform

Bu çok güzel bir örnek. CSS’in @font-face özelliğini kullanarak, birkaç gölge ve ilginç dödürme ile tipografik bir poster yapıyor. Bütün tarayıcılar desteklediği zaman birçok yeni harika web tasarımları görmeye başlayacağız.
CSS Posterler

CSS Posterler

Bu makalede Jad Limcaco birkaç poster tasarlamaya çalışmış ve CSS ten başka birşey kullanmamış.
Sadece CSS ile Grafik Tasarımı

CSS Graph

CSS kullanarak grafik oluşturmaya dair tonlarca örnek var. Bu teknik, verilerileri göstermek için farklı bir yaklaşım kullanır. Diyebilirsiniz ki “bu sadece CSS olamaz”, ama hakkaten sadece CSS ile yapılmış müthiş bir örnek.
CSS3 Leopard-style Stacks

CSS Mac

Bu makalede, kardeşimiz CSS’le Mac’e benzer bir tasarım yapmaya çalışmış. Ve güzel de olmuş.
Pure CSS Twitter Fail Whale
CSS ile yapılan her deneme uygulamaya geçmiyor, sadece makale ve örnek olarak kalıyor, ama şu Twitter’ın sevimli balinası’na rastlamışsınızdır, ben çok rastladım. Sadece CSS kullanarak yapmış amcamlar.

İnternet denilen dünya akıl almaz bir hızla gelişiyor ve bizim de, yani yazılımcıların da, gelişmemizi istiyor ve de biz buna mecburuz. Bu işi yaparken de eğlenerek yapabiliriz.
Burada sadece 5 tane alışkanlık yazdık ama bunlardan başka daha bir sürü alışkanlık olabilir ya da bunlar her yazılımcı için aynı oranda kabul edilebilir olmayabilir ve böyle olmasıda normaldir. Uzun yıllar yazılım geliştirmekle uğraşanlar zaten kendilerine göre bir alışkanlıklar dizisine sahiptirler. Bu yazı, bu dünyada, yeni olanlar için hoş bir danışmanlık teşkil ediyor.
Başka paylaşmak istedikleriniz olursa lütfen yazın.

Yazının orjinali için Matt Ward a teşekkürler.

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage

Birbirinden Farklı CSS3 Uygulamaları

ndb — Mon, 22 Feb 2010 12:24:00 GMT

CSS3 ile css ve web tasarımı birbirinden farklı birçok özellik kazandı. Her türlü yazı tipini web sayfalarında kullanabilme, css ile oluşturulan animasyonlar, şık buton tasarımları gibi birçok örnek bulunmakta. Bu örnek ve uyguları öğrenmek ve css3'ü tamamen tanımak için birçok uygulama ve makale bulunmakta. Fakat css3 tarayıcıların eski sürümşerinde çalışmıyor. Bunu dikkate alarak da web sayfanızı şekillendirmelisiniz. İşte birbirinden farklı css3 uygulamaları;

11 classic CSS Techniques Made Simple with CSS3 | Demo

Klasik css'den farklı olarak css3'teki farklılıkları açıklayan bu yazıyı css3'e geçen herkesin okuması gerek. Css3'teki animasyon, yazı tipi değişimi ve vurgusu, köşesiz blok yapımı gibi konularda içinde bulunan çok eğitici bir yazı.

Mock-Up Interface Using CSS3 Colour | Demo

Css3 ile transparan bloklar yapabileceğinizi gösteren çok hoş bir uygulama. İstediğimiz herhangi bir bölümü ya da sayfanın tümünü transparan hale getirmek mümkün.

Awesome CSS3 Lightbox Gallery | Demo

Lightbox Gallery, jQuery ve Css3 ile hazırlanmış sıradışı bir sürgüle bırak uygulamasıdır. Sayfanın üzerinde bulunan resimleri herhangi bir blok ya da kutuya taşıyıp işlem yapabilirsiniz.

Awesome Overlays | Demo

Bu uygulama ile herhangi bir resmin istediğiniz bölümünü bloklayarak altına notlar alabilirsiniz. Facebook'taki fotoğraf uygulamasının benzeri.

Coverflow Anyone | Demo

Coverflow Anyone, css3 ile hazırlanan sıradışı bir menü uygulamasıdır. Genelde masaüstü uygulamalarında bulunan bu özellik mouse imleci ile sağa-sola hareket eden ikonlardan oluşuyor.

Matrix Animation with Webkit CSS3 | Demo

Css3 ile hazırlanan bu animasyon uygulaması ile matrix'teki animasyonun aynısı hazırlanmış.

Radioactive Buttons | Demo

Radioactive Buttons ile web siteniz için birbirinden farklı ve şık butonlar hazırlayabilirsiniz. Css3'ün yeni özelliklerini kullanan bu botunları istediğiniz gibi şekillendirebilirsiniz.

CSS3 Embed Font Face | Demo

CSS3 Embed Font Face ile css3 ile gelen farklı yazı tipi özelliklerini öğrenenebilirsiniz. Herhangi bir tasarım bilginiz olmadan css3 sayesinde yazılarınıza farklı efektler uygulayabilirsiniz.

Ayrıca Bakınız ;

angelsdemos : Blog | FriendFeed | Twitter | Email | RSS

Kaynak ; queness

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage

Web Sayfa Yerleşimleri (Layouts) İçin: EZ-CSS

ndb — Mon, 22 Feb 2010 17:07:00 GMT

Web sayfalarınızın yerleşim düzenleri (Layouts) + için kullanabileceğiniz EZ-CSS, bu işlemi Table yerine CSS (div) ile yapabilmeniz için geliştirilmiş ve dosya boyutu sadece 1kb olan bir CSS çatısı (CSS framework).

Çoklu sütun ve sıra oluşturabilme, farklı genişlik ve yüksek değerleri kullanabilme ve web sayfalarına kolayca ekleyebilme gibi daha birçok özelliği, avantajlar/özellikler listesinde barındıran EZ-CSS'yi farklı projeleriniz için kullanabilirsiniz.

EZ-CSS'nin ana sayfasına buradan ve farklı örneklerin bulunduğu demo sayfasına da buradan ulaşabilirsiniz.

Bonus+++++++:
+60 Beautiful Premium Icons (Free)

+TexturePalace

+Layouts için 6 Adet jQuery eklentisi
+jQuery ve CSS ile Page Peel Effect'i
+html formları için 25 harika jquery eklentisi
+jquery ile hoş bir Hover Effect'i
+en iyi 10 jquery slider eklentisi

Kaynak: EZ-CSS
Paylaş: Sosyal Medya paylaşım sayfası burada!
algoz Takip Noktaları:
Blog FriendFeed Twitter Facebook E-posta RSS Mobil iPhone

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage

En iyi Tipografik Web Tasarım Örnekleri

ndb — Wed, 24 Feb 2010 07:38:00 GMT

Tipografi, harf ve semboller ile oluşturulan tasarım örneklerine verilen sanat ve ifade tekniğidir. Tüm tasarım dallarında olduğu gibi tipografi, web tasarımınada sıçarmıştır. Günümüzde birçok tipografik web site görmek mümkün. Klasik web tasarımın dışına çıkarak sıradışı çalışmalarda bulunmak istiyorsanız önce aşağıdaki örnekleri inceleyebilirsiniz.Örnekler alabileceğiniz gibi ilham kaynağınızı da geliştirebilirsiniz. İşte en iyi tipografik web tasarım örnekleri;

CharlesElena

Chirp >> The Twitter Developer Conference

Make Photoshop Faster

Ayrıca Bakınız ;

angelsdemos: Blog | Twitter | Email | RSS

Kaynak ; wdl

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage

sıfırdan illustrator öğrenebileceğiniz dersler

ndb — Thu, 14 Jan 2010 07:39:00 GMT

illustrator dersleri photoshop dersi kadar fazla olmasa da birçok kaynakta bulunabilir. Bu dersler ile illustrator bilginizi pekiştirebilir veya sıfırdan öğrenmeye başlayabilirsiniz. Seri yazıları takip ederek illustrator hakkında bilmediklerinizin sayısı azalabilir. Eğer daha profesyonelseniz yapılan çalışmaları inceleyerek kendinizi geliştirebilirsiniz. işte size sıfırdan illustrator öğretebilecek dersler;

Learn Illustrator CS3 in 30 Days
(30 günde Illustrator CS3'ü öğrenin)

Illustrator Beginner’s Series
(Acemiler için Illustrator Serisi)

Adobe Illustrator Guides and Tutorials
(Adobe Illustrator Rehberi ve Dersleri)

Beginner Adobe Illustrator Tutorials
(Acemiler için Adobe Illustrator Dersleri)

Illustrator CS4 Blob Brush
(Illustrator CS4'te Blob brush -brush : fırça-)

Illustrator CS4 Gradients
(Illustrator CS4'te Gradients)

Working with Illustrator Art Brushes
(Illustrator'de sanat fırçaları ile çalışmak)

Beginner Illustrator Tutorial – Create a Vector RSS Icon
(Acemiler için Illustrator Dersleri - Rss ikon oluturmak)

Illustrator’s Type Tool: A Comprehensive Introduction
(Illustrator'da Type Aracı : Kapsamlı)

Tips for Working with the Gradient Mesh Tool In Illustrator
(Illustrator'da Gradient Mesh aracı ile çalışma ipuçları)

Illustrator’s Pen Tool: The Comprehensive Guide
(Illustrator'da pen aracı : kapsamlı rehber)

Ayrıca Bakınız ;

angelsdemos: Blog | Twitter | Email | RSS

Kaynak ; spoongraphics

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage

tasarım harikası css siteleri

ndb — Sat, 12 Dec 2009 13:26:00 GMT

web sitenizde css tekniğini kullanıyorsanız mutlaka bakmanız gereken bir derleme hazırladım. bu derlemede css tekniği kullanarak hazırlanmış birbirinden kaliteli 17 tasarım harikası siteyi inceleyeceğim ve seçilen web sitelerinin içerikleri farklı olduğu için css ile neler yapılabileceğini göreceğiz, css kullanmıyorsanız bile bu tasarımlara bir gözatmanızı tavsiye ederim.

6. Aperfolio

7.Anidea

10.Code Riser

13.Clear Left

15.Square Four

17.Fatburgr

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage

2009'un En İyi Vektör Dersleri

ndb — Sun, 13 Dec 2009 10:46:00 GMT

2009'un sonuna yaklaşıyoruz. Yeni başlayan kullanıcılar ve profesyonel tasarımcılar yayınlanan dersler ile birçok bilgiye ulaştı. Adobe Illustrator programını kullanarak inanılmaz logolar, karakterler ve simgeler oluşturabilirsiniz. Aşağıda 2009 yılının en iyi vektör derslerine ulaşabileceksiniz.

1. Create a Happy Sun Character (Mutlu Güneş Karakteri Oluşturma)

2. Logo Design Process and Walkthrough for Vivid Ways (Logo Tasarım Süreci ve Canlı Yollar İçin Talimatlar)

3. How to Create a Vector Illustration and Prepare it for Micro-Stock Sale (Mikro-Stok Satışı İçin Vektör Çizimi Nasıl Oluşturulur?)

4. Create a Cute Panda Bear Face Icon (Şirin Panda Simgesi Oluşturmak)

5. Create incredible 3D type-based infographic art (İnanılmaz 3D tipi sanat oluşturmak)

6. How to Create Smoky Brushes and Type In Illustrator CS4 (Illustrator CS4'de Dumanlı Fırçalar Oluşturmak)

7. Create An Awesome Space Rocket Avatar in Illustrator (Illustrator'da Harika Uzay Roket Avatarı Oluşturmak)

8. Create a Character Mascot with Adobe Illustrator CS4 (Adobe Illustrator CS4 İle Karakter Maskotu Oluşturmak)

9. Craft a Delicious Chinese Food Icon (Lezzetli Çin Yiyecek Simgesi)

10. How to Create an Alarm Clock Icon (Alarm Saat Simgesi Nasıl Oluşturulur?)

11. Create a Stylized GPS Icon (Biçimlendirilmiş GPS Simgesi Oluşturmak)

12. Make 3D Yet Flat Looking Shopping Basket Icons (Alışveriş Sepetine Yatay Bakış Simgesi Yapmak)

13. How to Create a Vector Light Bulb Icon with Inkscape (Inkscape ile aydınlık ampul vektörü nasıl oluşturulur?)

14. Create a Vintage TV Set Icon in Illustrator (Illustrator'da modası geçmiş tv seti simgesi oluşturmak)

15. Zee Logo in Illustrator (Illustrator 'da zee logosu)

16. How to Create a Photorealistic iMac and Magic Mouse (Gerçekçi fotoğraf nasıl oluşturulur?)

17. How to Create Funky 3D Springs in Illustrator (Illustrator'da güzel 3D bükülme nasıl oluşturulur?)

18. Design a Cute Hamster Avatar (Şirin Hamster Avatarı Tasarlamak)

19. Create a Rolling Stones Inspired Tongue Illustration (Rolling Stones'den Esinlenmiş Dil Çizimi Oluşturmak)

kaynak: webdesignledger.com

yazılarımı takip edebilirsiniz.

blog | twitter | friendfeed | delicious | rss

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage

Popüler İkon Setleri

ndb — Mon, 14 Dec 2009 10:12:00 GMT

Web sitelerinde görsellik önemlidir. Tasarımcıların kullandıkları birçok yöntem ve araç vardır. Renk uyumundan sonra en önemli şey ise sitede kullanılacak resimler ve ikonlardır. Görsellik ziyaretçileri çeker ve hoş bir görüntü yaratır. Burada, 2009 yılının tasarımcıların en çok tercih ettikleri 10 ikon seti bulunmakta;

10 - Grunge Tarzı Sosyal Site İkonları

Sticker şeklinde dairesel grunge tarzı bu ikonlar genelde blog tarzı sitelerde kullanımakta. png formatında 128x128 boyutlarında toplam 20 ikon bulunmakta. Facebook, twitter, youtube, myspace gibi birçok sosyal sitenin simgesi mevcut.

9 - Proje İkon Seti

Ticari içerikli olarak kullanılabilen toplam 18 tane png formatında ikon bulunmakta. Takvim, saat, mektup, şema, harita, not vb. şeklinde birçok ikon mevcut.

8 - Webby ikon seti

IconsPedia tarafından hazırlanan 64x64 boyutlarında 100 adet ikon bulunduruyor .png, ico ve ICNS formatlarında ve 5.05 mb boyutunda. İçeriğinde ise aradığınız tüm ikonlar mevcut. Popüler program ikonları, sosyal site ikonları, LED ikonlar gibi birçok ikon mevcut.

7 - Onebit İkon Seti

50 ikon bulunan sette oklar, mektuplar, yıldızlar, rss takibi vb. gibi birçok simge bulunmakta. 48x48 boyutlarında png formatında.

6 - Basit İkon Seti

Her arşivde olması gereken ve birçok sitede bulunan klasik, basit ikon seti. çöp tenekesi, büyüteç, disk, hediye paketi, artı vb. gibi birçok seçenek bulunmakta.

5 - Dairesel Sosyal Site İkonları

Daire şeklide 27 adet parlak sosyal siteler ikon seti. AIM, Bebo, eBay, Hi5, Last.fm, LinkedIn, Windows Live, Ning, Orkut, Yahoo,Ebay gibi birçok sosyal sitenin ikonunu barındırıyor. 942kb. boyutunda.

4 - Finans İkon Seti

Finans simgelerinin bulunduğu ikon seti. 1.48mb boyutunda ve png formatındaki sette para, altın, grafik, kasa vb. gibi birçok ikon bulunuyor.

3 - MinIcons

png ve ico uzantılarındaki 48x48 boyutlarında 30 ikon bulunmakta. Her web sitenin ihtiyacı olabilen ikonlar sadece 400kb. gibi az bir boyut kaplıyor.

2 - WP WooTheme İkonları

WordPress WooThemes'in ikonlarını içeren ikon seti. Temadaki tüm ikonlar bulunmakta. 79 tane ve 256×256 boyutlarında. Şu ara çok popüler olduğu söylenebilir.

1 - LED İkon Seti

2009'un en çok kullanılan ikon seti. 16x16 boyutlarında ve 500 tane ikon bulunmakta. İstediğiniz tüm ikonları bu set ile bulabilirsiniz.

Kaynak ; webdesigndev

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage

web tasarımında sık yapılan 10 hata

ndb — Tue, 15 Dec 2009 17:27:00 GMT

web tasarımıyla uğraşıyorsanız mutlaka tasarımınızı mükemmeleştirmek için çalışırsınız haklısınız da, bir sitenin tasarımı ne kadar güzel olursa sitenin başarısı da o kadar artar, siz de bu yazımı inceleyerek web tasarımında yapılan hataları ve web tasarımı yaparken dikkat edeceğiniz noktaları görebilirsiniz. yararlı olmasını umuyorum.

resmin kaynağı:http://theprodesigner.com/top-ten-mistakes-in-web-design/

1.Arama(search) kısmını iyi tasarlayamamak

Sitenizi tasarladınız arama kutusunu da eklediniz ama hazırladınığınız arama bölümü yeteri kadar kullanışlı mı? arama bölümünü kullanıcılarınızın kolaylıkla ulaşabilecekleri ve aradıklarında uygun sonuçları bulabilecekleri şekilde tasarlamanız sitenizin daha başarılı olmasını sağlayacaktır.

2.İçeriği iyi sunamamak

Sitenize yazı eklediniz fakat yeteri kadar iyi sunabiliyor musunuz? yazdıklarınızın içeriği kadar nasıl göründüğü de önemli yazınızı okuyucuyu sıkmayacak bir arka planda ve uzunlukta okunabilir yazmalısınız.

3.font boyutunu ayarlamamak

web sitenizi tasarlarken varsayılan font seçeneğini kullanmak zorunda değilsiniz, yazınızın okunabilirliği için yazınızın boyutu da önemli bu yüzden rahat okunabilecek bir font seçmelisiniz.

4.başlıkları arama motorlarına göre yazmamak

Web sitenizde bir konu hakkında yazı yazdınız, başlığını eklediniz, yayınladınız peki yazınızda kullandığınız başlık arama motorlarında aranabilecek bir şey mi? buna dikkat ederek yazarsanız arama motorlarından sitenize ulaşan ziyaretçi sayısını artırabilirsiniz.

5.Yazılar için pdf formatını kullanmak

Yazdığınız yazılarda pdf online okumayı kullanmayın sitenizi ziyaret eden kişiler pdf formatında yazı okumayı istemezler yani pdf formatı web tasarımında tercih etmemeniz gereken bir formattır.

6.tıklanan linkleri aynı renkle göstermek

Ziyaretçilerinizin tıkladıkları linkleri farklı renkte göstermeniz daha iyi olur çünkü ziyaretçileriniz tıkladıkları linki unutup aynı linki bir daha tıklayabilir ve aynı sayfayla karşılaşmaları siteniz için iyi olmayacaktır.

7.sayfanın reklam gibi görünmesi

Web sayfanızda kullandığınız resimlerle ziyaretçilerinizi yönlendirebilirsiniz fakat bunu yaparken kullandığınız resimlere dikkat etmelisiniz bu resimler reklam gibi görünmemeli kullandığınız resim ziyaretçilerin gözden kaçıraçacığı kadar da olmamalı dengeyi bulmak size kalıyor.

8.değişik bir tasarım yapmak

Değişik bir tasarım derken tabii ki özgün bir tasarımı kastetmiyoruz. tasarımınız elbette özgün olabilir fakat ziyaretçilerinizin sitenizde gezmesini, menülere ulaşımını zorlaştırmamalı.

9.Tıklanan sayfaları yeni pencerede açmak

Sitenizdeki linkleri yeni pencerede açılacak şekilde ayarlamayın çünkü ziyaretçiler birden ekrana fırlayan pencelerden hoşlanmazlar.

10.yeterli bilgi vermemek

Ziyaretçileriniz web sitenizden bilgi almak için web sitenizi ziyaret ederler. siz de web sitenizde yazdığınız bir konuda ziyaretçilerinizin merak edebilecekleri bilgileri vermelisiniz örneğin bir dizi hakkında bilgi veriyorsanız dizinin hangi gün, saat kaçta yayınlandığını da yazmanız yararlı olacaktır.

kaynak

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage

Popüler 5 Online Renk Kombinasyon Aracı

ndb — Thu, 17 Dec 2009 10:18:00 GMT

Tasarımda en önemli unsur renktir. Yaptığın sayfa veya herhangi bir tasarımda renklerin uyumu çok önemlidir. Renk uyumunu sağlayamayan ya da yeni renk tasarımları, trend'leri takip etmek isteyenler için birçok uygulama mevcut. İşte en popüler 5 online renk düzenleme ve analiz aracı:

ColourLovers

ColourLovers sayesinde en son renk trendlerini takip edebilirisiniz. Dünya üzerindeki bir ağda kendi renk kombinasyonlarınızı yaratıp diğer insanların yorumuna açarak paylaşma imkanınız bulunmakta. Renkler için harika bir kaynaktır ve renk paleti sayesinde uyumlu renkleri kolayca seçmenize yardımcı olur. Desenler, arka planlar vb. oluşturma imkanınızda bulunmakta. En büyük artısı tüm renk paletlerini öğrenebilir ve dilerseniz kullanabilirsiz.

Kuler

Adobe'nin online araçlarından birisi olan Adobe Kuler ağır renk aracıdır. Farklı renk kombinasyonları üretmenize yardımıcı olur. Sosyal olarak ColourLovers kadar büyük bir ağı bulunmasa da oldukça geniştir. Profesyoneller için tasarlanmış Kuler size renkleri HSV, RGB, CMYK ve LAB şeklinde verir.Flash ve actionscript 3.0 ile hazırlanmış. Birçok ek aracı bulunmakta. Başlangıç için çok güzel bir araç olmaktla beraber son rötuşlarda o kadar iyi değil.

Color Scheme Designer

Renk uyumu önemlidir. Eğer siz bunu sağlayamıyorsanız diğer araçlar gibi Color Scheme Designer da birçok renk kombinasyonları yarabileceğiniz bir araç. Birçok hazır renk paleti bulunmakta. Hazırladığınız tasarımları HTML, XML şeklinde önizlemenize de olanak veriyor.Photoshop düzenlerini de kullanmanız mümkün. Tek eksiği temel renklerin bulunması ve fazla renk olmaması. Fakat yine de kullanışlı bir araç olduğu söylenebilir.

Color Combos

Ücretsiz renk kombinasyonları veren başka bir servis. Artı özelliğiklerinden biri ise Grab Colors servisi sayesinde istediğiniz web sitenin renk kombinasyonunu anında çıkartabilmesi. Başka bir özelliği ise Combo tester aracı ile renkleri test edebilir, yanyana nasıl durduklarına bakabilirsiniz. İsterseniz seçtiğiniz renklerden basit bir şablon oluşturmanız da mümkün.

ColorSchemer

Tek tık ile renk kombinasyonu oluşturabileceğiniz bir araç. Fakat diğer araçlar kadar kullanışlı olmaması sadece renk seçip kombinasyon üretebilmesindendir. Basit araçları sevenler için ideal bir yazılım.

Ayrıca Bakınız ;

angelsdemos : Blog | FriendFeed | Twitter | Email | RSS

Kaynak ; pxleyes

Bu yazı ndb tarafından bildirgec.org adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.

Pilli Projeleri: Pilli.com: Kolektif Bağımsız İçerik | Sosyomat.com: Arkadaşını Etiketle | Put.io: Online Cloud Storage