Posts made in Şubat, 2010
35+ CSS 3 & Javascript Uygulaması
Bilindiği üzere CSS 3 tamamıyla gelmek üzere ve henüz malesef sınırlı sayıda tarayıcı CSS 3′ü destekliyor. Tasarımcılar olarak CSS 3′ün kullanışlı ve çekici özellikleriyle deneyim kazanmaya başladıkça demode olmuş eski tarayıcılara burun kıvırmaya başlayıp, yeni nesil modern tarayıcıları tercih eder olduk. Bu sektörde güncel kalmanın en akla yatkın çözümü de modern tarayıcılara geçerek gelecekte daha çok kullanacağımız CSS 3′ü öğrenmek zaten. Aslında bu makalenin amacı yakın gelecekte CSS 3 tekniğiyle neler yapmanın mümkün olacağına kısaca göz atmak diyebiliriz. Çünkü aşağıdaki örnekler günümüzde çok da yaygın olmayan uygulamalar.
Bu uygulamalar, deneyimli tasarımcıların CSS 3 tekniklerini geliştirmek ve modası geçmiş tasarımlarını yenisiyle değiştirmek için son derece kullanışlı ve etkili olacaktır. Böylelikle artık Internet Explorer 6′yı tamamen terk etmek için biraz daha yol alabilirsiniz. Yalnız şunu da belirteyim, bu örneklerin bir çoğu Jquery, Mootools gibi javascript kütüphaneleri ile bir arada kullanılmış CSS 3 teknikleridir.
CSS 3 İLE GÖRSEL EFEKTLER
Analog Saat
CSS 3′ün webkit (Safari, Google Chrome…) uyumlu transform ve transition özellikleri ile analog saatin nasıl yapıldığını görebilirsiniz. Javascript, sadece saatin gerçek zamanı göstermesi için kullanılıyor. Firefox ve Explorer’ın şu anki versiyonlarında çalışmamakta.
Hareketli Kart Destesi
Bu örnekte, sadece Html ve CSS (transform ve transition özellikleri) kullanarak hareketli kart desteleri oluşturuluyor. Ayrıca font-face, box-shadow, border-radius gibi CSS’in yeni özelliklerinin de nasıl kullanıldığını görmek için güzel bir uygulama.
PNG resimlerde Hareketli Gölge ve Işık
Önce ışığı yakın. Sonra ışığın ve logonun yerlerini mouse ile sürükleyerek değiştirin. Işığın bulunduğu konuma göre logonun gölgesinin de değiştiğini göreceksiniz. Hoşunuza gideceğini düşündüğüm çok farklı bir uygulama.
Jquery ve CSS 3 ile kayarak açılan bölüm
Sayfa içinde kayarak açılan bölümlerle ilgili bir çok javascript ve CSS 3 uygulaması var. Ancak bu diğerlerinden şıklığı ve biraz da esnek görünümü ile farkını gösterip güzel bir alternatif oluyor. Örnekteki “infos” butonuna basınca ne demek istediğimi göreceksiniz.
CSS 3 ile oluşturulmuş gösterişli overlay
Bu uygulamadaki asıl nokta, CSS’e sonradan eklenen özelliklerden biri olan border-image özelliği ile çerçevede gradient resim (turuncudan sarıya doğru renk geçişini görebilirsiniz) kullanılmış olması.
CSS 3 ile değişik arabirim tasarımları
Özellikle mobil internet sitelerinde kullanılan arabirim tasarımları çok hoşuma gidiyor. Bu örnekte de aynen mobil tasarımlardaki gibi arabirimler yapabileceğiniz uygulamalar mevcut. İncelemenizi tavsiye ederim.
Sadece CSS ile 3D şerit tasarımları
Daha çok ribbon adı ile bildiğimiz şeritleri sadece bir kaç CSS 3 özelliğini kullanarak oluşturabilirsiniz.
Jquery ve CSS 3 ile şık diyalog kutusu
Bir çok web sitesinde karşılaştığımız, diyalog kutusu diye tabir edilen ama bizim daha çok mesaj penceresi adını verdiğimiz uygulamalara sade ve şık bir örnek.
Kayarak Açılan Pencere
Sadece webkit tarayıcılar (Safari, Chrome..) için CSS 3′ün animation ve transform gibi yeni özellikleriyle oluşturulmuş bir pencere uygulaması.
CSS 3 ile sütunlu gazete taslağı
Şu sıralar gazete görünümlü bu tarz sitelere ve bloglara sık sık rastlamaya başladım. CSS 3 ile oluşturulmuş hazır gazete taslağı bu tarz bir çalışma için epey kullanışlı görünüyor.
CSS 3 İLE NAVİGASYON MENÜLER
Navigasyon Menü
Bu uygulamada Jquery ve CSS 3 kullanılarak AJAX destekli sekmeli (tab) menü yapımı anlatılıyor.
CSS 3 ile Sekmeli Navigasyon Menü
Yine CSS 3′ün yeniliklerinden faydalanarak yukarıdaki menüye alternatif bir sekmeli navigasyon oluşturabilirsiniz. Buton ve sayfalar arasındaki bağlantıyı sağlamak için elbette jquery’den faydalanılıyor.
Animasyonlu Transparan Menü
PNG resimlerde Hareketli Gölge ve Işık uygulamasından sonra en çok hoşuma giden bu oldu. Her butonun üstüne gelindiğin yan tarafta akarak beliren transparan objeler sayfanızın çekiciliğini artırabilir.
Coverflow efektli Resim Geçişleri
Coverflow efekti, flow’dan yani kayarak gelen anlamında kullanılan efektten türeyen bir tabir. Bu efektin bir çok metodu var aslında. Ancak bu örnekte CSS 3′ün Transform özellikleriyle yapılıyor.
Sadece CSS İle Tab Menü
Javascript kullanmadan, sadece CSS ile üstüne gelindiğinde değişen tab menü yapabilirsiniz. Ancak Internet Explorer’ın desteklemediğine şaşırmamanız gerekiyor.
CSS 3.0 GEÇİŞLERİ VE ANİMASYONLARI
Transition (Geçiş) özelliği ile sıradışı olun
Resim galerilerinizi diğerlerinden farklı yapmak isteyenler için şahane bir örnek. Transform ve Webkit Transition özellikleri kullanılarak yapılıyor. Bu da şimdilik sadece Safari ve Chrome’da bütün özellikleriyle birlikte düzgün çalıştığı anlamına geliyor. Diğer tarayıcılarda animasyon kısmı çalışmasa da oldukça güzel ve canlı görünüyor.
CSS 3 ile Dönerek Gelen Plak
Bir kaç albüm kapağı, bir tutam Html ve biraz da CSS 3 transitions ve transform özelliğini bir kaba koyup karıştırıyoruz. 10 dakika sonra karışımımız hazır. Karşınızda kutusundan dönerek çıkan Plak (ya da CD ile yapabilirsiniz) efekti. Bu efekt yalnızca Safari’de sorunsuz çalışıyor.
Mootools ve CSS 3 İle Sitenizi Daha Eğlenceli Yapın
Mootools’da yeni yeni kullanılmaya başlanan bir özelliği CSS 3 ile birleştirince oldukça eğlenceli işler ortaya çıkıyor. Firefox, Safari ve Google Chrome’un son versiyonlarında sorunsuz çalışıyor. Demoya kesinlikle göz atmanızı tavsiye ederim.
HTML ve CSS İle STARWARS: Yeni Umut
“Uzun bir zaman önce, çok uzak bir galakside yıldız savaşları devam ediyordu” Hiç bir şey anlamadınız değil mi? :) Örneği izleyin ve Html 5 ve CSS 3 ile neler yapılabileceğini görün.
CSS İle 3 Boyutlu Sayfalar ve Açılı Videolar
Zach Johnson, CSS 3 ile izometrik küpün yüzeylerine yazı ve video ekleyerek 3 boyutlu sayfa tasarımları yapmayı başarmış. Çok da güzel görünüyor.
CSS 3 ile Jquery Benzeri Animasyonlar
Jquery ile yapılan bazı animasyon efektlerinin aynısı CSS 3 ile yapılabiliyor. CSS 3 ve Jquery ile yapılan aynı animasyonları demoya göz atarak karşılaştırabilirsiniz. Tabi ki şu an için sadece Webkit tarayıcılarında düzgün çalışıyor.
“Yükleniyor” Animasyonu
Gezdiğiniz web sitesinin ya da evinizdeki internetin ne kadar hızlı olduğu önemli değildir. “Preload” diye ifade ettiğimiz genelikle dönerek “Yükleniyor” mesajını veren görsellere her zaman ihtiyacımız olur. “Bu sadece CSS 3 ile yapılabilir mi?” diye merak edenler için en güzel örnek.
Kar Yağma Efekti
Fazla söze gerek yok. Safari ve Chrome’da çalışan bu efekt sayesinde CSS 3 ile web sayfanıza kar yağdırabilirsiniz.
Küp Şeklinde 3 Boyutlu Sayfalar
Yukarda benzerini verdiğimiz uygulamanın başka bir örneği. Modern CSS tekniklerini kullanarak Javascript’e ihtiyaç duymadan sayfalarınızı 3 boyutlu hale getirebilmenin en kolay yolu.
CSS Transform Özelliği ile Daha Fazla 3 Boyut
Nesneleri CSS Transform özelliği ile 3 boyutlu bir görünümde dizmeyi sağlayan bir animasyon efekti.
CSS 3′TE RGBa VE HSL RENK KODLARI
RGBa Renkleriyle Çalışmak
CSS 3 bize renklerle ilgili çalışmak için yeni imkanlar sunuyor. Bunlardan bir tanesi de RGBa. Sonundaki “a” harfi rengin opasite seviyesini ( ya da transparanlık değerini) belirleyen Alpha’yı temsil ediyor. Bu teknik sayesinde Photoshop’ta tasarladığımız görsellerin benzerini CSS 3 ile oluşturabiliriz.
Resim Kullanmadan Gradient Buton Yapmak
Bütün özellikleriyle birlikte en düzgün şekilde sadece webkit tarayıcılarında görünen bu örnekte, hiç resim kullanmadan Photoshop’ta tasarladığınız gradientli parlak butonların aynısını CSS 3 ile nasıl yapabileceğiniz anlatılıyor.
CSS 3′te HSL Ve HSLA Renk Kodları
CSS 3′ün bize sunduğu diğer bir renk kodu tekniği de HSL. Bütün tarayıcıların desteklediği bu teknik, CSS 3 ile gradient oluşturmak için oldukça kullanışlı görünüyor.
CSS 3 ile Şık Buton Tasarımı
CSS 3′ün en güzel nimetlerinden biri de Photoshop’la uğraşmadan oldukça şık buton tasarımları yapmak için gerekli bütün özelliklere sahip olması sanırım. Ne kadar az resim dosyası kullanırsak sitemizde o kadar az yer kaplayacağı için sitenin daha hızlı olması açısından da çok kullanışlı bir teknik bu.
CSS 3′TE GÖLGE ÖZELLİĞİNİN KULLANIMI
Text-shadow Özelliği ile gömülü yazı efekti
Son zamanlarda ben dahil bir çok web tasarımcının en çok kullandığı CSS 3 özelliklerden biri olan text-shadow sayesinde içe doğru gömülü gibi görünen yazılar oluşturabilirsiniz. Firefox, Safari, Chrome gibi bütün modern tarayıcıların bu özelliği destekliyor olması da tercih edilmesindeki en büyük etken sanırım. Çok kolay ve kullanışlı bu teknik sayesinde web sitenizde kusursuz bir görünüm elde edebilirsiniz.
CSS 3 İle Gelen Gölge Efektleri
Artık neredeyse bütün tasarımlarımda kullandığım box-shadow ve text-shadow özellikleriyle web sitelerinde hem yazılara hem de kutulara (çerçevelere) gölge verebilisiniz. Aslında aşağıdaki örnek her şeyi açıklıyor. Fazla söze gerek yok, siz en iyisi örneği inceleyin.
CSS 3 İLE RESİM GALERİLERİ
CSS 3 ile Polaroid Fotoğraf Galerisi
CSS’in yeni özelliklerini bir arada kullandığımız zaman, artık sihir yapmak bile mümkün hale geldi :) Polaroid fotoğraf görünümlü kusursuz bir resim galerisinin CSS ile nasıl yapıldığına bir göz atalım.
Jquery ve CSS 3 İle Lightbox Resim Galerisi
Bu derste Jquery ve CSS 3′ün en yeni teknikleri ile lightbox (tıklanınca açılan kutu içinde resim gösterimi) ve sürükle & bırak özelliğine resim galerisi yapımı anlatılıyor. Ve scriptin en önemli özelliği web sunucunuzda bulunan bir resim klasörünün içindeki resimlerle bir galeri oluşturabilmesi.
Düzenlenebilir CSS 3 Resim Galerisi
Html 5, Jquery ve CSS 3′ün birlikte kullanımı ile oluşturulan bu resim galerisi, aynı zamanda web tasarımcıların kullandığı bir içerik yönetim sistemi olan Pagelime için uyumlu bir yapıya sahip.
CSS 3 HACKLERİ
CSS 3 İle Internet Explorer ‘da Yuvarlak Köşe
CSS 3′ün yuvarlak köşe oluşturmayı sağlayan border-radius özelliğini Internet Explorer hariç şu an piyasadaki bütün tarayıcılar destekliyor. Bu htc dosyası sayesinde Internet Explorer da bu özelliği desteklemeye başlıyor.
Bu hack’le Overflow: hidden ‘a güle güle
Özellikle divlere gölge veren box-shadow özelliğinde yaşadığımız sorun bu hack ile ortadan kaldırılıyor.
Haftalık OZD #2
2. haftayı geride bıraktık. Her geçen gün OZD Tasarım blogu, web & grafik tasarımcıların işine yarayacağını düşündüğüm makaleler ve kaynaklarla büyümeye devam ediyor. Ziyaretçilerimizin desteği sayesinde büyük bir özveri ile yazılarımı aksatmadan yayınlamak ve blogu geliştirmek için gayret ediyorum. Artan ziyaretçi sayısına bakıldığında her iki tarafın da bu durumdan memnun olduğu anlaşılıyor:) Sizden tek beklentim yazılara daha fazla yorum bırakmanız. Bıraktığınız yorumlar benim için çok önemli, aynı zamanda blogun geleceği için de referans niteliğinde. Bu nedenle yorum yazmaya daha fazla önem verirseniz sevinirim.
Bakalım geçtiğimiz hafta neler yayınlamışız:
Web Sitesini Yenilemenin 3 Altın Kuralı
WordPress’inizin hayatını kurtaracak 10+ SQL Sorgusu
1000 Adet Photoshop Dersi
Portfolyonuzu rakiplerinizden daha iyi yapmanın yolları
20 Ücretsiz Modern Yazı Tipi
Grunge tasarım kaynakları
CSS ve JQuery ile hareketli navigasyon menü
CSS ve JQuery ile hareketli navigasyon menü
Apple’ın kurumsal kimliği dahilindeki grafik tasarım stili her zaman hoşuma gitmiştir. Bu stili web sitelerinde kullanmak isteyen tasarımcılar için tympanus.net, CSS ve Jquery ile hazırlanmış çok güzel bir navigasyon menü dersi yayınlamış. Menü ilk bakışta gerçekten de Apple stiline çok benziyor. Ancak butonların üstüne gelindiğinde kayarak ortaya çıkan ikonlar, menüyü Apple stilinden bir adım öteye taşıyıp kendine özgü göz alıcı bir fark yaratıyor. Fare imlecini butonun üstünden çektiğimizde ikonlar tekrar kayarak kayboluyor. Diğer yandan ikonların butonların üstünden gelip, altına gitmesi bir anlamda “oyun kartı karıştırma” efektini andırıyor.
Menüde kullanılan ikonlar Dyricons.com‘da lisanslı olarak bulunduğundan burada paylaşmak istemedim. Ancak yine aynı sitede bulunan ücretsiz ikon setlerinden faydalanabilir ya da kendi arşivinizden istediğiniz ikonu kullanabilirsiniz.
Şimdi gelelim menünün hazırlanışına…
HTML
Html yapısı sırasız olarak dizilmiş liste elementlerinden ve bunların içine link ve ikonlar için yerleştirilmiş span elementlerinden oluşuyor.
CSS
CSS Stili sırasız olup aşağıdaki gibidir.
|
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 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 |
<span style="color: #252525;">.navigation{
position:relative;
margin:0 auto;
width:915px;
}
ul.menu{
list-style:none;
font-family:"Verdana",sans-serif;
border-top:1px solid #bebebe;
margin:0px;
padding:0px;
float:left;
}
ul.menu li{
float:left;
}
ul.menu li a{
text-decoration:none;
background:#7E7E7E url(../images/bgMenu.png) repeat-x top left;
padding:15px 0px;
width:128px;
color:#333333;
float:left;
text-align:center;
border-right:1px solid #a1a1a1;
border-left:1px solid #e8e8e8;
font-weight:bold;
font-size:13px;
-moz-box-shadow: 0 1px 3px #555;
-webkit-box-shadow: 0 1px 3px #555;
text-shadow: 0 1px 1px #fff;
}
ul.menu li a.hover{
background-image:none;
color:#fff;
text-shadow: 0 -1px 1px #000;
}
ul.menu li a.first{
-moz-border-radius:0px 0px 0px 10px;
-webkit-border-bottom-left-radius: 10px;
border-left:none;
}
ul.menu li a.last{
-moz-border-radius:0px 0px 10px 0px;
-webkit-border-bottom-right-radius: 10px;
}
ul.menu li span{
width:64px;
height:64px;
background-repeat:no-repeat;
background-color:transparent;
position:absolute;
z-index:-1;
top:80px;
cursor:pointer;
}
ul.menu li span.ipod{
background-image:url(../icons/ipod.png);
left:33px; /*128/2 - 32(half of icon) +1 of border*/
}
ul.menu li span.video_camera{
background-image:url(../icons/video_camera.png);
left:163px; /* plus 128 + 2px of border*/
}
ul.menu li span.television{
background-image:url(../icons/television.png);
left:293px;
}
ul.menu li span.monitor{
background-image:url(../icons/monitor.png);
left:423px;
}
ul.menu li span.toolbox{
background-image:url(../icons/toolbox.png);
left:553px;
}
ul.menu li span.telephone{
background-image:url(../icons/telephone.png);
left:683px;
}
ul.menu li span.print{
background-image:url(../icons/print.png);
left:813px;
}
</span> |
JAVASCRIPT
İlk önce ikonların kaybolma efekti oluşturuluyor, daha sonra üstüne gelince ortaya çıkması için li elementleri tanımlanıyor.
|
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 |
<span style="color: #252525;">$(function() {
var d=1000;
$('#menu span').each(function(){
$(this).stop().animate({
'top':'-17px'
},d+=250);
});
$('#menu > li').hover(
function () {
var $this = $(this);
$('a',$this).addClass('hover');
$('span',$this).stop().animate({
'top':'40px'
},300).css({
'zIndex':'10'
});
},
function () {
var $this = $(this);
$('a',$this).removeClass('hover');
$('span',$this).stop().animate({
'top':'-17px'
},800).css({
'zIndex':'-1'
});
}
);
});
</span> |
Hepsi bu kadar!
Jquery 1.3.2.js’i ve html sayfasına eklenmesi gereken diğer satırları menüyü indirerek görebilirsiniz.
Devamını OkuGrunge tasarım kaynakları
Kirli, dağınık ve gelişigüzel bir görünümü olabilir ama tasarımda hala en çok tercih edilen stillerin başında gelir Grunge. Ve uzun bir süre daha geçerliliğini koruyacak gibi görünüyor. Tam tersini düşünen arkadaşların yanılacağına eminim:)
Grunge etkisi ile ilgili Bildirgec.org‘da bir Fotoğrafçılıkta ve grafik tasarımda grunge etkisi adı ile bir yazı yayınlanmıştı zamanında. Ayrıntıları ve örnekleri linki tıklayarak görebilirsiniz. Kısaca, grunge etkisi tasarımcıların yaratıcılık ve aykırılık anlamında kucakladıkları ilk stildi. Günümüzde alışveriş sitelerinden afişlere, kişisel bloglardan albüm kapaklarına kadar çeşitli tasarımlarda kullanılmaya bütün istikrarıyla devam ediyor. Görünen o ki en azından bir kaç yıl daha tercih edileceği kesin.
Bu makalede, grunge stilinde tasarım yapmak isteyenlerin kaçırmaması gereken bir kaynak sunmak istedim. Kaynakta grunge tarzında yazı tipleri, photoshop fırçaları, dokular, ikonlar, tasarım dersleri ve website template’leri bulunuyor.
İlham Kaynakları
Eğer daha önce bu stilde hiç çalışmadıysanız, başlangıçta zorlanabilirsiniz. Çünkü grunge tasarımlarda renk paletleriyle çalışma tekniği biraz farklıdır. Bu tarzda çalışırken, yaratıcılığınızı tasarım kurallarının içine hapsetmeden serbest çalışırsanız neler yapabileceğinizi göreceksiniz. Bu işe başlarken esinlenebileceğinizi düşündüğüm bir kaç web sitesi örneği ile başlayalım.
Dokular ve Arka Plan Resimleri
İyi bir web sitesi önce arka plan tasarımı ile başlar. Grunge arka plan resimleri metal, ağaç, kağıt ya da çöp gibi dokulardan oluşturulmuş olabilir. Aşağıdaki grunge doku ve arka plan resimleri bu konuda çok işinize yarayacak. Ayrıca daha fazlası için sizi buraya alalım.
Photoshop Fırçaları
Fırçalar tasarımda önemli rol oynarlar. Fırça kullanmadan tasarımlarınızda mükemmel efektler oluşturmak neredeyse imkansızdır. Grunge stilinde çalışırken ihtiyacınız olan fırçalar (ve fırça setleri) aşağıda.
Yazı Tipleri
Daha önce de dediğim gibi grunge tasarımlarda kurallara uymak zorunda değilsiniz. Dolayısıyla kurumsal ya da modern yazı tipleri kullanmak zorunda değilsiniz. Hal böyleyken, tasarımlarınıza biraz daha aykırık katmak için pitoresk (resim destekli diyebiliriz) yazı tipleri kullanmak isteyebilirsiniz. Aşağıda sunduğum ücretsiz grunge yazı tipleri de tam aradığınız tarzda. Bu yazı tiplerini kullanarak özgün tasarımlar yapabilirsiniz.
Bleeding Cowboys
Marcelle
Neo Print
Trashed
Trashco
Great Thunder
Heroin07
Frakturika
Broken Ghost
Desperado
Hawaii Lover
Gasmask
İkon Setleri
İkonlar bloglarımızı ve web sitelerimizi zenginleştirerek daha modern bir görünüm sağlarlar. Bugünlerde her stilde ikonlara rastlamak mümkün. Aşağıda bulunan grunge stilinde tasarlanmış ikonlar, tasarımınızdaki tek eksik olabilir.
Social Grunge Icons
Distortion
Grungy asphalt
Old icons
Litho System
Scratch Icons
Tasarım Dersleri
Grunge stilinde bir web sitesi tasarlamanız gerekiyor ve bu konuda hiç deneyiminiz yoksa aşağıdaki dersler tam size göre. Bu dersler aracılığıyla bu stildeki tekniğinizi geliştirip pratik kazanabilirsiniz.
Grunge stilinde header tasarımı
Karikatürize Grunge Arayüz Tasarımı
Grunge Arayüz Tasarımı
Grunge Website Tasarımı
Grunge Blog Tasarımı
Website Template’leri
Grunge stilinde sıfırdan web sitesi tasarlamak istemiyorsanız ya da zamanınız yoksa aşağıdaki hem statik hem de wordpress için hazırlanmış website temalarını indirip kullanabilirsiniz.
Statik website template’i isteyenler için:
Grunge Superstar
Grunge template
WordPress template’i isteyenler için:
Creative Art Theme
Blak Magic
Mystic Grunge
Cellar Heat
Color Paper
20 Ücretsiz Modern Yazı Tipi
Tasarımcılar olarak özellikle kurumsal çalışmalarda kusursuz yazı tiplerine ihtiyaç duyarız. Çünkü kurumsal tasarımları daha canlı hale getirmenin en kolay yollarından biri, tasarımlarımızda modern yazı tipleri kullanmaktır. Bana göre kurumsal tasarım çalışmalarının en zor yanlarından biri ise yazı tipi seçimidir. Tasarımını yaptığınız şirketin kurumsal kimliğini doğru yansıtıyor olması çok önemlidir. Ve bir çok tasarımcının bu noktada kararsız kalıp yanlış seçimler yaptığı olmuştur.
Bu kararsızlığa yol açan etken ise bütün fontları kategorilere ayırmadan bir arada kullanmaya çalışmaktır. Bu hatanın önüne geçebilmek için, tasarımcılar çalışmaya başlamadan önce “modern, teknolojik, eğlence” gibi kendi belirledikleri kategorilere göre yazı tiplerini gruplandırıp, daha sonra ihtiyacı olduğu kategoriden yazı tipini seçerek tasarımda kullanmalıdır.
Bu kaynakta kurumsal çalışmalarda kullanabileceğiniz ücretsiz modern yazı tiplerini özellikle header bölümlerinde, başlıklarda hatta logo tasarımlarında bile kullanabilirsiniz.
Decker
Fertigo
Harabara
Juice
Birdman
Daville
Camellia
Grouser
Installer
Photonica
Diavlobook
Mager
176mksdal
Geometry Soft
Days
Picoblackal
Dekers
Caviar Dreams
Sansation
Albertino
Portfolyonuzu rakiplerinizden daha iyi yapmanın yolları
Freelance dünyasında her zaman zorlu rakipleriniz olacaktır. Müşterilerinizin gözüyle bakıldığında, sizi rakiplerinizden ayıran faktörlerin başında portfolyo sitenizin kalitesi gelmektedir.
Portfolyonuzu oluştururken elbette kişisel tercihlerinizi kullanacaksınız. Yine de kendi tercihlerinizi, bu freelance dünyasında sizi diğerlerinden kesinlikle farklı kılacak bir kaç yolu dikkate alarak kullanmanızda fayda var.
Artık portfolyonuzu rakiplerinizden daha iyi yapmanın yollarını incelemeye başlayabiliriz.
İyi bir site tasarımı
Tabi ki portfolyo sitenizin güzel bir tasarıma sahip olması gerektiğini zaten biliyorsunuz ama internette o kadar kötü portfolyo siteleri var ki görseniz şaşırırsınız. Web tasarım hizmeti vermiyor olsanız dahi iyi bir portfolyo sitesine mutlaka sahip olmalısınız.
Kısacası, sitenizin tasarımı ne kadar güzel olursa müşterilerinizin gözünde profesyonelliğiniz ve itibarınız da o kadar büyük olacaktır.Tasarımı kötü olduğu için sitede satılan ürünlerin de kaliteli olmadığını düşündüğünüz web siteleri ile mutlaka karşılaşmışsınızdır. Aynı şey freelance işler için de geçerlidir.
Düzenli kod yapısı
Bunu bilmiyor olabilirsiniz ama müşteriler, özellikle de sizinle dışarıdan çalışmak isteyen web ajansları, sitenizin kod yapısına önem gösterip mutlaka inceliyor. Kusursuz tasarımın bir parçası olan düzenli kod yapısına siz de aynı önemi göstermelisiniz. Temel semantik yapılara ve web standatlarına göre düzgün bir kodlama yapmalısınız. Özellikle de web yazılım hizmeti veriyorsanız öncelikle kendi portfolyo sitenizin yazılımı düzgün bir kodlamaya sahip olmalı.
Bilgilendirme
Portfolyo sitelerinde genellikle verilen hizmetler alt alta listelenir ve referanslar küçük resimler halinde yan yana dizilir. Ama müşterilerinizin bilgilendirilmesi açısından olması gereken çok önemli bir şey nedense unutulur: işinizi neden ve nasıl yaptığınız. Bununla ilgili bilgilendirici açıklamalar müşterilerinizin dikkatini çekecek ve sizinle ilgili ön bilgi almalarını sağlayacaktır. Hizmet verirken özellikle kullandığınız yöntemleri ve teknolojileri neden tercih ettiğinizi müşterilerinize açıklayan bir bilgi metnini web sitenizde bulundurmanız, onların gözünde itibarınızı artıracaktır.
Samimi olmak
Bir çok portfolyo sitesi sanki robotlar tarafından yapılmış gibi mesafeli bir duruşa sahiptir. Profesyonel bir görünüm her zaman önemlidir ama daha önemli olan bir şey varsa o da samimi olmaktır. Böylelikle sitenin bir insan tarafından yapıldığı konusunda müşterinizi ikna ederek aranızdaki mesafenin gereksiz yere açılmasını önlemiş olursunuz. Hatta sitenizin “hakkında” bölümünde kendi resminize yer vermeniz hem profesyonel hem de samimi olduğunuzu gösteren bir faktör olacaktır. Aynı zamanda bu, kendinize güvenin de bir simgesidir.
İletişim Yolları
Sitenizde birden fazla iletişim yolunun olmasına dikkat edin. Bazı müşteriler sadece e-mail ile ulaşmayı, bazıları ise telefonla bizzat arayarak konuşmayı tercih eder. Sitenizde mümkün olduğunca bir e-mail adresi, iletişim formu ve messenger hesabınıza yer verin. Potansiyel müşterilerinizin size rahatlıkla ve kolaylıkla ulaşmasını istersiniz değil mi?
Blog Sahibi Olmak
Klişe gelebilir ama portfolyo sitenizde bir blog bölümünün olması size bir kaç yönden yardımcı olacaktır:
1. Ziyaretçilerinizin, sitenize tekrar gelmesi için bir nedeni olur. Bu da sitenizin onların akıllarında kalmasını sağlar. Ve böyleyece yaptığınız yeni işleri de görürler.
2. Sitenizi SEO (arama motoru optimizasyonu) bakımından destekler. Standart portfolyo siteleri SEO için yeterli içeriğe sahip değillerdir.
3. Sizi müşterilerinizin gözünde işinizin uzmanı olarak gösterir. Kullandığınız teknik kelimeleri anlamasalar bile blogunuzu takip ederler.
Canlı Kalmak
Portfolyonuzun eski işlerinizle dolu, unutulmuş bir site olmaması çok önemlidir. Bunun için ana sayfanıza Twitter hesabınızı ekleyerek anlık iletilerinizi portfolyo sitesinizde yayınlamak, sitenizin sürekli canlı kalmasına yardımcı olur. Bununla birlikte aynı anda Facebook, Friendfeed, Twitter, Google Buzz gibi bütün sosyal medya iletilerinizi hepsini birden sitenizde yayınlamak, ana sayfanızda gereksiz kalabalığa yol açarak göze hoş görünmeyecektir. Portfolyo sitenizi, günde kaç sosyal medya iletisi yazdığınızı göstermek için değil, yaptığınız işleri yayınlayarak müşteri kazanmak için açtığınızı unutmayın. Bu nedenle amaca yönelik ve kurumsal bir duruşu olan sosyal medya sitesi Twitter yeterli olacaktır.
Bir kaç iyi portfolyo sitesi
Sıra Sizde!
İyi bir portfolyo sitesi yapmak için sizin tavsiyeleriniz nelerdir? İyi portfyolyo sitelerine örnekler verirseniz sevinirim.
Devamını Oku1000 Adet Photoshop Dersi
Tasarımla ilgilenip de Photoshop derslerini takip etmeyen kişi sayısı yok denecek kadar azdır herhalde. Bu noktada blogumda Photoshop derslerine de yer vermem gerekir diye düşünüyorum. CSS, Jquery ve WordPress yazılarından dolayı Photoshop’u ihmal ettiğimi itiraf etmem gerekiyor:) Ama o kadar günün acısını çok geniş bir kaynakla telafi edebileceğimi tahmin ediyorum.
Şaka değil, gerçekten de 1000 adet Photoshop dersi bulunuyor bu kaynakta. İkon tasarımından logo tasarımına, manipülasyondan dijital fotoğraf dersine, wordpress tema tasarımından tipografi çalışmalarına kadar Photoshop’la ilgili aradığınız her şeyi bulabileceğiniz es geçilmemesi gereken bir kaynak bu. Amatör ya da profesyonel tasarımcı olmanız farketmiyor, 1000 Photoshop dersinden mutlaka seviyenize uygun olanı çıkacaktır.
Fotoğrafı Avatar’a dönüştürme dersleri: 15 Adet
Adidas reklam tasarımı dersi
3 boyutlu likit patlama çalışması
3 boyutlu buzlu yazı efekti
Logo tasarımı ile ilgili ipuçları
Tipografik Afiş Tasarımı
Kış Olimpiyatları – Snowboard Afiş Tasarımı
Yüksek kaliteli ikon tasarım dersleri: 60 Adet
Özel seçilmiş logo tasarım dersleri: 31 adet
İkon tasarım dersleri: 20 Adet
HDR Resim Dersleri: 20 Adet
Logo tasarım dersleri: 55 adet
WordPress Tema Tasarım Dersleri: 17 adet
Kaliteli Yazı Efektleri: 15 Adet
Profesyonel Photoshop Dersleri: 10 Adet
İkon tasarım dersleri ve kaynakları: 46 adet
En İyi Photoshop Dersleri ve İpuçları: 10 Adet
İkon Tasarım Dersleri: 40 adet
Header Tasarım Dersleri: 101 adet
İkon Tasarım Dersleri: 48 adet
Apple tarzı Photoshop dersleri: 31 adet
Profesyonel Photoshop Dersleri: 20 adet
Su efekti dersleri ve Photoshop fırçaları: 40 adet
Detaylı WordPress Tema Dersleri: 37 adet
Güncel Photoshop Dersleri Derlemesi: 55 adet
En iyi logo tasarım dersleri: 30 adet
Elektronik Aygıt Tasarım ve İllustrasyon Dersleri: 60 adet
Başlangıç ve ileri seviyede yaratıcı photoshop dersleri: 33 adet
Efektli yazı tasarım dersleri: 5 adet
Birbirinden güzel logo tasarım dersleri: 30 adet
PSD’den HTML’e dönüşterme dersleri: 22 adet
Tipografi Tasarım Dersleri: 42 adet
İkon Tasarım Dersleri: 31 adet
WordPress’inizin hayatını kurtaracak 10+ SQL Sorgusu
Wordpress’iniz varsa üzülerek söylüyorum ki düzenleme ve periyodik bakım konusunda yapmanız gereken çok işiniz var demektir. Ve bazı durumlarda karşılaştığınız spesifik problemler için hızlı olmak zorunda kalabilirsiniz. İşte böyle durumlarda direkt veritabanı üzerinde çalışmak gerçekten hayat kurtarabilir. Bu makalede WordPress için 10+ kullanışlı SQL sorgusunu görebilirsiniz. WordPress’iniz zor durumda kaldığında bu hızlı ve pratik sorgular kesinlikle işinize yarayacak.
SQL Sorgulaması Nasıl Yapılır?
Henüz bilmeyenler için kısaca bahsedeyim. SQL sorguları MySQL komut satırı yorumlayıcısında çalıştırılır. Ya da bir çoğumuzun kullandığı PhpMyAdmin gibi popüler bir web arayüzü de kullanılarak yürütülebilir. Kullanıcı dostu arayüzü ve ile SQL sorgularının direkt olarak yorumlanmasını sağlayan SQL Executionner wordpress eklentisini de mutlaka kullanmanızı tavsiye ederim.
Sorgulardan önce…
Bu SQL sorguları her ne kadar test edilmiş olsa da, her şeye rağmen sorguları gerçekleştirmeden önce veritabanının yedeğini almayı sakın unutmayın.
Şifrenizi Elle Değiştirmek
Bir gün sizin de başınıza gelebilir. Eğer admin şifrenizi unutursanız tek çözüm MySQL Veritabanı’nda yeni bir şifre oluşturmaktır. Bu sorgunun tek görevi de bu. Yalnız şifre dönüştürme işlemi için MD5 fonksiyonunun kullanıldığına da dikkatinizi çekmek isterim.
|
1 |
UPDATE 'wp_users' SET 'user_pass' = MD5('PASSWORD') WHERE 'user_login' ='admin' LIMIT 1; |
Yazıları Bir Kullanıcıdan Diğerine Aktarmak
Yeni WordPress kullanıcıları, güvenlik açısından yazılarını “admin” adı ile yazmamaları gerektiğini bilmiyor ya da unutmuş olabilirler. Eğer siz de bu hatayı yaptıysanız bu sorgu ile eski yazılarınızı yeni oluşturduğunuz kullanıcıya aktarabilirsiniz. Bu sorguyu kullanırken eski ve yeni kullanıcı adına ihtiyacınız olacaktır.
|
1 |
UPDATE wp_posts SET post_author=NEW_AUTHOR_ID WHERE post_author=OLD_AUTHOR_ID; |
Yazılardaki Güncelleme Bilgilerini Silin
Güncelleme bilgileri bazen kullanışlı olabiliyor. Özellikle de çok kullanıcılı bloglarda. Ancak bu güncelleme bilgilerinin veritabanındaki kayıtları göründüğünden daha fazla. Örneğin; Blogunuzda 100 adet yazı var ve her biri 10 defa düzenlenerek güncellenmiş. Bütün bu işlemler veritabanındaki wp_posts tablosunda tam 1000 adet kayıt tutulması anlamına geliyor. Oysa size 100 adet kayıt yeterli.
İşte bu sorgu, bahsettiğimiz yazı güncelleme bilgilerini ve ilgili metaları anında silmeye yarıyor. Veritabanındaki şişkinliği giderip rahatlatmak için oldukça işe yarar bir sorgu.
|
1 |
DELETE a,b,c FROM wp_posts a WHERE a.post_type = 'revision' LEFT JOIN wp_term_relationships b ON (a.ID = b.object_id) LEFT JOIN wp_postmeta c ON (a.ID = c.post_id); |
Spam Yorumları Toplu Halde Silme
Fazla söze gerek yok aslında, başlık her şeyi anlatıyor. Onay listesinde biriken spam yorumları toplu halde silmenize yarıyor.
|
1 |
DELETE from wp_comments WHERE comment_approved = '0'; |
Kullanılmayan Etiketleri Bulun
Etiketler veritabanının wp_terms tablosunda kaydedilir. Ve bazen oluşturulduğu günden beri hiç kullanılmayan etiketler olabilir. Bu kullanılmayan etiketlerin veritabanında daha fazla yer kaplamasını istemiyorsanız, bu sorgu ile güvenli bir şekilde silebilirsiniz.
|
1 |
SELECT * From wp_terms wt INNER JOIN wp_term_taxonomy wtt ON wt.term_id=wtt.term_id WHERE wtt.taxonomy='post_tag' AND wtt.count=0; |
Verileri Bulun Ve Değiştirin
Bu aslında WordPress için çok gerekli olmayabilir ancak MySQL kullanan herkesin bilmesi gereken bir ipucu. replace() fonksiyonu bir stringi bulup başka bir string ile değiştirmeye yarar. Bu sorguyu çalıştırarak, bir stringi -bütün özellikleri ile birlikte- başka bir stringle değiştirebilirsiniz.
|
1 |
UPDATE table_name SET field_name = replace( field_name, 'string_to_find', 'string_to_replace' ) ; |
Yorum Yazanların Emaillerini Liste Halinde Görün
Bütün yorum yazanların emaillerini liste halinde görmenizi sağlayan kullanışlı bir sorgu. DISTINCT parametresi sayesinde birden fazla yorum yazan kişilerin email adresini sadece bir kere listeliyor.
|
1 |
SELECT DISTINCT comment_author_email FROM wp_comments; |
Bütün Eklentilerinizi Toplu Halde Etkisizleştirin
WordPress’te bir şeyler ters gittiğinde çoğunlukla problemin kaynağı kurulan eklentiler olabilir. Ve çok ziyaretçili web sitelerinde bu problemi çözmek için hızlı olmanız gerekir. Bu sorgu sayesinde bütün eklentileri aynı anda etkisizleştirerek problemin çözümünde daha hızlı yol alabilirsiniz.
|
1 |
UPDATE wp_options SET option_value = '' WHERE option_name = 'active_plugins'; |
Bütün Etiketleri Silin
WordPress’te etiketler kategorilerine ve sınıflarına göre kaydedilir. Eğer oluşturduğunuz bütün etiketleri silmek isterseniz, bu işlemi yazılarınıza zarar vermeden gerçekleştiren bu sorgu çok işinize yarayacak.
|
1 2 3 4 5 6 7 8 9 |
DELETE a,b,c
FROM
database.prefix_terms AS a
LEFT JOIN database.prefix_term_taxonomy AS c ON a.term_id = c.term_id
LEFT JOIN database.prefix_term_relationships AS b ON b.term_taxonomy_id = c.term_taxonomy_id
WHERE (
c.taxonomy = 'post_tag' AND
c.count = 0
); |
Kullanılmayan Yazı Metalarını Listeleyin
Blogunuzda yazdığınız yazıların meta bilgileri eklentiler ve özel alanlar aracılığı ile oluşturulur. Çoğu zaman işinize yarasa da veritabanının birdenire büyümesine neden olur. Bu sorgu ile kullanılmadığı halde veritabanında yer kaplayan meta bilgilerini listeleyebilirsiniz.
|
1 |
SELECT * FROM wp_postmeta pm LEFT JOIN wp_posts wp ON wp.ID = pm.post_id WHERE wp.ID IS NULL; |
Eski Yazılardaki Yorumları Kaldırın
1 yıldan daha fazla süredir blog sahibi olanlar bilecektir, eski yazıların altında biriken yorumlar güncelliğini yitirdiği için çoğu zaman okunmadığı halde gereksiz yer kaplayabiliyorlar. Aşağıdaki sorguda 2009-01-01 yerine istediğiniz tarihi yazarak, belirlediğiniz tarihten önceki yazıların yorumlarını anında silebilirsiniz. Kesinlikle bir çok kişinin işine yarayacağını tahmin ediyorum.
|
1 |
UPDATE wp_posts SET comment_status = 'closed' WHERE post_date < '2009-01-01' AND post_status = 'publish'; |
Yorum Yazanların Site Linklerini Değiştirin
MySQL’deki replace() fonksiyonunun ne kadar işe yaradığından bahsetmiştim. Aşağıdaki sorgu da kesinlikle bunu kanıtlıyor. Özellikle de backlink için yazılan URL adreslerini değiştirmeniz için işinize yarayabilir.
|
1 |
UPDATE wp_comments SET comment_author_url = REPLACE( comment_author_url, 'http://oldurl.com', 'http://newurl.com' ); |
Yorum Yazanların Email Adreslerini Değiştirin
Bu sorgu ile de yorum yazan kişilerin email adreslerini yenisi ile değiştirebiliyorsunuz.
|
1 |
UPDATE wp_comments SET comment_author_email = REPLACE( comment_author_email, 'old-email@address.com', 'new-email@address.com' ); |
Spam Link Bulunan Yorumları Silin
Son olarak, blogunuza yorum şeklinde eklenen spam linklerin önüne geçebilmek için işinize yarayacak bir SQL sorgusu. Sorguda bulunan “%wpbeginner%” bölümü “%” işaretinin arasında olan url adresinin bulunduğu bütün yorumların silinmesi anlamına geliyor.
|
1 |
DELETE from wp_comments WHERE comment_author_url = "%wpbeginner%" ; |
Web Sitesini Yenilemenin 3 Altın Kuralı
“Web sitemi yenilemenin zamanı geldi” diye düşünenlerdenseniz, söyleyeceklerim ilginizi çekecektir mutlaka. Yalnız, web sitesini tamamıyla değiştirmek değil, altını çizerek söylüyorum yenileyerek daha güncel ve daha bakımlı bir web sitesi haline getirmektir tam olarak bahsetmek istediğim şey. Web sitesini yenilerken dikkat etmek gereken 3 altın kuralı beraber gözden geçirerek sitenizin geçerliliğini ve etkileyiciliğini koruyabilirsiniz. Kurumsal şirket sitesi, kişisel blog ya da web tasarımcının portföy sitesi farketmeksizin bu kurallar her web sitesi için geçerlidir.
Her site sahibinin üşendiği, belki de cesaret edemediği web sitesini yenileme işi, bu kurallara dikkat edildiği sürece sıkıcılıktan ve zorluktan uzak tam anlamıyla keyifli bir süreç olabilir. Çünkü eskilerden yeni bir şey yapmak güzeldir.
Web sitenizi yenilerken değerlendirmek gereken bir kaç kritik soru ortaya çıkar.
- Tasarımı yenilemek yeni ziyaretçi çekebilir ama sadık ziyaretçilerinizi uzaklaştırır mı?
- İçeriği düzenlemek arama motoru optimizasyonunu nasıl etkiler?
- Bu değişiklikler siteyi gerçekten daha iyi yapar mı?
Bu sorulara doğru cevap verdiğimizde 3 altın kural ortaya çıkıyor.
1) Tasarımı değiştirin ama verdiği hissi koruyun
Ziyaretçi sayısı yüksek olan web sitelerinin tasarımını değiştirmek, site trafiği için büyük ölçüde intihar olur.
En basit çözüm: Eski ziyaretçilerinizin ilk anda yanlış siteye geldiklerini düşünmesini istemezsiniz her halde. Ama bu sizin tasarımınızdaki bir kaç anahtar öğeyi yeniden tasarlamanızı önlememeli. Bu nedenle tasarımınızda mutlaka değiştirmek istediğiniz önemli bir kaç bölüm belirleyin ve eski tasarımınızdaki hissiyatı değiştirmeden bu bölümleri yeniden tasarlayın. Böylelikle eski ziyaretçileriniz siteye girdiğinde yabancılık çekmeyecektir.
Eğer logonuz yeteri kadar güçlü ise, bu değişimi destekleyebilir. Ama değilse, yeniden tasarlanan bölümlere göre daha eski görünebilir. Öyle ise en azından web tasarımındaki altın oranı dikkate alarak logonuzu en azından sol üst köşeye alarak bir anlamda yenilik katın. Unutmayın ki siteniz; renk uyumu, tipografi, ikonlar ve resimler gibi her öğesiyle kendi tarzını oluşturmalıdır. Tasarımınızı yenilerken bu anahtar kelimeleri mutlaka göz önünde bulundurun.
2) Arama motoru (SEO) değerlerinizdeki kaybı önleyin.
Sitenizi yenilerken dikkat etmeniz gereken en önemli nokta, eski sitenizdeki SEO değerlerinizi kaybetmeyeceğinizden emin olmaktır. Elbette yaptığınız düzenlemeler Google’da yeniden indexlenirken biraz zaman alacak ve bu süre içinde bir takım düzensizliklere yol açacaktır. Bu sorunu en aza indirmenin bir kaç yolu var.
Öncelikle, sitenizin içeriğindeki başlıkların, anahtar kelimelerin (meta keywords) ve sayfa açıklamasının (meta description) değişmediğinden emin olun. Buna ek olarak, sitenizdeki linklerin mümkün olduğu kadar eskisiyle aynı olmasına dikkat edin. Değiştirmek zorunda kaldığınız linkler için Google‘ın da belirttiği gibi mutlaka 301 yönlendirmesi yapın ve linki değişen her sayfa için 301 yönlendirmesinin yapıldığından emin olun. 301 yönlendirme işlemini yapmanın en kolay yolu htaccess yöntemidir ama sunucunuza ve sitenize göre diğer yöntemleri de seçebilirsiniz.
Son olarak, site içeriği ile ilgili bütün değişiklikleri yaptıktan hemen sonra Google’a site haritasının son halini göndermeyi sakın unutmayın.
3) Sitenizin yedeğini alın ve düzenleme editörü kullanın
Web sitelerinizi genelde bilgisayarınızda çevrimdışı olarak düzenleyip daha sonra web sunucunuza yüklemeniz en doğru yoldur ama direkt olarak sunucu üstünde çevrimiçi düzenleme yapmayı tercih edenlerdenseniz, yine de endişelenmenize gerek yok. Düzenlemeye başlamadan önce sitenizin yedeğini almanız başlangıçta yeterli olacaktır. Ek olarak, sitenize Dreamweaver gibi bir editör ile bağlanarak çalışmanız, hata ayıklayıcı ve ön izleme özelliği ile her yaptığınız değişikliği anında görüp hatalara anında müdahale etmek açısından doğru bir tercihtir.
Ama dediğim gibi en iyisi lokalde yani kendi bilgisayarınızda çevrimdışı çalışıp, güncellediğiniz dosyalarınızı FTP’den siteye yüklemektir. Böylece internet olmayan zamanlarda da site üzerinde çalışma imkanınız olur. Eğer web siteniz statik bir site değilse yapmanız gereken ilk şey bilgisayarınıza yerel sunucu kurmaktır.
Yerel sunucu ile uğraşmak istemeyip çevrimiçi çalışmayı tercih edenlerdenseniz, yayında olan site adresinde değil de, aynı adrese ait bir subdomain üzerinde çalışmanızda fayda var.
Peki siz sitenizi yenilerken nelere dikkat ediyorsunuz? Kendinize göre belirlediğiniz kurallar var mı? Yorumlarınızı bekliyorum.
Devamını OkuHaftalık OZD #1
Ve OZD Tasarım 1 haftayı geride bıraktı!
İlk günden itibaren her geçen gün artan ilginiz için teşekkürler. OZD Tasarım’ı açarken düzenli bir web tasarım blogu haline gelme hayalimin, aksatmamaya çalışarak yayınladığım makale ve kaynaklara gösterdiğiniz ilgi ile gerçeğe dönüşme yolunda emin adımlarla ilerlediğini görmek beni gerçekten mutlu ediyor. Ve bu mutluluk bana aynı zamanda bloguma gösterdiğim gayretin devamlılığı için güç veriyor. Test yayını olarak başlayıp henüz 2. günden kazandığımız ziyaretçi sayısı ile birdenbire normal yayın akışına geçtimiz için olsa gerek, hazırlıksız yakalandığımız bir takım görsel ya da yazılımsal düzenlemeyi yayındayken gerçekleştirmek zorunda kaldım. Değişikliklerin güncellendiği saniyelerde sayfaların açılması ile ilgili sorun yaşadıysanız endişelenmenize gerek yok. Her şey yolunda:) OZD Tasarım her geçen gün kendini geliştirmeye devam edecek.
Bakalım ilk hafta neler yayınlamışız…
2010 Web Tasarım Trendleri
Google’dan sosyal hareket: Google Buzz
Freelance çalışanlar neden Twitter kullanmalı?
Ücretsiz WordPress Magazin Temaları
Jquery İle Hareketli Linkler
Web Tasarımda Renk Anatomisi: Mavi
Ücretsiz Tipografik Website Template’leri
Freelance Çalışanlar Twitter Kullanırken Nelere Dikkat Etmeli?
CSS3 / XHTML Website Template
Web Tasarım Kaynakları #1
Sıradışı Sosyal Medya İkon Setleri
Sponsorlar
