bildirgec.org - BLUEBBIRD - beğendikleri

adım adım feed burner

BLUEBBIRD — Sat, 14 May 2011 08:14:00 GMT

feed burner'a derin bir giriş yapalım ve nasıl çalıştığını öğrenerek ne amaçla da kullanabileceğimize bir bakalım.

feed burner

feed burner google tarafından satın alınıp ücretsiz olarak internet kullanıcılarının hizmetine sunulan bir servisdir. daha çok webmaster aracı oalrak da anılır.

üye olmak:

öncelikle google hesabına ihtiyacınız var. şu adresten giriş yapabilirsiniz. “burn a feed right this instant. type your blog or feed address here:” yazısı karşınızda belirecektir.

feed burner

yazı giriş kutusuna sitenizin feed adresini girerek sitenizi bu sisteme kayıt edebilirsiniz. www.siteadi.com/feed gibi. "next" tuşuna basınız ve sonraki adıma geçiniz.

feed burner

açılan sayfaya sitenizi hatırlatıcı bir başlık yazabilirsiniz. title bu sisteme giriş yapınca listelenen isimdir. adres ise feedburner.com/adres şeklnde bu servisin adresinden sonra sizin sitenizin adıdır. next diyerek devam ediyoruz.

tebrik mesajı ekranı gelir. sizin için oluşturulan link gösterilir.

feed burner

next e tıklayarak devam ediyoruz. bazı bilgiler gösterilir ama başlangıç seviyesi için gerek yok yine bir sonraki adıma geçebilriz.

size sunulan ek seçenekleri işaretleyerek fazladan istatistik bilgisine de sahip olma imkanınız var.

şu an itibariyle kayıt işlemi bitmiştir. malesef tr dil desteği yok. şimdi bu sistemdeki bazı bölümleri anlatalım:

eadline animator: sitenizdeki konu başlıklarını çevirir.

buzzboost: iframe ile beslmelerinizi başka sitelerde göstermeye yarar.

springwidgets skin: flash ile rss okumak için

pingshot: yeni giriş yaptığınızda sunucuları haberdar eder.

feedcount: eklediğiniz sitenizin rss akışına kaç kişinin abone olduğunu gösterir.

feed burner kodunu siteye ekleme:

bu kod ile sitenize gelen insanların mail adreslerini alabilirsiniz. takipçi sayısı gibi bilgileri de ekleyebilirsiniz. önce abonelik kodlarına baklaım:

sisteme giriş yapın ve kullanacağınız siteyi seçin. publicize sekmesine gelin. sol menüden email subscriptions menüsünü açın. activate butonuna tılayın. işte kodunuz karşınızda. bu kodu sitenizde istediğiniz yerde kullanabilrsiniz.

popüler yazılarım:

adım adım google analytics

adım adım google docs

evinizden tv kanalı kurun

12 faydası bol wordpress eklentisi

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

GMail İpuçları

BLUEBBIRD — Wed, 21 May 2008 15:05:00 GMT

Gmail

Google'ın e-Posta servisi GMail i bilmeyen yoktur. Gmail'in pek bilinmeyen bir kaç özelliğinden bahsedeceğim.

1- GoogleMail.com: Örneğin bildirgec@gmail.com olan e-posta adresimize, bildirgec@googlemail.com olarakda erişebilir, bildirgec@googlemail.com adresine gönderilen bütün postalara ulaşabiliriz.
2- Noktalı Gmail: Gmail kullananlar rastlamış olabilirler örneğin bildirgec@gmail.com adresiniz varsa bil.dirgec@gmail.com adresine gönderilmiş bir e-posta size ulaşmış olabiliyor. Bu bir hatadan ziyade Gmail in güzide bir servisi. Epostanızın içinde nokta bulunduran varyasyonları size yönlendirilecek. Şöyle ki:
bild.irgec@gmail.com
bi.ldirgec@gmail.com
bildir.gec@gmail.com
bil.dir.gec@gmail.com gibi..
3- Açıklamalı ePosta: Şimdi en heyecan verici bölüm. Yine bildirgec@gmail.com olan e-posta adresimizi çeşitli forum ve sitelere üye olurken kullandığımızda siteyi belirten notlar ekleyebiliriz. Şöyleki;
bildirgec+pilli@gmail.com
bildirgec+facebook@gmail.com
bildirgec+abcforumu@gmail.com
bu adreslere gönderilen postalar yine bize ulaşmakla birlikte bu adreslere "Etiket" ekleyebilir, direkt "Spam" klasörüne gönderilmesini sağlayabiliriz. Böylelikle gönül rahatlığıyla e-posta adresimizi kullanabiliriz.

Kaynaklar:

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

Flip! ile Muhteşem Slaytlar

BLUEBBIRD — Wed, 12 May 2010 06:45:00 GMT

Birçok interaktif web projesinde kullanabileceğiniz Flip! ile farklı görsel efektler ile kullanıcılarınızı etkileyebilirsiniz. Bu jQuery uygulaması içerisinde bulunan 5 farklı efekti birçok web projesinde kullanabilirsiniz.

