10 Mart 2013 Pazar

Font-face Kullanımı

fontface_kullanımı

Font-face nedir ? Font face Nasıl kullanılır ? Font Face kullanımı ?

Hazırladığınız Web sitelerine görsellik kazandırmak için farklı fontlar kullanmaya ihtiyacı duyarız, Fakat her font her tarayıcı da aynı şekilde görüntülenmeyebilir.Eğer fontlarınız her tarayıcıda farklı görünüyor ise işte o zaman CSS 3  @fontface kullanmanız gerekmektedir.Font face ; web sayfalarında metin görüntülemek için çevrimiçi olarak yazı tiplerini göstermenize olanak sağlar.

Bu nedenle fontface oldukça önemli ve güzel bir özelliktir. Peki Font-Face i nasıl kullanılır ? 

Font-face kullanımı :


@font-face {
    font-family: Molle;
    src: url('molle-regular-webfont.eot');
    font-weight:400;
}


src : de fontunuzun dosya yolunu göstermeniz gerekiyor,site klasörünüzdeki css dosyalarınızı barındırğınız yere font dosyalarını da atarak hepsini bir arada kullanmanız daha kolay olacaktır.


burayı tanımladıktan sonra div veya class içine font-face imizi ekliyoruz.

h3{ font-family:'Molle',Verdana;
     font-size: 17px;
    color: #FFF; }



Oluşturdugumuz font h3 etiketini kullandığımız yerlerde Molle fontunu uygulayacak,ve böylelikle font face kullanarak Molle fontunu  bütün tarayıcılar da düzgün bir şekilde görüntüleme şansına sahip olacağız.

Son olarak ;
fontsquirrel sitesini ziyaret ederek webfont generator aracını kullarak font u yüklersiniz ve size otomatik olarak fontu font face kullanımı için hazır hale getirerek indirmenize olanak sağlayacaktır.

Herkese Faydalı olması dileğiyle.


Google Web Fonts Kullanımı

google_web_fonts_logo
Google 'ın ücretsiz olarak sunmuş oldugu ve Webmaster ların çok işine yarayan,oldukça popüler olan Google Web Fonts un kullanımını ve küçük detaylarını sizlerle paylaşacağım.

Google Web Fonts şu anda tam 622 font ailesine sahip ve zamanla font ailesi sayısı artmakta olan google web fonts basit kullanımı sayesinde kullanıcılarına büyük bir kolaylık sağlamaktadır.


google_web_fonts




Preview Text : yazan yere görüntülemek istediğiniz fontu girebilir ve fontun metninize nasıl bir görünüm kazandırdıgını görebilirsiniz.Ayrıca harf olarak paragraf ve poster şeklindede önizlemeler yapabilirsiniz.

8 Mart 2013 Cuma

Photoshop Metal Yazı Efekti

photoshop_metal_yazi

Bu makalemde sizlere ; Photoshop'da Metal Yazı efekti oluşturmayı adım adım göstereceğim.

Başlamadan önce ve font ve arkaplan için sizler kendi istedikleriniz seçebilirsiniz.Ben elimde olan bir adet siyah pattern ve Brownwood NF adlı fontu kullandım sizlerde dilerseniz internetten aynı fontu bulup kullanabilirsiniz.

//Luckyorange//