bildirgec.org - umutsirin - beğendikleri

internetteki en iyi 10 logo tasarım dersi

umutsirin — Tue, 10 Feb 2009 16:57:00 GMT

presidia creative tarafından derlenen internetin en iyi 10 logo tasarım anlatımını (tutorial) paylaşmak istedim.

Adobe Illustrator'de hazırlanmış myNightLife logosu

myNightLife

Adobe Photoshop ile hazırlanmış BlueLaguna.Net logosu

bluelaguna.net

Adobe Illustrator ile hazırlanmış zagora logosu

zagora

Bir başka adobe illustrator logo tasarım dersi

business logo

Adobe photoshop ile hazırlanmış oldukça şık wordpress logosu

wordpress logo

sikbox.com için hazırlanmış logonun tasarım aşamalarının bulunduğu ders

sikbox

Adobe illustrator ile hazırlanmış webfly solutions logosu

webfly solutions

Adobe illustrator ile hazırlanmış 3 boyutlu bir logo çalışması. benim en çok hoşuma gidenlerden biridir naçizane..

3d logo

Adobe Photoshop ile Firefox logosu tasarım dersi

firefox

Adobe illustrator ile hazırlanmış çevre dostu bir logo

çevre dostu logo

umarım tasarımcı arkadaşlara ilham kaynağı ve yardımcı olur.

kaynak

Bu yazı umutsirin 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

SEO Uzmanları İçin Popüler Firefox Eklentileri

umutsirin — Wed, 21 Jan 2009 17:16:00 GMT

Firefox, eğer ihtiyacınız olan çalışma ortamı için gerekli eklentileri kurduğunuzda gerçekten çok güçlü bir araca dönüşmektedir.

Numaralarla, istatistiklerle, sayfa puanlarıyle ve, elbette, SEO ile oldukça haşır neşir olduğumu kendimden biliyorum.

Günümüzde bilinen 4 önemli puanlama aracı vardır - Google Pagerank, Compete Site Analizi, Alexa Puanı ve Quancast.

Bu yazımda sizinle, web üzerinde gezinirken çalışma verimliliğinizi arttıracak en önemli FireFox araçlarını paylaşmak istiyorum.

1. Compete Tarayıcı Uzantısı
Benim kişisel tercihim olan bu uzantı web sitelerinin ne kadar hızlı büyüdüğü, sitenin ne kadar popüler olduğu (insan bazında) ve sitenin Compete puanını gösteriyor. Uzantı, özellikle istatistiklerin kontrolü için çok kullanışlı.

2. Search Status

Ziyaret ettiğiniz her bir sitede SearchStatus eklentisi, Google Pagerank, Alexa popülerlik puanı, Compete puanı, Alexa'nın alakalı bağlantıları, Google, MSN ve Yahoo!'dan alınan geribağlantılar gibi bilgileri alabilirsiniz.

Bir eklenti üzerinde pek çok özellik bir araya toplanmış ve ortaya güzel bir araç çıkmış. Siz ne dersiniz?

3. Firefox İçin SEO

SEO ile ilgilenen herkesin kullanması gereken muhteşem bir eklenti. Eğer Google, Yahoo!, Alexa, Technorati ve daha pek çok kaynaktan alınan istatistiki verilerle ilgileniyorsanız, bu eklentiye bayılacaksınız.

4. Wizz RSS Haber Okuyucusu

Wizz RSS Haber Okuyucusu oldukça güçlü ve kolay kullanımlı bir RSS ve Atom okuyucusu / alıcısı olup Mozilla Firefox üzerinde çalışmaktadır.

5. Kgen

Bu eklenti bir web sitesi üzerinde kullanılan anahtar kelimelerin ne sıklıkta kullanıldığını ve sayfanın geneline oranla ne kadar güçlü olduğunu belirtiyor. SEO için bir sayfada hedeflediğiniz anahtar kelimelerin tekrar edilme oranı ve bunun etkin bir biçimde sayfa geneline yayılması çok önemlidir. Bu eklenti sayesinde sitenizin sayfalarında o sayfa için hedeflediğiniz anahtar kelimelerin etkin bir şekilde kullanılıp kullanılmadığını anlayabilirsiniz.

6. SEOMoz Rank Checker | Tarayıcı Düğmesi

Mükemmel bir araç - web sitenizin farklı kaynaklardan aldığı puanları depolamanıza yardımcı oluyor. Bu puanları doğrudan tarayıcı üzerinden görüntüleyebiliyorsunuz. İlgili servis Google, Yahoo!, MSN ve Ask arama motorlarını destekliyor.

Bu eklentiyi kullanabilmeniz için site üzerinden kayıt olmanız gerekmektedir.

7. SeoQuake

Seoquake, web sitenizin SEO sonuçlarını analiz edebileceğiniz en güçlü araçlardan birisidir. Eklenti üzerinden PageRank puanınızı ve Yahoo! ile Alexa'nın sunduğu benzer puanları alabiliyorsunuz.

Mozilla ana sayfasında eklentinin yetenekleri hakkında detaylı bilgi bulunuyor.

8. Google Araççubuğu

Eğer bazı Google araçlarını kullanıyorsanız kesinlikle sahibi olmanız gereken bir tarayıcı uzantısı.

Firefox halihazırda Google Aramasını bütünleşik olarak içeriyor, o zaman neden bu araççubuğunu kurmanız gerekli?

Çünkü bu eklenti tüm Google araçlarına tek bir fare tıklaması ile ulaşabilmenizi sağlıyor. Araççubuğu ayrıca geribağlantılarınızı, Pagerank değerini de kontrol etmenizi sağlıyor.