MIT/GPL lisanslı bu uygulama, Adobe tarafından yapılan flash eklentisine gerek kalmadan benzer efektleri web sitenizde yayınlamanıza olanak verir. Sıradışı geçiş efektleri ile farklı menüler, slaytlar yapabilir veya çeşitli uygulamalar yaparak kullanıcılarınızın dikkatini çekebilirsiniz.

Kişiselleştirilebilmesi sayesinde efektleri, arka plan ve geçiş renklerini, geçiş hızını ve buna benzer birçok özelliği değiştirebilirsiniz. Birçok web uygulamasında kullanabileceğiniz Flip!, Firefox, Chrome/Chromium, Opera, Safari ve Internet Explorer (6,7,8) ile uyumludur.Ayrıca sadece 11.7 kb. boyutundadır.

Flip'in keni sayfasına ulaşmak için burayı demo sayfası için burayı tıklayabilir veya buradan indirebilirsiniz.Flip ile yapılan farklı bir uygulama olan Sponsor Flip Wall With jQuery & CSS'e ulaşmak için buraya bakabilir veya demosuna buradan ulaşabilirsiniz.

Ayrıca Bakınız ;

angelsdemos: Blog | FriendFeed | Twitter | Email | RSS

Kaynak : smashup lab

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

Muhteşem bir Tooltip Uygulaması: Colortip

BLUEBBIRD — Fri, 16 Jul 2010 06:57:00 GMT

Colortip, jQuery tabanlı hazırlanmış basit bir tooltip uygulamasıdır. Metinlerinizin herhangi bir bölümüne ekleyebileceğiniz küçük baloncuklar yanlızca o bölümün üzerine gelindiğinde ortaya çıkar ve sizin vermek istediğiniz kısa bilgiyi içerir.

Web sitenizin içeriğine göre renk ayarını değiştirebileceğiniz bu uygulama ile metinlerinize küçük hatırlatıcılar, ekstra bilgiler yerleştirebilirsiniz. İçeriğinde 6 farklı renkli tema bulunan bu uygulamayı değiştirerek farklı renk tonları ile çalışabilirsiniz.

Metinlere ekstra olarak imaj dosyalarında veya linklerinize'de ekleyebileceğiniz bu tooltip'ler yardımı ile linklerinize veya imajlarınıza açıklayıcı metinler ekleyebilirsiniz.Ayrıca hafif geçiş efekti ile birden kaybolmayarak hoş bir izlenim uyandırır.

Oldukça kolay kullanımlı ve basit tasarımlı bir jQuery tooltip uygulaması olan Colortip'i buradan indirebilir veya buradan demo sayfasına bakabilirsiniz.Ayrıntılı dökümanı için bu sayfaya göz atabilirsiniz.

Ayrıca Bakınız ;

angelsdemos: Blog | FriendFeed | Twitter | Email | RSS

Kaynak : tutorialzine

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

Mailleriniz+Sosyal Ağlarınız= INBOX2

BLUEBBIRD — Mon, 18 Oct 2010 09:25:00 GMT

Yazılarımı takip edenler bilir. Ben tek bir şey ile birden fazla şeyi halletmeyi çok severim. Hem daha işlevsel, hem de zamandan tasarruf. Bugün yine sizlere bu anlamda çok işlevsel bir program tanıtacağım. Inbox2

Her gün kalktığınızda klasik işlerinizi hallettikten sonra evinizde veya ofisinizde şu sırayı takip etmeniz yüksek olasılıklı: Önce e-maillerinize bakıyorsunuz, facebook, twitter gibi sosyal paylaşım sitelerini kontrol ediyorsunuz ve sonunda google readerınıza şöyle bir göz atıyorsunuz.

Peki sizlere şunu desem: Bütün bunları tek bir programdan kontrol edebilirsiniz!

Inbox2 Nedir?

Aşağıdaki video aslında her şeyi açıklıyor. Ama kısaca bir tanımlama yapmak gerekirse inbox2 bir e-mail programı. Size bütün e-maillerinizi ve sosyal paylaşım sitelerinizi tek yerden kontrol etme imkanı verir.

Inbox2 Nasıl Çalışır?

Inbox2'yi yükleyip kurduktan sonra açılış sayfası yukarıdaki şekilde. Görüldüğü üzere hotmail, gmail, yahoo, facebook, twitter... gibi siteleri destekliyor.

Programda bütün bu desteklenen siteleri tek bir yerden yönetme imkanınız var. Yukarıda bir e-mail hesabını açık olarak görüyorsunuz.

Gelen e-maillerinize bakarken, bir e-maili daha sonra yapılacaklar listenize ekleyebilirsiniz. Ayıca herhangi bir zamanda yapılacaklar ve bekleyenler olarak iki listeniz daha var. öte yandan kendiniz de etiketler belirleyebilir ve listeler oluşturabilirsiniz.

Program e-maillerinizde bulunan dökümanları da ayrı bir sekmede listeliyor. Böylece mailler içinde kaybolmanıza gerek kalmıyor. Aynı durum resimler için de geçerli.

Program diğer imap ve pop3 hesaplarınızı da destekliyor. Desteklenenler sayfasında other (diğer) seçeneğinden imap ve pop3 hesabınızı ekleyebilirsiniz.

Sosyal Ağlar

