Posts made in Şubat, 2010
Sıradışı Sosyal Medya İkon Setleri
Her web tasarım blogunun olmazsa olmazı Sosyal Medya İkon Setleri, OZD Tasarım’da da olsun istedim ve nette yayınlanan ikon setlerinden beğendiklerimi bir araya getirerek meraklısı için güzel bir arşiv oluşturdum. Artık neredeyse her web tasarımcının arşivinde olan standart ikon setlerinin aksine sıradışı sosyal medya ikonlarını seçmeye çalıştım.
OZD Tasarım‘da, son yılların internet alışkanlığı olan sosyal medya ortamları ile ilgili makaleler, kaynaklar ve haberlere düzenli olarak yer vermek istiyorum. Umarım bunu aksatmadan yürütmeyi başarabilirim.
Gelelim sosyal medya ikon setlerine…
İndirmek için resimlerin üstüne tıklayın.
Social Sketches İkon Seti
Panda İkon Seti
Old Bottle Crowns İkon Seti
RSS Feed İkon Seti
Sketchy Monster İkon Seti
Twitter İkon Seti
3D Sosyal İkon Seti
Sticker İkon Seti
Gummy Sosyal İkon Seti
Furry Cushions İkon Seti
Iconshock Sosyal İkon Seti
Web Tasarım Kaynakları #1
Web tasarımcıların işlerine başlamadan önce mutlaka elinin altında olması gereken ikon setleri, fontlar, vektörel arayüzler, stok fotolar, photoshop fırçaları, photoshop dokuları, psd dosyaları gibi hazır tasarım kaynakları vardır. Bu kaynaklar web tasarım işine pratiklik katarak hem zamandan hem iş gücünden kazanç sağlar ve tasarımlarınızı zenginleştirerek daha profesyonel bir görünüm kazandırırır.
Her web tasarım blogunun önem verdiği gibi OZD Tasarım da düzenli olarak tasarım kaynakları ile ilgili arşivlik setler yayınlayacak. İşinize yarayacağını umuyorum.
İşte başlıyoruz…
Setleri indirmek için resimlere tıklayın.
1. Nixon İkon Seti
2. 125 x 125 Reklam Alanı PSD Template’leri
3. Vektörel İkon Seti
4. 50 Adet Photoshop Action Paketi
5. Sprey Boya Photoshop Fırça Seti
6. Grunge Doku Paketi
7.Medikal İkon Seti
8. Oat RSS İkon Seti
9. Android Arabirimleri - Vektörel PSD Seti
10. Çizgi Yaratıklar - Sosyal Medya İkon Seti
11. Eski Pul Görünümünde Sosyal Medya İkon Seti
12. Adobe Illustrator Fırça Seti
13. Rubber Font – Yazı Tipi
14. Evilz Yazı Tipi
15. Müzik Photoshop Fırçaları
CSS3 / XHTML Website Template
Tutorialzine tarafından One-Page Website Template adı ile yayınlanan tek sayfalık website şablonu CSS 3 ve Html 5 gibi en son web teknolojisi ve teknikleri ile oluşturuldu. Ancak bütün tarayıcıların Html 5‘i henüz desteklememesinden dolayı aynı sitenin Xhtml versiyonunu da hazırlayıp ücretsiz olarak paylaşıma sundular. One-Page Website Template, Google SEO (Arama Motoru Optimizasyonu), Jquery ile efektli geçişler, bütün tarayıcıların mevcut sürümleriyle uyumluluk ve kolay düzenlenebilir yapısı ve şık tasarımıyla tam bir kullanıcı dostu.
Sade ve Şık Tasarım
Photoshop’ta tasarımı yapılan websitesi, özellikle kişisel portföyünü yayınlamak isteyenlerin işine çok yarayabilecek kullanışlı yapısı ve sade tasarımı ile dikkat çekiyor.
Düzgün CSS 3 / XHTML Yapısı
Websitesinin Html yapısı, modern Web 2.0 kurallarına göre CSS 3 ve xHTML ile hazırlanmış, çok düzgün bir çatıya sahip. Bu yönüyle, websitesini birebir kullanmak istemeyenlerin bile işine yarayabilecek bir kaynak.
Jquery ile Efektli Geçişler
Neredeyse artık her web sitesinde kullanılan javascript kütüphanesi olan jQuery ile hazırlanmış geçiş efekti ile zenginleştirilerek, sitenin çekiciliği artırılmış.
Tercih Sizin!
Bu noktadan sonra tercih size kalıyor. İsterseniz olduğu gibi kişisel web siteniz olarak kullanabilir, isterseniz ileride faydalanmak üzere arşivinize ekleyebilirsiniz.
Önizleme – İndir
Devamını OkuFreelance Çalışanlar Twitter Kullanırken Nelere Dikkat Etmeli?
Buradaki makalede freelance çalışanların neden Twitter kullanması gerektiğini yazmıştım. Devamı niteliğindeki ikinci makalemde ise Twitter kullanmaya başlamadan önce ve kullanırken nelere dikkat etmek gerektiğini anlatmaya çalışacağım. Eğer okumadıysanız, öncesinde ilk Twitter makalemi okumanızı tavsiye ederim: Freelance çalışanlar neden Twitter kullanmalı?
Lafı fazla uzatmadan, freelance çalışanlar için Twitter rehberi olabileceğini düşündüğüm yazıma hemen geçmek istiyorum.
Profil ayarlarınızı doğru yapın
Twitter kullanmaya karar verdiyseniz ilk yapmanız gereken Twitter’a üye olmak ve bir profil oluşturmak. Üye olmak çok basit zaten. Buradaki asıl nokta profil ayarlarınızın ileride size hatalı sonuçlara mal olmayacak şekilde ayarlamak. Bu ayarları aşama aşama anlatmakta fayda var.
Kullanıcı Adı:
Bir kullanıcı adı seçerken dikkat etmeniz gereken en önemli nokta, yaptığınız işlerden sizi tanıyanların hatırlayabileceği, tanımayanların ise kolaylıkla tahmin edebileceği bir kullanıcı adı seçmektir. Kullanıcı adı seçiminde en faydalı çözüm, freelance işlerinizin altına imza olarak attığınız ismi tercih etmek olacaktır. Bu sizin gerçek adınız da olabilir, website adresiniz de. Kısacası yaptığınız işlerin altında hangi ismi kullanıyorsanız Twitter hesabınızı da o isimle açmanız en doğru yoldur. Benim de twitter hesabımın twitter.com/ozdtasarim olması aynı sebepledir.
Bio:
Aslında bu bölüme bir şeyler yazmak kişisel tercihinize kalsa da, şunu bilmelisiniz ki Bio yani hakkınızda bölümüne ne yazarsanız yazın mutlaka okunur. Bu nedenle 160 karakterle sınırlandırılmış bir bölüm de olsa yaptığınız işi kısaca ifade edip tanıtımınızı yaparak, sunduğunuz hizmetleri listeleyebilirsiniz. Elbette bu sizin yararınıza olacaktır.
Avatar:
Twitter’da kullanabileceğiniz tek resim avatarınız olabileceğinden, yüklediğiniz resim çok çabuk Twitter kimliğiniz haline gelebiliyor. Bu nedenle avatar resminizin akılda kalıcı ve özgün olmalı. Bununla birlikte kim olduğunuzu ya da ne iş yaptığınızı çağrıştıran doğru resmi seçtiğinizden emin olmalısınız. Ben de dahil bir çoğumuz avatar olarak logomuzu kullanmamıza rağmen, kişisel fotoğrafınızın göründüğü avatarlar insanlarla aranızdaki kurumsal mesafeyi azaltarak daha güven verici bir durum oluşturuyor. Sonuçta birebir iletişim haline geçilen freelance işlerde çok önemli bir faktör olan “güven” unutulmamalı. Kısacası 80x80px’lik bir resim kullanarak nasıl bir iletişim kurmak istediğiniz konusunda doğru kararı verin.
Arkaplan Resmi:
Twitter’ın standart arkaplan resimlerinden birini kullanıyorsanız, aslında doğrusu onu bir an önce çöpe atıp kendinize özel bir arkaplan resmi kullanmaktır. Standart arkaplan resimleri, ciddi bir bağlantı ağı oluşturmanızda eksiklik olarak varsayılabilir. Daha da önemlisi, size özel bir arkaplan resmi, işinizle ilgili bilgileri paylaşmanızda, size gerçekten değerli bir statü sağlar.
Sonuç olarak, Twitter’da bir profil oluştururken kullanıcı adınızdan, arkaplan resmine kadar bütün seçimlerinizi bilinçli bir şekilde yapmanız sizin faydanıza olacaktır.
Takip edecek kişiler bulun
Twitter’da sizi kimse izlemiyorsa, tabiki yaptığınız her şey anlamsız olacaktır. Ve siz birilerini takip etmeye başlamadan, sizi takip edecek kişileri bulmak zaman alır. Bu nedenle öncelikle benzer ilgi alanları ve iş alanlarına sahip kişileri bulun. Bir kaç iletisini ya da profil bilgisini okuyarak, sizi takip etmek isteyebileceğini tahmin ettiğiniz kişileri önce siz takibe alın. Aralarından mutlaka sizi takip etmek isteyen kişiler çıkacaktır. Bunun için harcayacağınız zaman sizin için uzun vadeli bir yatırımdır. Bu şekilde Twitter’daki bağlantı ağınızı genişletebilirsiniz.
Twitter’da tarzınızı ortaya koyun ve onu koruyun
Bütün ayarlarınızı yaptınız. Sırada ne var? Tabi ki ileti yazmak. Yani dilimize de neredeyse yerleşmek üzere olan “tweetlemek”. Bu bölüm, Twitter’da yeni olanlanlara ilk zamanlarda zor gelebilir. Sonuçta yazacağınız ileti ve okuyacak kişilerle ilgili sorumluluk sahibisiniz. Benim bu konudaki tek tavsiyem: “Sadece yazın, gitsin”. Elbette hatalarınız olacak ama bunun sonucunda hatalarınızla ve doğrularınızla sadece kendiniz olacaksınız ve bu da kişiliğinize ve işinize saydamlık kazandırarak karşınızdakine dürüstlüğünüzün kanıtı olarak geri dönecektir. Tabi ki bu, bilerek hata yapmak anlamına da gelmiyor. Bir kez yazmaya başladığınızda insani ve etik değerlerden dolayı tek bir sorumluluğunuzun olduğunu farkedeceksiniz: Kendinize ve diğerlerine saygılı olmak.
Twitter’da tarzınızı oluştururken bir kaç ipucundan yararlanabilirsiniz;
Aldığınızdan fazlasını verin.
Herkes farklı amaçlarla Twitter kullanıyor olabilir ama şunu farkettim ki hiç kimse Twitter’da “hava çok soğuk” gibi gelişi güzel ileti bombardımanına tutulmak için bulunmuyor. Siz de aynı şeyi yapmak yerine, alanınızla ilgili ya da sizi takip edenlerin ilgisini çekeceğini düşündüğünüz faydalı bilgiler yazarak okunurluğunuzun devamlılığını sağlayabilirsiniz. Ayrıca blogunuz varsa yeni yazılarınızın kısa özetini geçerek tanıtınımını yapın. Yazılarınızı beğenip beğenmediklerini sorun. Soru cümleleri diyalog ortamının oluşmasını sağlar. İş harici günlük hayatınızla ilgili özel iletiler yazmayı da ihmal etmeyin. Unutmayın ki Twitter’da sadece işinizin tanıtımınızı yapmak için değil, öncelikle insanlarla iletişime geçmek için bulunuyorsunuz. Bence işin püf noktası da bu. Yani ne yaptığınızın yanından kim olduğunuz da insanlar için önemli. Sizi insanlara kendinizin değil, bir başkasının tavsiye etmesi ağızdan ağıza pazarlamada en iyi sonucu doğurur.
Suistimal etmeyin.
Bir çok yönden Twitter kişisel bir yayın kanalıdır. Ve asıl problem de buradan doğar. Diğer bütün yayın kanalları gibi izleyicilerin-dinleyicilerin canı sıkıldığı (ve kalbi kırıldığı) zaman kanalı hiç şüphesiz değiştirirler. Sadece kendiniz olmanızı tavsiye etmemin sebebi, bunun insanlara ilgi çekici gelecek olmasındandır. Twitter’da yaptığınız tek şey blogunuza yazdığınız yazıların linkini yapıştırmak olursa, sadık takipçilerinizi geri dönüşü olmadan kaybedebilirsiniz. Çünkü bir defa sizin ağınızından çıktıklarında kolay kolay geri dönmeyebilirler. En azından Twitter’da sizin ilginizi nelerin çektiğini gözden geçirin ve siz de aynı şeyi sunmaya çalışın.
Diğer yandan hedeflediğiniz ağı oluşturduğunuzda günde bir ileti yazmak ya da hiç ileti yazmamak takipçileriniz için yeterli olmayabilir. Onlarla etkileşiminizi kaybetmemek ve iletişimi koparmamak için her gün yeterli ve dengeli sayıda ileti yazın.
Blogunuzu twitter’la birleştirin.
Twitter’a sadece blogunuzdaki yazıların linkini yapıştırmanın hatalı bir davranış olduğunu belirtmiştim. Diğer bir yandan ise Twitter, blogunuzun okuyucu sayısını ciddi bir ölçüde artırabilecek güce sahiptir. Ve bu, Freelance çalışanlar için potansiyel müşterileri ile bağlantıya geçmek için çok daha önemli olabilir. Çünkü blogunuz, sunduğunuz hizmetlerin ve işinizdeki kalitenin tanıtımı için mükemmel bir araçtır. Twitter’da blog yazılarınızı yayınlayarak kişisel ve profesyonel vasfınızı paylaşmak, takipçilerinizin, yaptığınız işle ilgili güvenlerini kazanmanızı sağlar. Bu nedenle elbette blog yazılarınızın linklerini de Twitter’da yayınlayın. Bir freelance çalışan olarak hala blogunuz yoksa çok yakında yazacağım Freelance çalışanlar neden blog açmalı başlıklı makalemden faydalanabilirler.
Sırada Ne Var?
Bu adımların hepsini gerçekleştirdiğinizde Twitter bağlantı ağınızın genişlemesinde ve itibar kazanmanızda başarılı olabilirsiniz. Çok detaylı bir makale olmasa da başlangıç ve kullanım açısından faydalı bir Twitter rehberi olacağını düşünüyorum. Freelance işlerinizi büyütmek için sosyal medya ortamlarını kullanmanın çok önemli olduğunu unutmayın. Bu konuda biraz zaman harcayarak elde edebileceğiniz imkanları ve kazançları es geçmeyin.
Bu konuda unuttuğum ya da göz ardı ettiğimi düşündüğünüz noktalar olabilir. Eleştirilerinizi ve yorumlarınızı bekliyorum.
Devamını OkuÜcretsiz Tipografik Website Template’leri
Zaman darlığından dolayı, sıfırdan web site tasarlamak ve yazmak yerine hazır web siteleri çoğu zaman kurtarıcı kaynak olabiliyor. Üstüne bir de Web 2.0 anlayışı ile web sitelerinde önem verilen tipografi eklenince böyle bir arşiv web tasarımcılar için daha önemli oluyor. Smashing Magazine tarafından ücretsiz paylaşıma sunulan bu arşiv, CSS çatısı bakımından hazır site kullanmayı tercih etmeyenlerin bile işine yarayabilecek hazır CSS / XHtml çatılarını barındırıyor. Ayrıca tipografik hiyerarşileri ile özellikle web tasarımlarında tipografi tekniğini geliştirmek isteyenlerin incelemesi gereken arayüzler var.
T-20 (Önizleme – İndir)
Extreme Georgia (Önizleme – İndir)
Experimental (Önizleme – İndir)
Greenie Theme (Önizleme – İndir)
Shalom Typo (Önizleme – İndir)
O’No! Typography (Önizleme – İndir)
Typographic Times (Önizleme – İndir)
Geotypisch (Önizleme – İndir)
Megan (Önizleme – İndir)
Maintenance (Önizleme – İndir)
WP Typo (Önizleme – İndir)
the ARTof TYPE (Önizleme – İndir)
David Kruger (Önizleme – İndir)
Top Notch (Önizleme – İndir)
Simple Type (Önizleme – İndir)
Anticipated (Önizleme – İndir)
MiniCon (Önizleme – İndir)
The theme (Önizleme – İndir)
Typo E-mag (Önizleme – İndir)
Luvbold (Önizleme – İndir)
Happy Go Try (Önizleme – İndir)
Eastern Tales (Önizleme – İndir)
Paivi K (Önizleme – İndir)
CMYKolours (Önizleme – İndir)
Goliath (Önizleme – İndir)
viCard (Önizleme – İndir)
Typo Today (Önizleme – İndir)
JavaScript Tricks (Önizleme – İndir)
Contrast (Önizleme – İndir)
Brown Typo (Önizleme – İndir)
Exploring Web Typography (Önizleme – İndir)
Ihsanrama (Önizleme – İndir)
Blue Inc (Önizleme – İndir)
Whoo! (Önizleme – İndir)
Worldlines (Önizleme – İndir)
Hot box (Önizleme – İndir)
Safe As Houses (Önizleme – İndir)
ILuvType (Önizleme – İndir)
Pink Elephant (Önizleme – İndir)
Smash My Typo (Önizleme – İndir)
TypoGra (Önizleme – İndir)
Goldrenrod (Önizleme – İndir)
An Ordered Aesthetic (Önizleme – İndir)
Dynamic-Fresh (Önizleme – İndir)
Web Tasarımda Renk Anatomisi: Mavi
Sık sık göz ardı edip, değerlendirme dışı tutarız belki de. Ama gerçek şu ki; renkler hayatımızda büyük rol oynar. Biliriz ki dünyada sayısız renk var ve tamamını çıplak gözle ayırt etmemiz imkansızdır. Eğer sanatçı, tasarımcı ya da mühendis iseniz yaptığınız çalışmalarda renkler, gücü ve etkisi dolayısıyla çok önemlidir. Daha önemli bir şey varsa, o da yaptığımız işe göre renklerin seçimidir. Günümüzün renkli dünyasında, doğru renkleri seçme ve harmanlamadaki yeteneğiniz size yeni imkanlar yaratabilir.
Konuyu asıl branşımız olan web tasarımına indirgediğimizde renk kullanımının ne derece önemli olduğunu bütün web tasarımcılar bilir her halde. Bu makalede Mavi rengin web tasarımındaki kullanımına ve faydalarına göz atacağız. Ama öncesinde mavinin tanımını yapmakta fayda var diye düşünmekteyim.
Fransız Fauvist Ressam Raoul Dufy (1877 – 1953) mavi rengin önemi konusunda şöyle diyor;
“Mavi, bütün tonlarında kendi karakterini koruyan tek renktir… Her daim mavi olarak kalır. Oysa ki örneğin sarı renk, koyu tonlarında kararır, açık tonlarında kaybolur; kırmızı koyulaştığı zaman kahverengiye döner, rengini biraz açsanız Pembe olur, yani artık Kırmızı değildir”
Mavi’nin teknik tanımı
Teknik olarak, 440–490nm dalga boyuna sahip ışığın oluşturduğu renk spektrumunda en baskın gelen, dolayısıyla en çabuk algılanan renk mavidir.
Mavinin algıdaki etkisini de Wikipedia‘dan okuyalım;
“Dünyanın hakim rengi olan mavi çekingen bir renk; dinlendiriciliği ve edilgenliği anlatır. Koyu tonlarda ya da yoğun olarak kullanıldığında moral bozan, kasvet veren, açık tonlarda ya da beyazla karışık kullanıldığında, yatıştırıcı ve güven veren bir etki yaratır.Vücudumuzda boğaz bölgesini yansıtan bir renktir. Mavi renk gökyüzünün ve geniş ufukların, denizin simgesidir. Sınırsızlığı ve uzak bakışlılığı simgeler. Huzuru temsil eder ve sakinleştirir. Kan akışını yavaşlattığına inanılır. Ve nazar boncuğu o yüzden mavidir. Batıda intiharları azaltmak için köprü ayaklarını maviye boyarlar. Duvarları mavi olan okullarda çocukların daha az yaramazlık yaptığı saptanmıştır.”
Neden Mavi rengi seçmeliyiz?
Her yaştan erkek ve kadının favori renklerinden birinin mavi olduğu kanıtlanmıştır. Hatta dünya nüfusunun yarısından fazlasının favori rengi olduğu söylenir mavi için. Diğer yandan geleneksel olarak, gündelik hayatta erkekler maviyi kadınlardan daha çok kullanır. Sonuçta her iki cinsiyet için de maviyi popüler yapan, sahip olduğu yatıştırıcı etki olabilir.
Mavi renk, itibarı ve güveni çağrıştırır. Ve bunu yaparken de gereğinden fazla ciddi ve sıkıcı bir hava yaratmaz. Polis üniformaları gibi kurumsal kıyafetlerde de mavinin tercih edilmesi bu nedenledir.
Mavi, gözün odaklanmasında fazla efor gerektirmediği gibi, mavi renkli arkaplan kullanılan tasarımlarda imajların ve nesnelerin algısını da kolaylaşır. Web tasarımcıların bu konuda dikkate alması gereken en önemli husus da budur.
Tabi ki her renk gibi maviyi de tasarımlarda abartılı bir şekilde kullanmamak gerekmektedir. Yoksa tarafsız ve soğuk bir etki yaratır ve bu da tasarımdaki çekiciliği azaltır. Bütün bunlarla birlikte, mavinin en fazla teknoloji, medikal ürünler, temizlik ürünleri, hava, gökyüzü, su, deniz ve otomotiv ile ilgili alanların web sitelerinde kullanıldığı görülür.
Mavinin avantajları
Hayatın bir çok alanında olduğu gibi web tasarımlarında da mavi diğerlerine nazaran ezici bir çoğunlukla tercih edilen renktir. Çünkü denizin ve gökyüzünün rengi mavi, -daha önce de belirttiğim gibi- güven vericidir. Mavi renk ayrıca derinliği, kararlılığı, sadakati, ilimi, bilgiyi, inancı, sükuneti, samimiyeti ve ferahlığı temsil eder. Ne çok şeyi temsil ediyor değil mi? :)
Kurumsal tasarımlarda en fazla tercih edilen renk te mavidir. Hatta büyük şirketlerin web sitelerinde de farklı kullanım şekilleriyle, sık sık mavi ile karşılaşırız.
Bilişim sektörü, düzgün ve teknolojik bir görünüm kazandırmasından dolayı mavinin orta tonlarını (ana renge yakın tonlar) daha sık kullanır. Özellikle grinin tonlarıyla bir arada kullanıldığında etkisi artmaktadır. Genel olarak mavinin açık tonları, sağlık, seyahat ve konaklama gibi alanlarda tercih edilir. Koyu mavi tonları ise en çok politik ve siyasi kuruluşlar, tüzel şirketler ve spor kulüpleri için kullanılır.Özellikle de koyu mavi tonları bilgi, kararlılık, beraberlik ve muhafazakarlık gibi çağrışımları barındırdığı için kurumsal şirketlerde çok tercih edilir.
Genel anlamda mavinin bütün tonları yatıştırıcı bir etkiye sahiptir. Ancak elbette bütün tonları sakin görünmez. Göz alıcı parlak maviler hareketli, canlı ve alımlıdır.
Web tasarımlarında mavinin tonları ve kullanımı
Artık web tasarımlarında mavinin farklı tonlarda ve stilde kullanımına, diğer renklerle birlikte nasıl göründüğüne örneklerle birlikte göz atabiliriz.
Koyu Mavi (Lacivert)
Lacivert tonu bilgiyi, ciddiyeti, gücü ve dürüstlüğü temsil ettiği için, daha çok güçlü ve kendinden emin görünmesini istediğimiz web sitelerinde kullanılırız.
Açık Mavi
Açık mavi sağlık, sükunet, anlayış ve rahatlığı temsil eder.
Soluk Mavi
Soluk mavi, web sitelerine duygulu bir anlam katar. Ve zerafeti, sükuneti, sağlığı ve anlayışı temsil etmek için sık sık kullanılır.
Royal Mavi (Parlak Lacivert)
Royal mavi adından da anlaşılacağı gibi web sitelerine gösteriş ve seçkin bir hava katar. Ayrıca zenginliği ve bazen de seviyeli bir duruşu sembolize eder. Diğer bir yandan bu renk, lacivertin bütün etkilerine de sahiptir.
Mavinin Kırmızı, Turuncu ve Sarı ile kullanımı
Etkisi bakımından güçlü tasarımlar genellikle mavi, kırmızı ve sarının kombinasyonuyla oluşturulmuştur.
Mavinin parlak kırmızı ve turuncu planlarla kullanımı çekici bir iz bırakır. Ayrıca mavi ve sarının birlikte kullanılmasıyla oluşturulan yüksek kontrast kullanıcının dikkatini çekmek için doğru bir çözümdür.
Mavinin pastel renklerle birlikte kullanımı
Mavi, pembe ve açık sarı tonlarıyla oluşturulan renk kombinasyonlarıyla web sitelerinde bahar havası yaratılabilir. akua ve cyan mavinin pastel tonlarıdır. Web sitelerine ferah, saf ve aynı zamanda hareketli, güçlü, kendinden emin ve korkusuz bir nitelik kazandırırlar.
Mavi ve Yeşilin birlikte kullanımı
Mavi ve yeşili bir arada kullandığınızda huzurlu ve sakin bir etki oluşur. Böylece sakin ve zarif renk paleti ile uçsuz bucaksız bir gökyüzünün altında yemyeşil bir manzara etkisi yaratabilirsiniz.
Açık kahve ve bej renginin mavi ile birlikte kullanımı
Gökyüzü mavisi, açık kahverengi ve bej ile birlikte kullanıldığında çevreye duyarlı, çevre dostu bir renk kombinasyonu oluşur.
Mavi ve Beyazın birlikte kullanımı
Mavi ve beyaz web sitelerinizde ferah bir etki yaratır.
Mavi’nin Metalik Gümüş veya Gri ile birlikte kullanımı
Mavinin koyu tonlarının metalik gümüş ile birlikte kullanımı, tasarımın şık ve gösterişli olmasını sağlar. Eğer daha abartısız bir gösteriş istiyorsanız metalik gümüş yerine griyi tercih edin.
Mavi renkli websiteleri
Mavi rengi tercih eden, mavinin koyu ve açık tonlarını bir arada kullanarak sofistike ve kendinden emin bir görünüş kazanan websitelerini incelemeniz faydalı olacaktır. Çünkü mavinin koyu ve açık tonlarının bir arada kullanılması, özellikle kurumsal şirketlerde siteyi ziyaret edenlerin güvenini kazanmasını sağlar.
Freelance tasarımcıların websiteleri
Freelance tasarımcılar, kendi portföylerini yayınladıkları websitelerinde de genellikle maviyi tercih ederler. Aşağıdaki siteler, mavinin kullanımıyla ziyaretçinin ilgisinin nasıl çekileceğinin en güzel örneklerinden.
Jquery İle Hareketli Linkler
Jquery’i bu kadar sevmemizin en önemli sebebinin animasyon kabiliyeti olduğunu biliyoruz sanırım. Hatta Jquery çıktıktan sonra Javascript öğrenmeye karar veren web tasarımcıların sayısında artış olduğu da bilinmektedir. Bu küçük uygulama da Jquery‘nin kendini bu kadar sevdirebilmesinin en basit örneklerinden.
Sitenizdeki linklerin alt çizgisine animasyon ekleyerek, linklerinizi çekici hale getirebilirsiniz. Belki de bu sayede linklerin tıklanma sayısı da artar, belli mi olur:) Bunun için yapacağınız işlem gerçekten çok basit ama daha önce kimsenin aklına gelmeyen (en azından benim daha önce hiç görmediğim) yaratıcı bir efekt. İlk olarak Css-Tricks sitesinden Chris Coyier’in aklına gelmiş ve yayınlamış.
Başlıyoruz o halde;
Öncelikle linkinizin stiline position:relative özelliğini ekliyoruz. Sonra da bütün linklerimize span elementini eklemek için Jquery kullanıyoruz. Eklediğimiz position:absolute şeklinde konumlandırılarak linkin hemen 1 px altına yerleştiriliyor. Ve yüksekliğini 1px, genişliğini de 100% vererek sanki linkin alt çizgisiymiş gibi bir görünüm kazandırılıyor. CSS olarak yazmak gerekirse;
|
1 2 3 4 5 6 |
span{
position:absolute;
bottom:-1px;
height:1px;
width:100%
} |
şeklinde oluyor. Tabi bu css’i Jquery otomatik olarak oluşturduğundan sizin ayrıyeten eklemenize gerek yok. Linkin üstüne gelince alt çizginin hareket etmesi için, span’ın satır yüksekliğine (line-height) animasyon eklenerek son halini alması sağlanıyor. Ve sonuç mükemmel.
Demo’da efektin 3 farklı tekniği bulunuyor. 3. teknik, 2. tekniğin biraz değiştirilmiş hali.
Siz de linklerinize bu efekti eklemek isterseniz aşağıdaki javascript kodlarını kullanabilirsiniz. Aşağıdaki kodların çalışması için sayfanıza Jquery’i de eklemeniz gerekiyor. Bunun için sayfanızın <head> bölümüne aşağıdaki satırı ekleyin.
|
1 |
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js?ver=1.3.2" type="text/javascript"><!--mce:0--></script> |
Şimdi aşağıdaki tekniklerden istediğinizi sayfanıza uygulayabilirsiniz.
1. TEKNİK
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
$(function() {
var $el = $(),
linkHeight = parseInt($("p").css("line-height")),
speed = 175; // 1000 = 1 second
$("#first a").each(function() {
$el = $(this);
// If the link spans two lines, put a line break before it.
if ($el.height() > linkHeight) {
$el.before("
");
}
$el.prepend("");
}).hover(function() {
$el = $(this);
$el.find("span").stop().animate({ height: linkHeight, opacity: 0.3 }, speed);
}, function() {
$el = $(this);
$el.find("span").stop().animate({ height: "1px", opacity: 1 }, speed);
});
}); |
2. TEKNİK
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
$(function() {
var $el = $(),
speed = 175; // 1000 = 1 second
// SECOND TECHNIQUE
$("#second a").hover(function() {
$el = $(this);
$el.stop().animate({ backgroundPosition: "(0px 0px)", color: "white" }, speed);
}, function() {
$el = $(this);
$el.stop().animate({ backgroundPosition: "(0px 15px)", color: "#900" }, speed);
});
}); |
Yalnız Internet Explorer 8.0′da düzgün çalıştığı halde IE 6.0 ve IE 7.0 versiyonlarında düzgün çalışmayabilir. Sitenizde kullanmadan önce kontrol etmenizde fayda var.
Devamını OkuÜcretsiz WordPress Magazin Temaları
Beni blog yazma işine zorlayan en büyük etken, hiç şüphesiz WordPress kurulumunun ve düzenlemesinin oldukça basit ve eğlenceli olması. (Bu konu ile ilgili ileride detaylı bir makale yazmayı düşünüyorum) ozdtasarim.com‘u açmadan önce ben de magazin yapısında wordpress temalarını araştırıp, beğendiğim temayı satın almıştım.
Ancak bu tarz bir site açmak için para ödemenize tabi ki gerek yok. İsterseniz bu makalede yayınladığım wordpress temalarını ücretsiz olarak indirip kullanabilirsiniz. İşinize yarayacak kullanışlı özelliklere sahip ve istediğiniz gibi düzenleyebileceğiniz bir yapısı var. Ancak bazı temaları bütün özellikleriyle birlikte kullanmak için bir kaç eklenti indirmeniz gerekiyor. Yeri gelmişken wordpress eklenti kurulumundan da kısaca bahsedeyim.
WordPress Eklenti (Plugin) Kurulumu
İndirdiğiniz wordpress eklentisini hostinginizde bulunan /wp-content/plugins klasörünün içine atın ve WordPress yönetim panelinde bulunan eklentiler bölümünden etkinleştirin. Tek yapmanız gereken bu. Tabi gelişmiş eklentiler için indirdiğiniz eklenti klasöründe varsa “Read Me” dosyasını okumanızı tavsiye ederim
WordPress Tema Kurulumu
WordPress’inize tema kurabilmek içinse, indirdiğiniz temayı /wp-content/themes klasörünün içine atıp yönetim panelinden etkinleştirmeniz yeterli olacaktır.
Şimdi gelelim gazete ve magazin siteleri için kullanabileceğiniz ücretsiz WordPress temalarına…
Magazin WordPress temalarına çok meraklı olduğumdan, hangi temayı beğendinizi ya da burada olmayan ve tavsiye edeceğiniz magazin temalarını yazarsanız sevinirim . Yorumlarınızı bekliyorum.
Chronicle
Hamasaki
Gamezine
Magazeen
Small Magazine Theme
ZinePress
Old News Theme
Arras Theme
Newspaper WordPress Theme
The Stars
The BlogTimes
Freelance çalışanlar neden Twitter kullanmalı?
Sevin ya da sevmeyin, sosyal medya siteleri uzun bir süre daha hayatımızda olmaya devam edecek. Daha da önemlisi, freelance iş yapıyorsanız, işinizi büyütmeniz açısından tartışmasız yararlı olan sosyal medya araçlarını kullanmadığınız takdirde, internetin size sunduğu en büyük fırsatı kaçırıyorsunuz demektir. Ücretsiz kullanılabilen sosyal medya araçları ile gerçek zamanlı yapabileceğiniz reklamların hatrı sayılır bir maddi getirisi olacaktır.
Benzerleri sosyal medya pazarında lider olmak adına her gün sitelerine yeni özellikler ekleyerek çabalasa da, freelance işlerinizde (özellikle web tasarım) bağlantı ağınızı genişleterek, sizi bu sektörün güçlü bir üyesi yaparak müşteri sayınızı artırmak için Twitter‘ı neden ve nasıl kullanmanız gerektiğini bir çok yönden açıklayabilirim.
Freelance çalışanlar bir yana, bence her blog yazarının bile yazılarını daha geniş kitleye duyurabilmesi için Twitter kullanması gerekiyor.
O halde Twitter’ın sadece anlık ileti yazılan bir fenomen olmadığını, freelance iş hayatınızda, kapalı olduğunu düşündüğünüz kapıları açma imkanı sunan son derece önemli bir fırsat olduğunu söylesem inanır mısınız?
Hadi başlayalım ozaman.
Twitter daha geniş bir bağlantı ağı sağlar.
İşinizle ilgili vermek istediğiniz bilgiyi daha etkili bir ifade ile nasıl sunacağınızı biliyorsanız, Twitter’daki sadık takipçileriniz, diğerlerine sizi anlatarak takipçi sayınızın artması ile doğru orantılı olarak internetteki itibarınızı da arttıracaktır. Elbette en önemli nokta kendinizi nasıl ifade ettiğinizdir. Eğer yanlış ifade ederseniz, gelişmeler de aksi yönde olacaktır. Fakat sonunda alacağız mükafat, risk almaya kesinlikle değer. Bugün bir çok freelance çalışan (özellikle Web tasarımcılar), müşterileriyle bir kez bile yüzyüze buluşmadan, işlerini internet üzerinden yürütüyor. İşte bu noktada, kullanıcı sayısı ve işlevi dikkate alındığında Twitter iş bağlantılarını sağlamak ve sürekli genişletmek açısından en önemli araçlardan biri haline gelmiştir.
Twitter sizi daha çok kişiye ulaştırır, sesinizi yükseltir.
Takipçi sayınızın artması, yazdıklarınızı okuyan kişi sayısının da artabilmesi anlamına gelir. Twitter size kısacık bir sürede yüzlerce hatta binlerce insana ulaşma imkanı sağlar. Kelimelerin gücü sınırsızdır ve bunu Twitter’da en büyük avantajınız olarak kullanabilirsiniz.
Twitter sizi meslektaşlarınızla buluşturur.
Twitter sayesinde tanıdığınız ya da tanımadığınız bir çok meslektaşınızla buluşmanız ve yaptığı işleri görmeniz mümkün. İlgilendiğiniz sektörde daha çok somut iş görmek ve daha çok meslektaş tanımak, size bir anlamda etkileşim kaynağı ve destek sağlayacaktır. Birbirinizin bloglarını okuyabilir, mailleşebilir hatta chat programları ile canlı sohbet edebilirsiniz. Böylelikle yaptığınız işlerle ilgili değerlendirme yaparak, bilen birinden fikir alabilirsiniz. Şahsen web tasarım konusundaki ustalığımı böyle bir yol izleyerek kazandım diyebilirim. Üstelik ayrıca ortak ilgi alanı olan arkadaşlar edinmiş oluyoruz.
Twitter ile söyledikleriniz çok daha hızlı yayılır.
Twitter, her söylediğinizi orman yangını mantığında çok hızlı bir şekilde yayıyor. Twitter’ı doğru kullanarak sağlam bir itibar kazandığınız takdirde, bir çok pazarlama şeklini sollayan ağızdan ağıza pazarlama (word of mouth marketing) konusunda iyi bir konuma yükselirsiniz. En doğru tabiriyle, kendinizi ve işinizi takipçilerinize beğendirirseniz, onlar da size müşteri yönlendirir.
Hala ikna olmadınız mı?
Bunlardan başka söyleyeceğim tek şey “deneseniz ne kaybedersiniz?” olur herhalde. Olumlu bir etkisini görmezseniz, en fazla biraz zaman kaybetmiş olursunuz. Bir çoğumuz için vaktin nakit olduğunu biliyorum ama küçük yatırımlar olağanüstü güzel sonuçlar doğurabilir. Bunun için denemeye değer bir platformdur Twitter.
Artık Twitter kullanmaya ikna olduysanız Freelance Çalışanlar Twitter Kullanırken Nelere Dikkat Etmeli? başlıklı yazımı bekleyin. Hala bu fırsattan yararlanmak istemiyorsanız, Twitter kullanmamak için bir kaç neden söyleyebilir misiniz?
Devamını OkuGoogle’dan sosyal hareket: Google Buzz
Bir kaç gündür diğer Gmail kullanıcıları gibi beni de heyecanlandıran bir uygulama Google Buzz. Gmail hesabımda Gelen Kutusunun hemen altında adeta “ben geldiiim” diye bağıran bir ikonla dünyamıza girdi. Peki nedir bu Google Buzz?
Önce Buzz kelimesiyle başlayalım. “vızıltı, söylenti” anlamına gelen ve BAZ diye okunan İngilizce bir kelime. Diğer bir yandan “hareketlilik” anlamında kullanıldığı yerler de var.
Google’dan iddialı bir sosyal medya hareketi
Google Wave ile internet kullanma alışkanlığımızı değiştirmeyi ve bir anlamda kolaylaştırmayı iddia eden, ama pek de kullanıcı dostu olmayan anlaşılması zor arayüzü sayesinde hedefledikleri kitleye ulaşamayan Google, sosyal medya pazarına nihayet iddialı bir giriş yaptı. Nedendir bilmiyorum ama Google Buzz, adının çağrıştırdığının aksine samimi bir ortam yaratmayı başardı.
Gmail hesabımızla bütünleşik hareket etmesi, zaten iletişim halinde bulunduğumuz insanlarla bizi otomatik olarak aynı ortamda buluşturmasından olsa gerek daha ilk günden hiç yabancılık çekmeden paylaşım yapmaya başladık bile. Buzz’ın başta Google Reader olmak üzere, Blogger, Twitter, Picassa, YouTube ve Flickr‘ı destekliyor olması video, fotoğraf, makale ve link gibi istediğiniz her şeyi paylaşabilmeniz anlamına geliyor. Tabiki bunu ister herkese açık, ister özel olarak oluşturduğunuz gruplar için yapabiliyorsunuz.
“Takip etme”, “Beğenme” gibi Twitter ve Facebook’tan aşina olduğumuz özelliklere de sahip olan Google Buzz’a alışmak hiç de zor olmayacak.
Buzz paylaşımlarını, hem sayfayı yenilemeden hem de Gmail Gelen Kutusu’ndan kolaylıkla takip edebiliyor olmamız gerçek zamanlı bir sosyal ortamın oluşmasını sağlıyor.
Facebook’a büyük rakip
Bu söz ilk bakışta fazla iddialı gelse de, sayısı 170 milyonu bulan Gmail kullanıcısından istifade ederek kalabalık bir kullanıcı kitlesiyle açılış yapmak, 5 yıl içerisinde 400 Milyona yaklaşan üye sayısı ile sosyal medya pazarının lideri Facebook’a rakip olması için geçerli bir sebep.
Mobil Platformlarda Ekstra Özellikler
Şimdilik sadece Android işletim sistemlerini kullanan cep telefonlarında olsa da, Google Map uygulaması ve mobil platformlarla entegresi sayesinde, cep telefonlarından durum güncellemeleri yapıldığında kullanıcının konum bilgisi de kaydedilerek, bulunduğu yer mesaja eklenecek. Bununla birlikte, birbirine yakın olan kullanıcılar herkese açık olarak yolladıkları mesajlarda arama yapabilecek.
Ayrıca bu anlık iletiler, sinema, tiyatro, cafe gibi mekan değerlendirmelerinin yapıldığı Google Places adlı uygulama dizinine de eklenecek.
Sanırım Google Buzz’ın özellikleri anlatmakla bitmeyecek. En iyisi kullandıkça keşfetmek ve öğrenmek. Şimdilik bu kadar ön bilgi ve tavsiye, Buzz kullanıcısı olmak için yeterli sanırım.
Daha fazla bilgi için http://buzz.google.com adresini ziyaret edebilirsiniz.
Devamını OkuSponsorlar
Facebook’ta beğen.