9. Time Tracker

Internet üzerinde çok uzun zaman harcayıp bir türlü işlerini tamamlayamayanlardan mısınız?

Bu eklentiyi kullanarak zamanınızı organize edebilir, Firefox üzerinde ne kadar zaman harcadığınızı kontrol ederek, Internet bağımlılığınızı analiz edebilirsiniz.

10. Read It Later

Bu eklenti de benim en sevdiğim eklentiler arasında yer alıyor. Read It Later'ı kullanarak ilgilendiğiniz sayfaları tarayıcınıza kaydedip daha sonra onları dilediğiniz zaman okuyabilmenizi sağlıyor... Özellikle yer imlerine eklemek istemediğiniz ancak siteyi gördüğünüz an okumaya vaktinizin olmadığı anlarda bu eklenti oldukça kullanışlı hale geliyor.

Kaynak: 1st Web Designer

SEO ile ilgili yazdığım diğer yazılar

SEO Araçları Listesi

Bu yazı umutsirin 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

50+ Torrent Aracı

umutsirin — Wed, 28 Jan 2009 15:00:00 GMT

Mashable'da 50 yeni torrent aracı verilmiş.

Dağıtım Siteleri(Yasal İçerikli)

isohunt

isoHunt - Saat başı güncellenen kapsamlı bir arama motoru
Torrent Reactor - Çok iyi olmasa da Türkçe’ye çevrilmiş, farklı sitelerdeki içeriği gösteren torrent kataloğu

TorrentScan – Paylaşım haberleri ve bir çok farklı siteden torrent arama motoru

The Slackware Linux Project - Slackware Linux için bir torrent kaynağı

Bitoogle – Basit bir torrent arama motoru

BTbot – Forumları da dahil eden bir torrent arama motoru

TorrentPortal – Bir milyonu aşkın üyeye sahip bir torrent izleyicisi

yotoshi

Yotoshi – Torrentle ilgili haberleri de içeren bir torrent arama motoru

PeerIt – Torrent alıp satabileceğiniz bir sanal market

TuxDistro – Linux ile ilgili torrentleri içeren bir site

YouTorrent – 300.000’den fazla yasal dosyayı arayan büyük bir arama motoru

Bilgi Siteleri

Orb’s Torrent Site Status

Orb’s Torrent Site Status – Bir çok torrent sitesinin aktiflik, üyelik, RSS beslemesi ve kategorilerini görebileceğiniz bir site.

TorrentFreak – Torrent topluluğundaki tüm haberleri gösteren bir site. Bazen yasal içerik sunulabiliyor. Ayrıca popüler istemcilerde nasıl torrent oluşturulur konulu bir dersleri de var.

Torrent İstemcileri

TorrentSpy

TorrentSpy – Ağdaki tamamlanmış ve tamamlanmamış kullanıcıları gösteren basit bir istemci

Anatomic P2P – Farklı PHP tabanlı süper izleyiciler( orijinal yazıda supertracker diye tanımlanmış) kullanan değiştirilmiş BitTorent istemcisi

Aria2 – HTTP(S), FTP, BitTorent ve Metalink protokollerini destekleyen bir indirme yöneticisi

Bitflu – Perl’le yazılmış Linux’ta ve OSX’te de çalışan ücretsiz bir torrent istemcisi

BitLet – Tarayıcınızda çalışan bir istemci

BTG – C ’la yazılmış bir istemci.

Free Download Manager - HTTP, FTP, BitTorrent protokollerini destekleyen ücretsiz ve açık kaynak kodlu bir indirme yöneticisi

G3 Torrent

G3 Torrent – Python’la yazılmış ücretsiz torrent istemcisi

LimeWire – Açık kaynak kodlu bir P2P istemcisi

Miro – Kendi videolarınızı paylaşmak için araçlar da içeren ücretsiz, açık kaynaklı online video torrent istemcisi

MLDonkey – Linux, Unix ve Windows desteği veren bir P2P istemcisi

Shareaza – Çoklu ağ desteği veren ücretsiz bir P2P istemcisi

Rufus – G3 Torrent tabanlı bir istemci

SymTorrent – Symbian Os için tek torrent istemcisi

Torium – Linux için minimalist bir torrent istemcisi

TorrentFlux

TorrentFlux – Linux, Unix ve BSD için torrent transfer sistemi

Unworkable – Basitlik ve verimlilik vaadeden BSD lisanslı, ücretsiz torrent istemcisi

Tribler – Anahtar kelime aramaları, kategori görünümü ve “benzer kullanıcılar ne indiriyor” gibi özellikleri bir araya toplayan P2P ağı

libTorrent – Unix ve Linux için C ile yazılmış bir BitTorrent kütüphanesi

MonoTorrent – Google’s Summer of Code 2006’nın bir parçası olarak geliştirilen açık kaynaklı bir BitTorent kütüphanesi

Torrent Station 1.1 – Kişisel limit ve klasör gibi yenilikler getiren Mac OS torrent istemcisi

Kyaya Torrent Manager – Basit ve açık kaynaklı BitTorrent istemcisi

Torrent Searcher X – Beş büyük izleyicide arama yapan Mac OS torrent istemcisi

TorrentDam

TorrentDam.app – 7 farklı sitede arama yapan bir torrent arama motoru

iTorrentFlux – Mac OS X için TorrentFlux aracı

Eetee – Mac OS X için ucuz bir torrent istemcisi

XTorrent – Mac OS X için diğer bir torrent istemcisi