Program önceden de belirttiğimiz gibi sosyal ağlarla da etkileşimli. Facebook, twitter gibi sosyal ağlarınızı programa entegre edebilirsiniz.

Sonuç olarak programa bir deneme şansı vermenizi tavsiye ederim. Görsellik ve işlevsellik açısından güzel bir program. Sürdürülebilir bir proje. Ancak mutlaka programa ek bir takım özellikler konulmalı ve desteklenen siteler artırılmalı diye düşünüyorum. ayrıca bir de Türkçe dil desteği fena olmazdı!

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

Tarayıcınızda Bulunması Gereken 10 Eklenti

BLUEBBIRD — Wed, 10 Nov 2010 13:00:00 GMT

10. Web of Trust (WOT)

Web of Trust veya kısaca WOT, daha güvenli bir gezinti için oluşturulmuş tarayıcı eklentisi. Örneğin google'dan bir arama yaptınız diyelim. WOT, her arama sonucunun yanına renkli dairelerle sitenin güvenirliğini gösteriyor. Yeşil sitenin güvenilir olduğunu, sarı dikkatli olmanız gerektiğini, kırmızı ise bu siteden uzak durmanız gerektiğini gösteriyor. Bu renki daireleri tıkladığınızda siteye ilişkin değişik kategorilerdeki bilgileri görüyorsunuz.
Örneğin bir siteden alışveriş yapacaksınız, site hakkında bilgiye sahip değilsiniz, o zaman diğer WOT kullanıcılarının siteye verdiği puanı görebilirsiniz.

WOT firefox, opera, chrome ve internet explorer uyumlu.

9. Google Translate

Web çeviri siteleri zaten vardı ancak bunlar bilmediğiniz bir dildeki siteleri çevirdiği zaman gerçekten yararlı oluyor. Örneğin italyanca bir siteye girdiniz, bilgi almak niyetindesiniz ama italyanca bilmiyorsunuz, siteyi bildiğiniz bir dile çevirip gereken bilgileri alabilirsiniz.

Firefox için buradan, Safari için buradan, opera için de buradan eklentiyi indirebilirsiniz.

8. AutoCopy
Autocopy, isminden de anlaşılığı üzere otomatik kopyalama yapıyor. Yani bir yazıyı CTRL+c yaparak kopyalamak yerine onu seçtiğinizde direkt panoya yazıyı kopyalayarak size ctrl+c yapmadan kopyalama imkanı sağlıyor.

Chrome için buradan, Firefox için buradan indirebilirsiniz.

7. Better Gmail
Better Gmail, gmailinizi düzenlemek için geliştilmiş bir eklenti. Gmail'de olmayan bir takım özellikler yüklüyor. Bunlar: hiyararşik etiket sistemi, sekmenizde gösterilecek okunmamış mesaj sayısı, dosya ataçlama ikonu, her şeyi gizleme/gösterme yeteneği gibi.

Chrome için buradan, firefox için buradan indirebilirsiniz.

6. PriceBlink

İnternetten alışveriş yapıyorsanız, mümkün olan en düşük fiyatı bulmaya çalışanlardansanız bu eklenti çok işinize yarayacak.

Chrome için buradan, Firefox için buradan, Safari için buradan indirebilirsiniz.

5. BugMeNot

Bazen bir şeyler araştırırken "hah buldum" dersiniz ve siteye girdiğinizde karşınıza üye ol yazısı çıktığında gerçekten sinirlenebilirsiniz. Bugmenot bu sorununuzu ortadan kaldırıyor ve hazır hesaplarla siteye girmenizi sağlıyor.

Chrome için buradan, firefox için buradan, opera için buradan, safari için buradan indirebilirsiniz.

4. Tab Cloud

Bu eklenti tarayıcı sekmelerinize sadece 1 değil, birden fazla bilgisayarda da görmenizi sağlıyor. Mesela evde bir konu üzerinde araştırma yaparken acilen işiniz çıktı ve sekmelerinizi kapatmak istemiyorsunuz, ama kapatmak zorunda kalıyorsunuz. Bu eklentiyle bu sekmeleri kaydediyorsunuz ve daha sonra tekrar kullanma şansına erişiyorsunuz. hem de İstediğiniz bilgisayardan.

Chrome için buradan, firefox için buradan indirebilirsiniz.

3. Flashblock

Son araştırmalara göre, flash dosyalarını kapattığınızda bir Mac Air pilinizden iki saat daha fazla yararlanıyorsunuz.

Eğer flashları çok kullanmıyor veya laptopta flashsız çalışarak daha fazla zaman kazanmak istiyorsanız bu eklentiyi indirebilirsiniz.

Chrome için buradan, firefox için buradan, opera için buradan indirebilirsiniz.

2. Greasemonkey / Greasemetal / Ve diğerleri

Daha önceki yazılarımda da bu eklentinin ürünlerinden bahsetmiştim. Bir site ile ilgili kendi isteğiniz doğrultusunda düzenleme yaparak, kendinizce daha işlevsel bir site elde edebiliyorsunuz. Bu eklenti onlarca alt-eklenti (script) ile sizlere değişik olanaklar sunuyor. Mesela, facebook'taki renkleri değiştirebilmeniz için tasarlanmış bir script var.

Firefox için buradan, safari için buradan indirebilirsiniz.

