Font-Face özelliği bize basmakalıp yazı tiplerinden kurtarıp daha farklı yazı tipleri sunar. Sistemimiz de yüklü olmayan bu yazı tiplerini kullanmak için de ekstra birkaç şey yapmamız gerekiyor. 
Font-Face yokken bazı alternatif yöntemlerle bu sorunun üstesinden gelinebiliyordu ama o yöntemleri kullanırken bile bazı sorunlar la karşı karşıya kalabiliyorduk. Bu sorunlardan bazıları ise tanımladığımız yazı tiplerine bazı tarayıcılar destek vermiyodu.Hatta tarayıcı destek verse bile bazen işletim sistemi destek vermiyordu misal Linux gibi.Font-Face sayesin de tasarımcılar nihayet bu sorundan kurtuldu.
Nasıl Kullanırım?
İlk olarak bir klasör tanımlayın ve içine de deneme.html ile yazi.css adlı iki adet çalışma oluşturun.Sonra dreamweaver proğramınızı açıp bu dosyaları oraya aktarın.
<!DOCTYPE html>
<html>
<head>
<title>Deneme</title>
<link rel=”stylesheet” type=”text/css” href=”yazi.css” />
</head>
<body>
Hello World!
</body>
</html>
Yazdığınız bu kod karşılığında tarayıcınız da gördüğünüz yazının çok sade ve basit olduğu göreceksiniz. Bu işlemden sonra internetten indireceğimiz yazı tipleri sayesinde daha göze hitap eden yazı tiplerinizin olduğunu göreceksiniz.Yazı tipi indirmek için bir sürü site bulabilirsiniz ama benim kullandığım ve önereceğim linkte olan sitedir. http://www.fontsquirrel.com/fontface
Bu adrese girdikten sonra expert butonuna basarak istediğimiz bir fontu seçiyoruz ve açılan sayfa da Dowload TTF butonuna tıklıyoruz ve yazı tipini bilgisayarımıza indirmiş oluyoruz.
Şimdi sıra ikinci işlem de ; bunları yaptıktan sonra http://www.fontsquirrel.com/fontface/generator adlı linke tıklıyoruz.Açılan sayfa da karşınıza Add Fonts adlı bir buton çıkacaktır.O butona tıklayarak az önce indirdiğimiz yazı tipini yüklüyoruz..Bu işlemlerden sonra Download Your Kit butonuna tıklıyoruz.
İndirdiğimiz klasörü açıyoruz ve bunların arasından “stylesheet.css” adlı sayfayı açıyoruz içinde ki font face kod bloğunu kopyalayıp kendi yazi.css dediğimiz sayfaya ekliyoruz.
@font-face {
font-family: ‘deutsch_gothicnormal’;
src: url(‘deutsch-webfont.eot’);
src: url(‘deutsch-webfont.eot?#iefix’) format(’embedded-opentype’),
url(‘deutsch-webfont.woff’) format(‘woff’),
url(‘deutsch-webfont.ttf’) format(‘truetype’);
font-weight: normal;
font-style: normal;}
Kodunuz bu şekilde gelecektir veya sizin seçtiğiniz formata göre gelecektir ama yapı aynı . Ben bu yazı tipini seçtiğim için bu kodu aldım.En son yapmamız gereken işlem ;
*{font-family: ‘deutsch_gothicnormal’;} adlı satırını css dosyamıza eklemek.Bu işlemler den sonra yazı tipiniz değişmiş olacaktır.