Torrent Harvester – Bir torrent arama uygulaması

VIP Torrent – Yüzlerce P2P ağında arama yapan e-mule tarzı bir torrent istemcisi

Torrent Finder – Firefox ve IE için eklentileri de olan bir torrent arama motoru

Torrent Loader – Torrent hakkında hem hiyerarşik yapıyı hem de ana bilgiyi gösteren TorrentSpy benzeri bir program

Torrent Torque – Delphi ile yazılmış bir torrent istemcisi

Extended BitTorrent – Yüksek performanslı bir BitTorent istemcisi

Hydranode – Grafiksel arayüz ve çoklu izleyici desteğine sahip eklenti tabanlı P2P istemci iskeleti

MooPolice – Torrent dosyaları yaratabilen, düzenlenebilir izleyici listesine sahip BitTorrent istemcisi

Tarayıcı Eklentileri

torrenTools

torrenTools – Firefox ve IE üzerinde çalışan, 41 torrent sitesinde arama yapabilen bir eklenti

Seedpeer – Firefox ve IE için arama eklentisi

TorrentBar – Firefox için arama eklentisi

isoHunt

Bu yazı umutsirin 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

2008'in En iyi 75 Tasarım Kaynağı

umutsirin — Mon, 02 Feb 2009 10:21:00 GMT

2008 in en çok dikkat çeken tasarım kaynakları burada listelenmiş.

Buyrunuz çeşitli kategoriler altında 2008 in en iyileri:

Tipografi Kaynakları

60 Brilliant Typefaces For Corporate Design [Smashing Magazine]

20 Free Handwritten Fonts And Resources [Fuel Your Creativity]

50 Incredible Fonts for Professional Web & Print Design [Noupe]

15 Beautiful High-Quality Free Fonts [Smashing Magazine]

21 Inspirational Typography Artworks from DeviantArt [Designflavr]

Top 7 Fonts Used By Professionals In Design [Just Creative Design]

45 Beautiful Free Fonts for Modern Design Trends [Six Revisions]

CSS Kaynakları

50 Extremely Useful And Powerful CSS Tools [Smashing Magazine]

30+ CSS Cheat Sheets and Guides [All Web Design Resources]

CSS Editors Reviewed [Smashing Magazine]

10 Principles of the CSS Masters [NETTUTS]

Best of CSS Design 2008 [Web Designer Wall]

40+ CSS Generators, Creators, and Makers [All Web Design Resources]

Resetting Your Styles with CSS Reset [Six Revisions]

12 Principles For Keeping Your Code Clean [Smashing Magazine]

Logo Tasarımı Kaynakları

81 of the Best Logo Design Resources [Logo Design Love]

The Best Logo Design Resources [Just Creative Design]

105+ Logo Design Tuts And Resources [Elite By Design]

35 Stunning Black and White Logos [Siah Design]

50+ Kick Ass Logos for Inspiration [Fuel Your Creativity]

33 Exceptional Logo Rebrandings In 2008 [Smashing Apps]

30 Brilliant Vector Logo Designs, Deconstructed [VECTORTUTS]

10 Successful Logo Redesigns [Logo Design Love]

İkonlar

50 Most Beautiful Icon Sets Created in 2008 [Noupe]

40 Beautiful Free Icon Sets [Six Revisions]

22 (New) Free High Quality Icons Sets [Elite By Design]

40+ Extremely Beautiful Icon Sets [Noupe]

Bu yazı umutsirin 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 Uygulamaları İçin En İyi 21 Simge Seti

umutsirin — Tue, 13 Jan 2009 14:15:00 GMT

Bir web uygulaması tasarlarken kullanıcı arabirimini kolay kullanılabilecek şekilde tasarlamak önemlidir. Gezinti (navigasyon) bağlantılarının yanı sıra simgeler kullanmak bu hedefe ulaşmak için üzerinde çalışmamız gereken önemli bir görevdir. Ancak uzun zamanınızı alacak simge setlerini baştan oluşturmak yerine neden başkalarının sizler için oluşturduğu simge setlerini kullanmayasınız? Bu yazıda web uygulamaları geliştirmek isteyen kullanıcıların uygulamalarında kullanabilecekleri en başarılı simge setlerini listelemeye çalıştım.

Jonas Rask Design Icons for Developers

Jonas Rask Design Icons for Developers

ASP.NET Icons

ASP.NET Icons

Tango Icon Library

Tango Icon Library

Aesthetica Icons

Aesthetica Icons

Diagona Icons by pinvoke

Diagona Icons

Fugue Icons by pinvoke

Fugue Icons

FAMFAMFAM - Silk

FAMFAMFAM - Silk

Web Application Icon Set

Web Application Icon Set

Coquette Icons

Coquette Icons

Free web development icons #4 SE

Coquette IconsFree web development icons #4 SE

Developpers Icons

Developpers Icons

Knob Buttons Toolbar Icons

Knob Buttons Toolbar Icons

Simplistica Icons

Simplistica Icons

Function Icon Set

Function Icon Set

Milky

Milky

Simplico

Simplico

Fresh

Fresh

FAMFAMFAM - Mini

FAMFAMFAM - Mini

Crystal Clear

Crystal Clear

Monofactor Vector Icons

Monofactor Vector Icons

IVista Icon Pack 2

IVista Icon Pack 2
Bu yazı umutsirin 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

Size Sıfırdan jQuery Öğretecek 15 Kaynak

umutsirin — Sun, 11 Jan 2009 11:14:00 GMT