1. LastPass

Bu eklenti otomatik olarak şifrelerinizi saklıyor ve yine otomatik olarak sitelere giriş yapıyor. Böylece her seferinde sitelere giriş için parola-kullanıcı adı girmenize gerek kalmıyor. Hepsi tek bir tıkla halloluyor!

İndirmek için buraya tıklayın.

Yazı orijinalinden çevrilmiştir.

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

8 yeni site keşfedelim

BLUEBBIRD — Thu, 30 Sep 2010 12:36:00 GMT

1 - morphases: robot resim çizmeyi sevenleri eğlenceli vakitler bekliyor. üye olmanıza gerek yok. robot resimler oluşturmaya hemen başlayın. göz, kaş, burun, ağız, kulak, saç sakal aklına gelen tüm detayları değiştirebiliyorsunuz.

2 - karaokeparty: karaoke yapmak bazen çok eğlenceli olabiliyor. ses kalitesi çok iyi. ekstradan sadece bir mikrofona ihtiyacınız var.

3 - text-image: internette yapıcak bir şey bulamayanlara deva, çok hoş ve bir o kadar da ilginç bir uygulama. kendi resimlerinize bir de bu açıdan bakın. bu site ile fotoğraflarımızı harflere çeviriyoruz, tıpkı matrix filmindeki gibi.

4 - picassohead: evet işte karşımızda picasso'nun kafası. hiç resim yapma yeteneğiniz olmasa bile bu siteyi ziyaret ediniz. burada kendi çalışmalarınızı yapıp altına da imzanızı atabilirsiniz.

5 - bcheck: internet tarayıcıları üzerinten bilgisayarınıza sızma saldırıları çok olur. bazen sızarlar haberiniz bile olmaz. bu site tarayıcınızı bir güzel güvenlik testinden geçirip hangi açıkların olduğunu ve hangi yamaları yüklemeniz gerektiğini söylüyor.

6 - copyscape: internette websitenizin içeriğinin çalınıp çalınmadığını kontrol etmek kolay bir iş değildir, çok zaman ayırmak gerekir. tanıtacağım site bu işi kendine amaç edinmiş, üstelik ücretsiz olarak yapıyor ve çok kısa bir sürede sonuç üretiyor.

7 - koolim: en popüler anında mesajlaşma yazılımlarını bu site üzerinden web tabanlı olarak çalıştırabilirsiniz. üstelik birden fazla servisi aynı anda çalıştırmanız da mümkün.

8 - convert-ringtones: bu sitemiz yaklaşık 3000 adet cep telefonu modelini ve 20'den fazla cep telefonu melodi formatını destekliyor.

yazılarımdan bazıları:

sexybookmarks gravatar paypal picnik türkiye.gov.tr

bedava gmail'de iptal kısa adresler premium temalar

masaüstünüz internette

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

Google'dan Memeo

BLUEBBIRD — Wed, 27 Jan 2010 10:27:00 GMT

Google, Microsoft Office'e rakip olarak yeni masaüstü aracını duyurdu; Memeo Connect. Memeo, Google Docs kullanıcılarına dökümanlarını masaüstünde yönetme ve eşitleme imkanı veriyor.

Memeo; dosya paylaşımı, dosya yedekleme ve dosya yedekleme konularında birçok uygulama sunuyor. Memeo Connect sadece premium hesabı olan Google Docs kullanıcıları tarafından kullanılabiliyor. Hizmet, Microsoft office'i web tabanlı olarak arayanlara hitap ediyor.

Google'ın ürün yöneticisi Matthew Glotzbach, 3000 firmanın Google uygulamaları için başvuruda bulunduğunu açıkladı.Glotzbach'a göre tüm bu firmalar Google Docs'daki verileri bilgisayarlarındaki verileri ve dökümanlar ile eşitleyip düzenlemek istiyor.

Memeo ile belgelerinizi düzenleyebilir Google Docs'dan bilgisayarınıza veya bilgisayarınızdan google docs'a belgelerinizi aktarabilirisiniz. Belgelerinizi Backup uygulaması sayesinde yedekleyip daha sonra geri yükleyebilirisiniz. Fotoğraf ve videolarınızı istediğiniz kişlerler paylaşabilirisiniz. Dilerseniz mobil sürümünü kullanamabilirsiniz. Memeo kullanmak için senelik 9$ ödemeniz gerekiyor. Daha ayrıntılı bilgi için Memeo'nun sitesine bakabilirsiniz.

Ayrıca Bakınız ;

angelsdemos: Blog | Twitter | Email | RSS

Kaynak ; memeo , pcworld

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

Blog tasarımı nasıl yapılır?

BLUEBBIRD — Tue, 01 Feb 2011 09:08:00 GMT

Blogdesingblog.com blog tasarlerken dikkat edilmesi gereken noktaları 9 parçaya ayırarak anlatıyor. Bu başlıkların Türkçe karşılıklarından çok genellikle İngilizce adlarına yatkın olunduğu için İngilizce adlarını da beraber vermek bu anlatım için daha yararlı olacaktır.
Bu dokuz alt başlık şöyle.

Başlık (Header)
İçerik Alanı (Content Area)
Birincil yönlendirici (primary navigation)
İkincil yönlendirici(secondary navigation)
Manşetler (Headlines)
Yorumlar (Comments)
Makale Sonu (Post’s Footer)
Sayfa Altı (Footer)
Reklamlar (Advertisements)

HEADER - başlık

Başlık ziyaretçilerin siteye girişlerinde karşılaştıkları ilk bölge olduğu için sitenin en önemli kısımlarından biridir. blogu diğer bloglardan ayırabilecek ve öne çıkarabilecek bir yapıda olduğu için üzerinde önemle durulması gerekir. Başlık benzersiz ve hatırlaması kolay olmalıdır. Bu yüzden blog tasarımcıları başlık üzerinde son derece titiz çalışırlar, öyle ki sadece hazır bir tasarımı kullanan bloggerlar dahi başlık kısmını kendilerine uyarlamaya çalışırlar. Blog başlığı tasarımını populer kılmak için Vinh Le'nin kaleme aldığı şu makaleye göz gezdirmekte fayda var.

not: 2008 yılında yayınlamış bir makale olmasından dolayı verilen örneklerden bazılarında tasarımlar değişmiş. Ancak bu makalenin orjinalinin yayınlandığı siteye giderek orada kaydedilmiş olan örnekleri inceleyebilirsiniz.

Birkaç mükemmel header örneği

1.Octwelve

octwelve

octwelve header da bir çizgi karakterin kullanıldığı iyi bir örnek.

2.Cult-foo

cult fo

cult foo header köşelerindeki başarılı tasarımıyla dikkat çekiyor.

3.darkmotion

darkmotion

darkmotion'un header tasarımı kullanıca eğlenceli görünüyor ve kullanıcıyı siteye çekiyor.

Header nasıl tasarlanmalı?

Blog tasarımına öncelikle header'dan başlayın. Photoshop'da tasarımı yapmadan önce header içerisinde vermek istediğiniz mesaj, site ismi ve slogan gibi metinlere önceden karar verin.
Header tasarlamanın pek çok yolu olmakla birlikte tasarım yapılırken dikkat edilmesi gereken en önemli noktalardan biri sitenin geri kalanıyla ve konusuyla ilgili olmasıdır. Header siteye ilk kez giren ziyaretçiye bile olabildiğince çabuk bir şekilde sitenin amacını aktarabilmelidir.
Yaratıcı olun ve farklı tasarımlar denemekten korkmayın. ilk kez denenmiş benzersiz bir tasarım her zaman ziyaretçiler tarafından hatırlanabilir.

Content Area - içerik alanı

Content area içeriği taşıyan bölgedir. Bu sebeple bloğu ziyaret eden kullanıcıların en çok zaman harcayacakları yer de burasıdır. bu bölge ziyaretçilerin dikkatini dağıtacak tüm unsurlardan arındırılmış olmalı, içerisinde barındırdığı metinler son derece okunaklı ve gözü yormayacak olacak şekilde yerleştirilmelidir. Bu yüzden içerik alanında sadelik önemlidir.

Harika içerik alanlarından örnekler

1.Simplebits

simplebits

simplebits okuması son derece kolay ve linklerin olduğu bölgeler yeteri kadar belirginleştirilmiş.

2.We love wp

we love wp

Karanlık temalardaki en büyük sorunlardan biri yazıların okunabilir kılınmasındaki zorluktur. Ancak we love wp bu sorunun üstesinden gelmiş.

3.we break stuff

we break stuff

Renk kombinasyonu başarılı. Linklerin altlarını noktalarla çizme fikri güzel.

Başarılı içerik alanı nasıl tasarlanır?

Hiyerarşiye dikkat edilmeli. Vurgular başlık, metin ve geri kalan ögelere doğru azalarak inmeli. Örneğin her zaman başlıklar metinden daha vurgulu ifade edilmeli.

İçerikler aktarılan konular açısından birbirine yakın olmalı. Okuyucu bir içerikle ilgileniyorsa yakınlarda o konuyla ilgili başka içerikleri de görebilmeli.

Linkler yeteri kadar belirgin olmalı ancak okuyucunun dikkatini dağıtmayacak kadar da tasarımla bütünleşmeli.

Primary Navigation - Birincil Yönlendirici

Bu yönlendirici ziyaretçileri blogun farklı bölümlerine yönlendirmek için kullanılır. Genellikle header'ın üstünde bulunur. Orada olması gerekmez ancak çoğu ziyaretçi bu yönlendiricinin orada olmasını bekler ve buna ihtiyaç duyar.

Mükemmel Primary Navigation örnekleri

1.A list a part

a list a part

a list a part doğru tasarlanmış navigasyon menüsü için oldukça iyi bir aday.

2.Mindtwitch

mindtwitch

mindtwitch doku kullanarak navigasyonu öne çıkarma üzerine oldukça iyi bir örnek.

3.Jogger

jogger

jogger'in navigasyon menüsü oldukça basit ve sade fakat tasarım içerisine oldukça iyi adapte edilmiş.

Mükemmel bir primary navigation nasıl tasarlanır?