Belki tam bir jQuery uzmanısınız. Ya ne olacak canım, John Resig'in tam kendisisiniz belki de... Ya da Bildirgeç üzerinde "Prototip", "jQuery", ve "Mootools" gibi kelimeleri görüp "Bunlar da ne ola ki?" diye hayıflanıp duruyorsunuz... Şimdi tüm bunları öğrenmenin zamanı geldi.

Bu endüstride, -özellikle günümüzde daha önce hiç olmadığı kadar-, tasarımcılar kodculara, kodcular da tasarımcılara dönüşüyor... Bir geliştiricinin görevi SADECE ön ya da arkaplan işlerini yürüten kod yazmak olmaktan çıkıyor. jQuery işte bu aradaki mesafeyi kapatmaya yardımcı olan bir JavaScript kütüphanesi. JavaScript erişilemez bir yetenek değil. Daha önce yayımladığım size sıfırdan PHP öğretecek 25 kaynak yazısının site kullanıcıları tarafından çok tutulan bir yazı olduğunu gördükten sonra nettuts üzerindeki benzer bir yazıyı da jQuery dersleri için yayımlamayı uygun gördüm. Bu makalede daha önce hiç jQuery üzerinde çalışmamış geliştiricilere jQery kütüphanesini öğrenmelerine olanak sağlayacak 15 kaynağı listeleyecek ve ilgili kaynaklar hakkında bilgi vereceğim. Eğer bugüne kadar bu kütüphaneye herhangi bir nedenden ötürü korkup yaklaşmamışsanız, şimdi ona yaklaşmanın tam zamanı. Ne kadar kolay olduğuna inanamayacaksınız.

jQuery de ne ola ki?
jQuery.com'a göre jQuery hızlı ve öz bir JavaScript kütüphanesi olup HTML belgelerinizi olayları işleyebilecek, animasyonlar yürütebilecek ve web sayfalarınıza Ajax etkileşimleri dahil edebilmenizi kolaylaştırır. jQuery, bugüne kadar JavaScript yazma şeklinizi geliştirmek için tasarlanmıştır.

Daha basit anlamı ile jQuery, daha önce 10 satır yazdığınız JavaScript kodunu iki satırda yazmanıza olanak sağlayan bir kütüphane! Geriye kalan sekiz satırın en verimli şekilde başkaları tarafından halihazırda yazıldığını ve bu kodun da JavaScript çalıştırabilen tüm modern tarayıcılarda yürütülebildiğini düşünün. Daha jQuery'i derinlemesine öğrenmeden bile zengin formlardan Flash gibi menüler oluşturabileceksiniz. Bir başka iskeleti daha öğrenmek istemiyorum demeyin. Aşağıdaki kaynaklar size bu yolda adım adım rehberlik edeceklerdir.

Neden diğerlerini değil de bu kütüphaneyi kullanmalıyım?
Sonuç olarak bu sizin seçimiz. Her bir iskeletin (framework) kendine özgü avantajları vardır. Ancak jQuery'nin günümüzün en popüler JavaScript iskeleti olmasının ardında bazı nedenler yatıyor.

Birden fazla tarayıcı ile uyum. Her bir JavaScript ikmali sırasında web geliştiricilerinin önemli bir zamanını, geliştirdikleri betiğin farklı tarayıcılar üzerinde beklendiği gibi çalışıp çalışmadığını test etmesi beklenir. Ne şans ki jQuery kütüphanesi bu tarayıcı uyumsuzluklarını gideriyor ve geliştiricilere kendi kodları üzerinde daha fazla zaman harcayabilmelerine olanak sağlıyor.

CSS Seçicileri. CSS sözdizimlerini kullanarak, geliştiriciler halihazırda kullandıkları bilgilerini belgelerine kolayca dahil edebilirler. CSS 3 ve XPATH seçicilerinin de desteği ile, jQuery sayfanızdaki elementleri kullanmak için mükkemel bir mekanizma sunuyor.

Zincirleme. jQuery kendi metodları için "zincirleme" (chaining) adı verilen bir yöntem kullanır. Bir jQuery nesnesi üzerinde bu yöntemi çalıştırdığınız her zaman, ilgili yöntem aynı jQuery elementini çalıştırır. Bu nedenle de her bir yöntem için seçicilerinizi yeniden yazmanız gerekmez. Tıpkı ".NET" tarzındaki bir özelliği kullanarak daha küçük dosya boyutlarına sahip ve kolay okunabilen kodlar yazabilmenizi sağlar.

Eğer merakınız iyice arttıysa, çok güzel! Hemen başlayalım.

Adım 1: Kütüphaneyi İndirin
Bu yolculuktaki ilk durağınız kütüphaneyi bilgisayarınıza indirmek olacaktır. jQuery.com'u ziyaret edin ve "Download jQuery" bölümüne gidin. Listedeki bağlantılardan birine tıklayarak kütüphaneyi bilgisayarınıza indirin. Daha sonra indirdiğiniz .js dosyasını HTML belgenize dahil etmeniz gerekecek.

CSS-Tricks.com: jQuery'e Giriş: Bu jQuery eğitim videosunda, CSS-Tricks websitesinden Chris Coyier, jQuery'i web sayfanıza nasıl dahil edebileceğinizi ve birkaç özelliği nasıl yazabileceğinizi gösterecek.

Digital-Web.com: jQuery: Başlangıç Kursu: Kod yazmayı bilen web tasarımcıları için jQuery'e giriş kursu.