Navigasyon linklerini olabildiğince az tutun. 6-7 linki aşmamasını öneririm.
primary navigation linkleri için blog tasarımında biraz geniş bir alan sağlayın. Bu linklerin her sayfada görünmesi gerekmiyorsa görünmemesi gereken sayfalarda linkleri secondary navigation bölgesinde vermeyi göz önünde bulundurun.
Hakkında ve İletişim linkleri genellikle primary navigation bölgesinde bulunur. Diğer linkler tasarımın nasıl yapıldığına ve kullanıcıya ne verilmek istendiğine göre değişir.

Secondary Navigation - ikincil yönlendirici

İkincil yönlendiriciler ziyaretçilerin bloğun diğer kısımlarına kolayca erişebilmesi için kullanılır. Genellikle bu linkler sidebar (yan sütun)'da verilir.
Birincil yönlendiricinin içermediği linkler bu bölümde sergilenir. Örneğin popüler makaleler, sayfalar, son yorumlar gibi. Siteyi ziyaret eden kullanıcıların kolayca erişmesi istenen kısımlara bağlantı sağlar.

Mükemmel secondary navigation örnekleri

1.elitistsnob

elitistsnob

temiz tasarımı sayesinde elitistsnob'un navigasyon menülerini okumak çok kolay.

2.Manclub

manclub

navigasyon menüsü içerik alanının arkasından kayarak çıkıyor ve tüm bölümler rahatlıkla ayırt edilebiliyor.

3.desingdisease

desingdisease

desingdisease turuncu rengin farkı tonlarını navigasyon menüsünde farklı bölgeleri ayırmak için kullanıyor.

Mükemmel second navigation bölümü nasıl tasarlanır?

Primary navigation da olduğu gibi burada da olabildiğince az link verilmesi yararlı olacaktır.
farklı linkler için secondary navigation alanını bölün. Bu algılamayı ve kullanımı kolaylaştıracaktır.
Secondary navigation alanını karmakarışık yapmayın. Okuyucu için gerçekten gereken nesneler hariç ne varsa çıkarın. Takvim güzel görünebilir ancak gerçekten işlevsel bir amacı yoksa (örneğin rezervasyon tarihi belirleme gibi) hiçbir okuyucunun buna ihtiyacı yoktur.

Headlines - manşetler
Manşetler kullanıcının dikkatini ilgili blog yazılarına çekmek için kullanılır. Yazarın ziyaretçiyi diğer blog yazılarından alıp ilgili yazıya yönlendirmek için kullandığı yöntemlerden biridir. Bu yüzden manşetler belirgin yapıda olmalıdır. Bunu yapmanın pek çok farklı yaratıcı yolu var.

Mükemmel manşet örnekleri

1.Henry Jones

henry jones

Henry sade tasarımı ve manşetleriyle kullanıcın ilgisini manşete çekebiliyor. ayrıca sevimli ikonlar kullanarak tarih ve yorum bölümüne de dikkat edilmesini sağlamış.

2. I love typography

i love typograpy

Bu font ve renkleri kullanarak nasıl ilgi çekici bir manşet yaratabileceğinizi gösteren mükemmel bir örnek.

3.blogsolid

blog solid

Blog solid başlık kenarında garip bir tasarım kullanarak kullanıcın ilgisini başlığa çekiyor.

Manşetler nasıl dikkat çekici yapılır?

Bunu yapmanın en kolay yolu manşet renklerini ana metin renginden farklı seçmektir. İçerik ve manşet için farklı fontlar kullanılabilir. Genellikle manşetler için serif fontlar ve içerik için non-serif fontlar kullanılır.

Daha büyük puntolar kullanmak manşetleri belirginleştirir. içerikle aynı büyüklükte fontlar içerikle manşetin ayırt edilmesini zorlaştırır. Manşet puntoları içerik puntosundan büyük olmalıdır.

Manşetleri belirginleştirmek için kullanılabilecek bir başka yol makale gönderim tarihi gibi bilgileri manşetin dışında bırakmaktır. (Bu makalenin orjinalinin bulunduğu blog bunu kullanmaktadır)

Comments - yorumlar

Yorum sekmesi blog içerisindeki iletişimi güçlendirmek için oldukça önemli yer tutar. Yorum kenarlarına numara vermek. Yorumcuların birbirlerini kolayca tanımlamalarını sağlar.
Yazarın yorumlarını daha belirgin yapmak bir ziyaretçiye yazarın yorumlarını sayfa içinde hızla ararken kolaylık tanıyacaktır.

Mükemmel yorum sekmesi tasarım örnekleri

1.Chris Shifflet

chris shifflet

Chris'in yorum alanını okumak oldukça kolay. Sade tasarımı ve yazarla yorumunu farklı bölümlere ayırması ilgi çekici.

2.Darkmotion

darkmotion

Yazar bilgilerinin ayrı tutulması oldukça hoş. Ayrıca yorum alanları da birbirinden ayrı görünüyor. Genel olarak sanki birisiyle sohbet halindeymiş gibi bir izlenim uyandırıyor.

3.Blog Desing Blog

blog desing blog

(Bu makalenin orjinalinin yer aldığı bloga ait olan yorum paneli. Makale yazarı ziyaretçilerinden oldukça olumlu eleştiriler aldığı için kendi bloğunun yorum bölümünü de makalesine eklemiş)

Mükemmel yorum bölümü tasarımı nasıl yapılır?

Yorumları birbirinden ve ana alandan ayırmanın en kolay yolu tasarımı alt alta gelen yorumları farklı renklerde olacak şekilde yapmaktır.
Yazarın yorumlarının diğer ziyaretçilerin yorumlarından daha belirgin kılınması faydalı olacaktır. Ancak bu yapılırken bütünlüğü bozacak kadar belirginleştirme yapmak da negatif yönde etki edecektir. Renklerde küçük değişiklikler bu belirginleştirme işi için ideal olacaktır.
İsim, tarih gibi bilgileri esas yorum metninden ayırmak ziyaretçilerin yorumları gözleriyle hızla tararken rahat etmesini sağlayacaktır. Böylece istediklerini daha hızlı bir şekilde bulabilirler.

Post's footer - içerik sonu

post's footer bölgesi içerikten sonra yorum bölümü başlamadan önce ziyaretçilere bir takım refereans linkler verebileceğeniz bir bölgedir. Bu bölüm gülünç bir şekilde sıklıkla tasarımcılar tarafından atlanır. Aslında oldukça kıymetlidir. Ziyaretçilerin içeriği okuduktan sonra dikkatini diğer önemli makalelere çekmesi için bir şans verir.
İnsanlar bloglarında diğer elementlerin dizaynı için oldukça zaman harcarlar ancak sıra page's footer a geldiğinde şablon temanınkine benzer sıradan bir dizayn hazırlayıp geçerler. Bu yeterli olmaz.

Mükemmel post's footer örnekleri

1.Freelanceswitch

freelanceswitch

Oldukça keskin, temiz ve okuyucunun dikkatini okuyucu içeriği okuduktan sonra nazikçe burada sergilenen linklere çekiyor.

2.PSDTuts

psdtuts

okuyucaların oylayabilecekleri ve eğer makaleyi beğendilerse paylaşım ağlarına gönderebilecekleri linklerin mevcut olduğu bir post's footer tasarlanmış. Farklı renk kombinasyonu kullanılarak kullanıcının dikkati içeriği okuduktan sonra buraya kaydırılıyor.

3.Standarts of Life

standarts of life

Oldukça temiz bir post's footer bölgesine sahipler. Benzeri makalelere verilen linklerin bulunduğu bölgede linkleri birbirinden ayırmak için alt alta gelen linklerin arkası farklı renklerde tasarlanmış.

Mükemmel post's footer nasıl tasarlanır?

Footer's post içeriğin sergilendiği bölümden kesin bir farklılıkla ayrılmalı. Okuyucu bunun içeğe ait olmadığını, ona yardımcı olmak için sayfaya eklenmiş olduğunu ilk görüşte anlayabilmeli. Bunun için farklı bir arkaplan rengi kullanmak farklılığı yaratabilmek için ideal yollardan birisidir.
Tasarıma başlamadan önce post's footer bölümünde ne istediğinize karar verin. Böylece bu bölgenin çöplük haline gelmesini önlemiş olursunuz ayrıca tasarımınız da daha hoş görünür.
Post's footer a koyabileceğiniz en iyi içeriklerden biri "benzer sayfalar" linkleridir. bu okuyucuya ilgilendiği konuyla ilgili daha çok makaleye kolayca ulaşma imkanı sağlar. Kullacının blogda sıkılmadan daha fazla vakit geçirmesi için önemlidir.

Footer - taban

Pek çok insan footer'ı sadece klasik telif hakkı yazısı için kullanır. Ancak footer sidebar'ı dolup taşırmadan fazladan link verebileceğiniz önemli bir alandır. daha çok secondary navigation linki burada tutulabilir. Ziyaretçiler makaleyi bitirip sayfanın altına indiklerinde sayfa sonuyla karşılaşacaklar. Burası aslında onları blogdaki diğer makalelere yönlendirmek için verimli bir alan olabilir. Buradaki secondary navigation linklerinde popüler makaleler, son makaleler, öne çıkan makaleler gibi farklı dallarda linkler vererek ziyaretçileri sitede yayınlanan diğer ilginç içeriklere gönderebilirsiniz.

Mükemmel footer tasarımlarına örnekler

1.Desingshack

desingshack

Sidebar kullanmadan secondary navigation linklerini footera aktarmayı denemişler. İncelenebilir.

2.Web Desingner Wall

webdesingnerwall

Nick sanırım header tasarımına harcıdığı zaman kadar footer da zaman ayırmış. Footer tasarımındaki detaylar dikkat çekici.

3.Chriss Shiflett

Chriss Shiflet

Gerçekten temiz ve işlevsel bir footer için iyi bir örnek. Tam olarak yapması gerekeni yapıyor.

Mükemmel footer tasarımı nasıl yapılır?

Footer'ı tasarımın geri kalanına biraz daha karşıt şekilde tasarlayın. Bu kullanıcının footer bölümüne geldiğini ve sayfanın sonuna yaklaştığını hissettirir.

Okuyucuların gerçekten nelerden hoşlanacağını tahmin ederek okuyucaları o konulara yönlendirmeye çalışın. Burayı gereksiz bilgilerle doldurmak okuyuculara yardımcı olmaz.
Basit ve kullanışlı olmayı burada da sürdürün. Kullanıcıların kolayca algılayabileceği şekilde tasarlayın.