Slideshare.net: "30 Dakikada jQuery Öğrenmek": Eğer slayt gösterilerinden hoşlanıyorsanız, bu ders size jQuery kullanarak nasıl slayt gösterileri oluşturabileceğinizi ve aynı zamanda size jQuery öğretmeyi hedefliyor.

Adım 2: İlk Fonksiyonunuzu Oluşturun
jQuery'i öğrenme aşamanızın daha ilk birkaç dakikasında kendi fonksiyonlarınızı oluşturmaya başlayacaksınız. İlk durağınız John Resig'in giriş maklesi "jQuery Nasıl Çalışır?" olmalı. Resig, web uygulamalarınız üzerinde kullanacağız pek çok kolay anlaşılır yöntemi anlatacak. Anlatacakları arasında sınıf ekleme ve kaldırma, zincirleme ve "document.ready" yöntemini çağırmak yer alıyor.

jQuery.com: "jQuery Nasıl Çalışır?": Bu giriş makalesinde John Resig (jQuery'nin yaratıcısı) sizi animasyon oluşturmanın temellerine götürecek. Eğer jQuery'e yeniyseniz bu makaleyi kesinlikle okumanız önerilir.

15DaysOfJquery.com: 1. Gün: jQuery'nin tüm özelliklerini iki haftada kavramak gibi cesur bir girişimde bulunan "15 Days of jQuery" (jQuery ile 15 Gün) web sitesi her gün bir konuyu işliyor. Bu makalede "document.ready" yöntemini nasıl kullanmanız gerektiğini öğreneceksiniz.

VisualJquery.com: "jQuery Sözlüğünüz": VisualjQuery.com web sitenizi dijital sözlüğünüz olarak düşünün. Site, kullanılabilen her bir jQuery yönteminin sözdizimini ve açıklamasını içeriyor. Bu siteyi yer imlerinize eklemeyi unutmayın.

Adım 3: Elementlerinizi Canlandırın

Bu pek çok geliştirici için tartışmalı bir konudur. Birinci grupta "sıfır animasyon"da ısrar eden insanlar bulunur. Bunlar kullanıcının istediklerine mümkün olan en hızlı şekilde cevap verilmesine ve aradan çekilmesini tercih ederler. Onlara, bir sonraki uğraşı için bekleyen bir zombi gibi davranmayın. İkinci grupta da bazı insanlar vardır. Onlar, göze hoş görünen animasyonlar içeren bir siteye, kendi kullanıcıları için uygun bir site gibi bakarlar. Bu animasyonlar uygun kullanıldığında animasyonların kullanılırlığı önemli ölçüde arttırdığına inanırlar. Siz, hangi grupta olduğunuza karar vermelisiniz. Hangi grupta olursanız olun jQuery'nin sayfanızdaki elementleri hareket ettirebilme görevini mümkün olan en kolay şekilde yerine getirebildiğini unutmayın.

jQuery.com: "Animasyonlar jQuery'nin animasyon yeteneklerini öğrenirken burası uğramanız gereken ilk yer olmalı. Makale, bu yöntemi kullanırken ihtiyacınız olacak parametreleri detaylandırıyor.

Detached Designs: jQuery'nin Animasyon Yeteneklerini Öğrenmek: Konu animasyona geldiğinde hiç deneyiminiz yok mu? Bu makale özellikle animasyon konusunda hiç deneyimi olmayan kullanıcıları hedef alıyor. Makalenin içerdeği başlıklar arasında metin boyutunu değiştirmek, elementleri hareket ettirmek, animasyonları zincirlemek gibi her jQuery kullanan geliştiricilerin işine yarayacak konuları içeriyor.

Web Designer Wall: Tasarımcılar İçin jQuery Dersleri: Halen jQuery'nin gücü kafanızı mı karıştıryor? Bu site menülerden imaj değiştirmeye kadar 10 adet örneği detaylandırarak bu muhteşem kütüphanenin yetenekleri hakkında sizi bilgilendirmeyi hedefliyor.

Adım 4: Eklentiler
jQuery ile ilgili güzel olan bir şey var ki o da kütüphane geliştirilirken, John Resig ve ekibi kütüphanenin özelliklerini eklentiler kullanarak geliştirmenin sadece birkaç satır kod ekleyerek mümkün kılmak üzerine çalışmış olmaları. Kendinize özgü yöntemleri çok kısa süre içerisinde yazabileceksiniz! Bu eklentileri ana kütüphaneden ayrı tutarak (bu arada jQuery kütüphanesinin sadece 16KB olduğunu da hatırlatalım), bu özel eklentileri sadece gerektiği zaman sayfalarımıza dahil edebileceğiz. Bunun sonucunda JavaScript dosyalarınızın boyutu mümkün olan en küçük seviyede kalacaktır.

jQuery Corner Gallery
Elementlerinize yuvarlatılmış köşeler eklemek için CSS3'ün tüm tarayıcılar tarafından desteklenmesini beklemek istemiyor musunuz? O zaman jQuery kullanarak elementlerinize kolayca yuvarlatılmış köşeler ekleyebilirsiniz. Sadece yuvarlatılmış köşeler ile de sınırlı kalmayın, zira eklenti çeşit çeşit köşe tiplerini de bünyesinde barındırıyor. Bu eklenti araç kutunuzda kalıcı bir yer bulabilir.

Kullanıcı Deneyimini Geliştirin: 10 Kullanışlı jQuery Eklentisi Bu makalede James Padolsey, kendince en iyi jQuery eklentilerini listelemiş.

jQuery.com: "Eklentiler": Her zaman olduğu gibi jQuery.com değerli bir kaynak olmaya devam ediyor. Bu makale ilk eklentinizi oluşturmak için size adım adım rehberlik ediyor.

Adım 5: AJAX Özelliğini Dahil Etmek
Şu ana kadar öğrendiğiniz jQuery yetenekleri ile kendinizi güvende mi hissediyorsunuz? Yeteneklerinizi bir sonraki seviyeye yükseltmeye hazır mısınız? Neden betiklerinize biraz Ajax özelliği dahil ederek başlamıyorsunuz? Her ne kadar "load()" ve ".get()" yöntemlerinin kullanımı ile jQuery veri yüklemeyi inanılmaz derecede kolaylaştırıyor. Aşağıdaki kaynaklar eğitiminiz için hayati önem taşıyor.

Sitepoint.com: jQyery ile Kolay AJAX: Akash Mehta'nın Sitepoint için hazırladığı bu makalede web uygulamalarınıza AJAX eklemenin jQuery kullanılarak ne kadar da basit bir işlem olduğu anlatılıyor.

Tasarımcılar için jQuery: AJAX Kullanarak Form Doğrulama: Bu makalenin yazarı Remy, bizlere jQuery kütüphanesinin yanında AJAX kullanarak bizlere, web tabanlı formlara nasıl sunucu taraflı doğrulama özelliğini ekleyebileceğimizi gösteriyor.

Nettuts.com: jQuery Kullanarak İçerik Nasıl Yüklenilir ve Hareket Ettirilir?: jQuery dersleri ararken NETTUT'un "Javascript" kategorisine bir gözatmayı unutmayın. Bu derste NETTUTS ekibi jQuery kullanılarak bir verinin nasıl yüklenebileceğini ve ardından onu taşıyan elementin nasıl hareket ettirilebileceğini göstermiş.

Bu yazı umutsirin 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

Desen (pattern) siteleri 2

umutsirin — Sat, 10 Jan 2009 13:17:00 GMT

Web tasarımcılarının işlerini kolaylaştıracak pattern(desen) sitelerine devam:

AppendixSquared: Paris Dolores ve Christina Pham adlı iki grafik tasarımcı hanımefendinin hazırladığı sitede yok yok! Desenler, fırça ve fotoğraf setleri,fontlar,avatarlar, dokular, duvar kağıtları ve dersler sizleri bekliyor.
Barracuda Backgrounds:Karmaşadan uzak tasarımıyla size istediğinizi sunan sitede kağıt, taş, ahşap, fotoğraf, metin, kabartma konu başlıkları altında arka planlar ve desenler bulunuyor.
Hybrid Genesis:Henüz az sayıda fakat oldukça güzel desenlere web sahipliği yapan sitede fırça setleri ve dokular da mevcut.
DinPattern:Bildirgeçte daha önce de bildirdiğim bu site, farklı desen kaynaklarıyla kendinden bir kez daha söz ettiriyor.
Huge Magazine:Az sayıda, sıra dışı desenlerin adresi!

PixelDecor:Renkli desen kaynakları sitesi.
pattern-BOMB:Sitede geometrik ve retro desenler yanında,desen derlemelerine de yer verilmiş.
Portfelia Patterns:64 adet kaliteli desen ve az sayıda fırça seti..

fractured-sanity.org
Fractured Sanity[Dot]Org:Sitedeki desenler siyah, kırmızı, sarı, pembe, gri, mavi, kahverengi, beyaz, yeşil başlıkları altında gruplandırılmış.

Patterns of Change:renk ve şekil olarak gruplandırılmış sade desen tasarımları.
not:kaynak listede yer alan bazı siteleri çıkartmamın sebebi, daha önce bu ve şu bildirilerimde bahsetmiş olmamdır.
Bu yazı umutsirin 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 Altın Oran

umutsirin — Sat, 03 Jan 2009 16:44:00 GMT

Matematik güzeldir. Kulağa garip mi geliyor? Ben de tasarım yapmaya ilk başladığımda aynısını düşünmüştüm. Matematik esnek değildir ve genellikle sıkıcıdır, en azından ben öyle düşünürdüm. Pek çok sanat eserinin, estetik olarak göze hoş gelen tasarımların, nesnelerin hatta bazı insanların ortak matematiksel değerleri paylaştığını duyunca şaşıracaksınız. Yunanca Φ (phi) harfinden esinlenen ve ilahi oran olarak da bilinen altın oran özellikle bunların başında geliyor. Bu rehber bir websitesinin anatomisini ve çatısını kapsıyor ve Alton Oran'ın buna olan etkisini inceliyor.
Web Sayfasının Anatomisi
Web sayfananın öğeleri organlar gibidir, estetik olarak göze hoş gelen ve düzgün işleyen bir web sayfası için hayati önem taşımaktadır.

Bunlar bir web sayfasının ana elementleridir. Bunları organize etmek için pek çok yöntem bulunmakla birlikte en sık kullanılan şablon budur.

Container (Kapsayıcı)

Tüm web sayfaları kapsayıcılar kullanır ve aynı amaca, sayfa elementlerini kapsama amacına hizmet etmek için de olsa kullanım şekli değişkendir. Örneğin body etiketi ya da div en sık kullanılan şeklidir. Geçmişte tablolar bile bu amaçla kullanılmıştır (siz tabloyu sayfanızda kapsayıcı olarak kullanmayın, bu yöntemin değeri kayboldu). Kapsayıcıları, yatak odanızın, mutfağınızn, salonunuzun ve oturmanızın içine döşendiği, evinizi kapsayan fazladan bir duvar olarak düşünün.

Kapsayıcı tipleri:

Likit (Liquid): Tarayıcı penceresini dolduracak şekilde genişler.

Sabit (Fixed): Seçtiğiniz genişliğe sahiptir ve tarayıcı pencere boyutuna göre değişkenlik göstermez.

Header (Başlık)
Başlıklar aslında bir elementi tanımlamalazlar ancak bazıları onu bu şekilde kullanabilir. Genellikle web sayfasınızın logosunu, navigasyonunu, sloganını vs. kapsayan bölüm için kullanılır. Pek çok kişi bu elementleri daha kolay sayfa stillemek, element bölümlemek ve/veya sınırlamak için bir div içerisinde taşırlar. Başlıklar da birer taşıyıcı olarak algılanabilecekleri için yukarıda anlatıldığı gibi Likit ya da Sabit formda kullanılabilir.

Logo
Logonuz kimliğiniz ve markanızdır. Logonuz için en uygun yer başlık içerisinde sol kısımdır. Soldan sağa ve yukarıdan aşağı doğru okuruz, bu sebeple logonuzun ziyaretçilerinizin bakacağı ilk nesne olması muhtemeldir.

Navigasyon
Sayfa navigasyonu en önemli elementlerden birisidir, ziyaretçilerinizin websitenizi kullanabilmesi için gereklidir. Kullanması ve bulunması kolay olmalıdır, ki bu sebeple genellikle başlık bölümünde ya da sayfanın üst kısmına yakın bir yerde konumlandırılır. Bazen yoğun içeriğe sahip websitelerinde her iki tip navigasyonun kullanıldığı görülür.

Navigasyon tipleri:

Yatay: Birbiri ardına dizilmiş ve genelde "navigasyon" diye tabir edilen bir dizi link.

Dikey: Alt alta dizilmiş ve genelde "menü" diye tabir edilen bir dizi link.

Main Content (Ana İçerik)
Herkesin bildiği (ya da bilmesi gerektiği) gibi içerik kraldır! İnsanlar sitenizi ziyaret ettiklerinde genel olarak bakacakları element budur. Web sayfasının ana odak noktası olmalı ki ziyaretçiler aradıklarını kolayca bulabilsinler.

Sidebar (Yan Bar)
Yan bar; reklam, site araması, abonelik bağlantıları (RSS, Twitter, Elektronik posta vs.), iletişim yöntemleri gibi öğeleri içerebilecek bir elementtir. Bu elementi kullanmak her ne kadar gerekli olmasa da pek çok websitesi bunu kullanır. Genellikle sağa dayalı olarak kullanılsa da bazen sola dayalı, ya da ana içeriğin her iki yanında da kullanıldığı görülür. Burada unutulmaması gereken ana içerikten daha baskın hale gelmemesi gerekliliğidir. Dikey VE yatay navigasyon kullanan websitelerinde yan bar genellikle dikey navigasyon elementi ile birlikte kullanılır.

Footer (Altlık)
Web sayfasının altı genellikle altlık elementini kullanır ve bu element ziyaretçilerinizin sayfanın tamamlandığını anlamasını sağlar. Tıpkı başlık elementinde olduğu gibi altlık elementi de kullanması zorunlu bir element olmamakla birlikte daha çok bir kapsayıcı elementtir. Altlık içerisinde telif bilgileri, yasal uyarılar ve iletişim bilgilerinin kullanıldığı sık görülür. Web sitenizin ana sayfası, iletişim bilgilerinin yer aldığı sayfa gibi önemli sayfalara birkaç bağlantı içermesi de tercih edilid. Bazı websiteleri bu alanı sayfanın içeriği ile ilişkili başka içeriklerden ya da diğer önemli içeriklerden bahsetmek amacı ile kullanırlar.

"Whitespace" (Boşluk)
Web sayfasının bu alanı tipografi ya da diğer içerikle doldurulmayan tüm alanlara verilen genel addır. Bazen her boşluğu doldurmak zorunda hissedebilirsiniz kendiniz ama bunun olmasına izin vermeyin. Boş alanlar iyi web tasarımının tıpkı içerik gibi önemli bir alanıdır. Bildirgeç websitesinde beyaz alanların kullanıcıların içerik arasında yolunu bulabilmeleri için zekice kullanıldığını, sayfa balansı oluşturduğunu ve içerik bölümlemesini sağladığını göreceksinizdir.

Altın Oran ve Izgara Kullanımı
Daha önce matematiğin güzel olduğunu söylediğimi hatırlıyor musunuz? Görsel zevki altın oran temelinde algılıyoruz. Binlerce yıldır sanatçılar, tasarımcılar, mimarlar vb. bilerek ya da bilmeyerek göze hoş gelen eserlerin ortak bir oran kullanarak oluşturdular. Peki bu sihirli numara nedir? 1.62 (aslında 1.618...) Bu numaranın kökenine değinmeyeceğim ancak nasıl kullanabileceğinizi göstereceğim.

Altın oranı kullanmak çok kolaydır. Diyelim ana içerik ve yan bar sütunlarınızın genişliğini buldunuz. İçerik alanınzın toplam genişliğini aldınız (örneğimizde 900px kullanacağız) ve onu 1.62'ye böldünüz. Yukarıdaki örnekte görüldüğü gibi 900px'i 1.62'ye bölerseniz 555.55px elde edersiniz. Sayının tam olmasına gerek yok, o yüzden biz 555px diyelim. Şimdi ana içerik elementinin 555px olacağın, yan barın da 345px olacağını biliyorsunuz. Ne kolay değil mi?

Ama durun! Eğlence burada sona ermiyor. Altın oranı elementin yükseliği ile oranlayarak da kullanabilirsiniz. Bu, Altın Oran orantıları ile estetik olarak göze hoş gelen elementlerin oluşması ile sonuçlanacaktır.

Izgara (Grid) Kullanmak

Eğer siz de diğer pek çok insan gibiyseniz, bu oranı kullanmak istediğiniz her zaman hesap makinesine koşturmayacaksınız. Bu işlemi basitleştirmek için ızgara kullanabiliriz. Tek yapmanız gereken genişliğinizi ve/veya yüksekliğinizi üçerli bölümler halinde ayrıştırmaktır.

Her bölüm kendi içerisinde de üçerli gruplara ayrılarak daha detaylı ızgaralar oluşturulabilir. Eğer daha önce yayımladığım BluePrint CSS Framework'ünü Kullanmak yazımı okuduysanız, BluePrint CSS iskeletinin detaylı bir ızgara sistemini kullandığını göreceksinizdir. Izgara sistemleri tasarımı kolaylaştırmak ve çabuklaştırmakla kalmaz, onları estetik olarak göze hoş gelen bir çatıya yerleştirir. Eğer halihazırda tasarımlarınızı yaparken ızgara sistemlerini kullanmıyorsanız, şimdi başlangıç için doğru zaman olabilir. Fireworks, Photshop ve daha fazlası için http://960.gs üzerinden ızgara modellerini indirebilersiniz. 960.gs, CSS ızgara modelini kullanan bir başka iskelet sistemidir.

Yukarıdaki resimden de görebileceğiniz üzere NetTuts Altın Oran'a iyi uyum sağlamış görünüyor. Sayfanın üst üçte birlik kısmı kendi arasında yine üçe ayrılmış durumda ve hatta buradan başlık alanının kendi içerisinde de gruplara ayrıldığını görebiliyorsunuz. Altın Oran'a oldukça yakın. NetTuts tasarımının göze neden hoş geldiğine şaşmamak gerek.

Eğer tasarım işinde yeniyseniz, sizi bazı popüler siteler bulmanızı, onların element yayılımını ve Altın Oran ile ızgara sistemleri ile olan ilişkisini incelemenizi şiddetle öneririm. Ardından biraz zaman ayırarak kendi elementleriniz üzerinde Altın Oran'ı uygulamaya ve sonucu ızgara üzerine yerleştirmeye çalışın.

Kaynak: NetTuts
Bu yazı umutsirin 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

dahice hazırlanmış 20 sıradışı logo

umutsirin — Thu, 08 Jan 2009 10:02:00 GMT

Logolar her yerde. Bu sebepten başarılı bir logo ilk olarak diğer milyonlarca logo arasından sıyrılmalı, tasarımıyla dikkat çekebilmelidir.

bison logo
Başarılı bir logo, hem akıl dolu hem benzersiz bir uyum içinde hem de biraz sıradışı olmalıdır. Bunu başarabilen logolar çok azdır. Ve bu bildiride mutlaka görmeniz gerektiğini düşündüğüm, onların, aşağıdaki örneklerine yer vereceğiz.
Benim favorim, Seamus Leonard tarafından tasarlanamış olan yukarıdaki bison logosu.

London Symphony Orchestra

Schizophrenic logo

Rehabilitation Hospital Corporation of America

zip logo

full time logo

Metroplex logo

cafe click logo

Modern Nerd logo

Logo Motives logo

candy logo

Studio Eight logo

diğerlerine buradan ulaşabilirsiniz.

son olarak, logolar ile ilgili yayınlanmış şu yazılar da ilginizi çekebilir:
ünlü logo denklemleri: eğlence ve matematik
logoları bir de böyle düşünün!
dünyaca ünlü logolar krizden nasıl etkilenir
tasarımı yenilenen 33 adet logo
kardeş olan logolar
ünlü logoların yeni anlamlı yaşamları
50 Olimpiyat Logosu: 1924 - 2016
120 adet göz kamaştıran logo tasarımı
Bu yazı umutsirin 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

Ücretsiz webcron hizmeti

umutsirin — Thu, 25 Dec 2008 07:58:00 GMT

Linux kullanıcılarının yakından tanıdığı cron'un tanımını şu şekilde Türkçe'ye çevirmeye çalışayım;

Cron, linux/unix kullanıcılarının kendi belirlediği tarih/zaman aralıklarıyla belirli bir program veya program gruplarını otomatik olarak çalıştıran uygulama.

Webcron ise kısaca bu işi internet üzerinde kendi belirlediğiniz URL'leri yine kendi belirlediğiniz tarih/zaman aralıklarıyla çağıran uygulama/site. Şu site tam anlamıyla webcron işi yapıyor. Hesap başına en fazla günde bir kere çalışan 3 webcron'a kadar limit veriyor ve url istek raporları rss olarak alınabiliyor. Peki bütün bunlar ne işe yarıyor?

Daha çok site sahiplerini ilgilendirecek olan bu webcron ile günlük yedeğinizi alan, (onaysız kullanıcılar gibi) geçici verilerinizi temizleyen ya da başka bir yerlerden (döviz oranları gibi) günlük bilgi toplayan tüm işlemlerinizi web sitenizin tek bir adresinde birleştirerek bu adresi atıyorum her sabah saat 6'da çağırılması için webcron'a ekleyebilirsiniz. Aslında kullanım alanı ihtiyaçlardan öte biraz da sizin hayal gücünüze kalıyor.
Bu yazı umutsirin 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