Advertisement - reklam

reklamlar pek çok blogger için oldukça önemlidir. Ancak reklamlar çoğu zaman sayfanın korkuç gözükmesine yol açar ve bu kullanıcıların içeriği okuyamamasıyla sonuçlanabilir. Bir süre sonra kullanıcılar sitenizi ziyeret etmeyi bırakacaklardır.
Eğer reklamları doğru şekilde yerleştirmeyi başarır ve makaleyi reklamdan daha önde tutmanın yolunu bulursanız bu sorunu ortadan kaldırabilirsiniz. Sitenizi ziyaret etmeye devam eden kullanıcılar da böylece daha çok para kazanmanızı sağlar.

Mükemmel reklam bölümü tasarım örnekleri

1.Copyblogger

copyblogger

copyblogger 125*125 boyutlarında oldukça büyük bir banner ı sayfasının üstüne yerleştirmiş fakat sponsorlarımız bölümü altında ve içeriğe dahil olmadığı kolayca ayırt edilecek şekilde konumlandırmış. İçeriği okumada her hangi bir sıkıntı yaratmıyor.

2.webdesingerwall

webdesingerwall

webdesingerwall standart bir reklam görüntülemiyor. Ayrıca bunu içeriğin yanına eklemiş. ancak içerikle arasında bir ayıraç kullanarak bu reklamın içeriğe dahil olmadığını fark ettiriyor. böylece kullanıcıyı rahatsız etmemeyi amaçlamış.

3.problogger

problogger

problogger kendi logosu yanında standar bir reklam banner'ı kullanıyor. Ancak bu hem logosunun hem de içeriğinin gerisinde kalıyor ve ziyaretçinin dikkatini dağıtmıyor.

Reklam bölümü nasıl tasarlanır?

Eğer blogunuza reklam koymayı düşünüyorsanız, blogunuzun tasarımı daha taslak halindeyken reklamları nereye yerleştireceğinizi tasarlayın. Bu blogunuza daha fazla esneklik kazandıracaktır.
reklam vermekte en popüler yöntemlerden biri 125*125 boyutlarında google adsense bannerlerını kullanmaktır. google adsense pek çok farklı boyutta ve şekilde reklam veriyor olsa da 125*125 pixel boyutlarındaki reklamlar sidebar için uygundur.

Reklam almadan önce reklamların sitede nasıl görüneceğini anlamak için bir kaç reklam örneği bulup bunları siteye ekleyerek deneyebilirsiniz.
Reklamlar görülecek kadar dikkat çekmeli ancak içeriğin önüne geçecek kadar da dikkat toplamamalı. Sidebar reklamları konumlandırmak için en iyi yerlerden birisidir. fakat sidebar'daki navigasyon menülere ulaşımı engellememelidir.

Bol tasarımlı günler...

not: ingilizceden türkçeye çevirileri birebir yapmak yerine yeni cümleler kurdum. Bazı noktalarda ek bilgiler verdim. Bu yüzden bire bir çeviri değildir. Makalenin orijinalini ziyaret ederek orijinali de incelenebilir.

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

Facebook İle İlgili Az Bilinen İpuçları

BLUEBBIRD — Tue, 21 Dec 2010 09:00:00 GMT

Facebook artık birçoğumuzun günlük takip ettiği bir site. Bu yazıda facebook hakkında bir çoğumuzun bilmediği ipuçlarını bulabileceksiniz. Denedikten sonra başarı yüzdesini görmek adına görüşlerinizi paylaşabilirsiniz.

1. Facebook Chat'i Firefox Sidebar'a Yerleştirmek: Facebook chat gerçekten işimize yarayan bir uygulama. facebook'tan çıktığınızda da online arkadaşlarınızla chat yapmak istiyorsanız bu gerçekten işinize yarayacak.
Anlatıma buradan ulaşabilirsiniz.

2. Facebook albümlerini indirme: albümleri tek tıkla indirmek için ihtiyacınız olan tek şey FacePAd Ayrıntılara, kurulum ve anlatıma şu bağlantıdan ulaşabilirsiniz.

3. Flickr Fotolarını Facebook'ta Paylaşmak: Flickr fotoğraflarınızı Flickr2Facebook linkinden facebook'a yükleyebilir ve onları profilinizde paylaşabilirsiniz.

4. Facebook Kullanmadan Facebook Güncelleme: Hellotxt ya da ping.fm facebook kullanıcılarına sayfalarını güncelleme imkanı veriyor.

5. Facebook Mesajlarını Programlama: Sendible facebook kullanıcılarına, ileriki zamanlarda istedikleri kişilere mesaj gönderme olanağı sunuyor.

6. Facebook Durumuzu Firefox'tan Güncelleme: FireStatus ile facebook dahil birçok sosyal network sitesindeki durumunuzu güncelleyebilirsiniz.

7. Facebook Hesabınıza Masaüstünden Ulaşmak: İnternet tarayıcısına gerek kalmadan facebook hesabınıza Seesmic Desktop Facebooker Xobni ve Scrapboy gibi masaüstü uygulamaları ile ulaşabilirsiniz.

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