Web sayfalarının büyük bir bölümü yazı formundadır, yani multimedya bileşenler her zaman yazının gerisinde kalır. Bu nedenle sayfaların kullanıcı dostu hale getirilmesinde en optimum nokta genelde yazı bileşenleri üzerinden bulunmaya çalışılır. Farklı yazı tipleri kullanmak de kullanıcı dostu arayüzler yaratmak için en etkili yöntemlerden biridir. Fakat yazı tipleri setimiz sınırlıdır. Bu nedenle genelde, evrensel olarak her makinede var olduğuna inandığımız Arial, Times New Roman, Verdana, Tahoma gibi tipleri kullanmak zorunda kalır ve bir bakıma kendimizi kısıtlarız.
Hakon Wium Lie'ye göre sınırları kaldırma fikri ilk 1998'de gerçekleştirilmeye çalışılmış ama bir tür tarayıcı kavgasına döndüğünden kendi amacının dışına çıkıp unutulmuş. 98'e geri döndüğümüzde Netscape ve IE yazı tipi çeşitliği açısından bu tür bir destek vermeyi kafaya koymuşlar. Fakat iki tarayıcı da günümüzde en sık kullanılan TrueType formatını değil de kendi formatlarını yaratıp, sadece onları destekleyince tarayıcı bağımsızlığı aşılamadığı için kimse bu özellikleri kullanmamıştır.
Bu hikayeden sonra şimdi ne yapabileceğimize başlasak iyi olacak. Mesela Occidental adlıTrueType bir yazı tipini herkesin görebilmesi sağlamak için CSS dökümanımızın içine "import" etmemiz lazım. Bunun için öncelikle Occidental yazı tipini bir bağlantıyla ulaşabileceğimiz herhangi bir alana upload etmemiz gerekiyor. Bu işlemden sonra CSS'e göz atmaya başlayabiliriz.
-
@font-face {
-
font-family: "Occidental";
-
src: url(http://www.burcudogan.com/fonts/occident.ttf) format("truetype");
-
}
-
-
h1 { font-family: "Occidental", Verdana;
-
font-size:72px; color:#3399FF;
-
}
Occident 67KB olduğundan download hızına ekstra bir külfet getirmeyecekdir, çünkü büyüklüğü küçük bir resime eşdeğerdir. Daha fazla örnek için Hakon Wium Lie'nin kendi makalesinde referans verdiği örneklere göz atabilirsiniz.
Kategori?



Made on a
Css ile yüklenen yazı tipleri ayrıca bellekte tutuluyor ama bu önemli bir dezavantaj değil çünkü font başına wn fazla 60-70kb harcıyorsunuz.
True type fontlar acaba Windows dışında da görüntülenebiliyor mu?
^ Evet, truetype'ı ilk bulan zaten Apple'dır.
Gzl ve faideli bir yazı thnxxxxxx
CeLik
LoneLy Codec By Ekin Süpersin 
Bu yontemde genelde IE de problem cıkarıor ozelikle 6 da hec gozukmuo bununla ılgılı ayrıntılı bir arastırma yapmıstım ve buldugum tek gecerlı yol http://www.laydo.net/makale/html/html-de-css-ile-font-embed-yapiyoruz-artik-ozgursunuz.html
ben ie 6 da denedim. olmuyor acaba firefox da çalışır mı?
Teşekkürler Bilgiler için.
Uzun Süredir Aradığımız Fakat Farklı Sonuçlar Aldığımız bir Kod Biçimiydi.
Şans Eseri Görmem Mucize gibi. Tekrar Teşekkürler.
Benzer olarak böyle [*] birşey var ama Win. üzerinde Firefox,IE7 ve Opera'da sorunsuz calisirken benim Linux'umda çalışmadı.
Sanırım sorun benim XFS'in normal yollardan ttf render edememesinden kaynaklanıyor. Yani tam manasıyla platform/tarayıcı bağımsız bir çözüm gibi görünmüyor...
[*] http://www.cameraontheroad.com/index.php?p=524
Bu arada durum nedir bilemiyorum ama söz konusu fontları bir şekilde internete açmak lisans itibariyle soruna yol açar mı acaba, fikri olan var mı?
İsmail,
Öncelikle teşekkürler Linux üzerinde deneme yapmamıştım ki TTF ile Linux dağıtımlarının araları iyi değil, bu nedenle ortaya attkları standart FreeType hatta. Bunu gözden kaçırmış olmam gerçekten ayıp olmuş
Lisans konusunda ise kullanımı ve dağıtımı bedava olan fontların kullanılması lazım, sonuçta bir şekilde bedava dağıtıma açtığınız için başınızın belaya girmesi söz konusu olabilir.
@ Sinan, bu özellik firefox 2.x'lerde var, IE 6 doğal olarak hiçbir standarta uymadığı gibi buna da uymuyor ama IE 7'de bu gözden kaçırılmamış. Opera'nın son serisi destekliyor. Safari 3.x destekliyor. Fazla test yapamadım ama Win ve Mac OS X'de doğru düzgün çalışıyor belirttiğim tarayıcılarla.
Bu yöntemi yanlış hatırlamıyorsam 1 yıl önce bir projede denemiştik, ancak o zaman tarayıcıların neredeyse %90'ı IE6 olduğu için saçma sapan bir durum ortaya çıkmıştı. Sonrasında Verdana amca ve Tahoma halayı kullanmak zorunda kalmıştık..
Şimdilerde ise IE6 kullanımı %20-30 larda bence biraz daha beklemeli. Hele hele sosyal bir ağ iseniz, kullanıcının göz nuru olduğu ortamlarda kullanılmamalı yahut tarayıcı bazlı css yazılmalı..
ek olarak;
sIFR, font olayına daha iyi bir çözüm sunabilir
http://www.mikeindustries.com/sifr
http://wiki.novemberborn.net/sifr/How+to+use
belki bunu birkac temalarimda uygulayabilirim. tesekkurler Burcu
( istersen link degisimi yapabiliriz )
teşekkürler.
fakat anlamadığım bu yazı tipi ilk site yüklenirken mi yükleniyor tamamen?yani sonrasında devamlı siteden çağırılıyor..yoksa kullanılan yerlerde mi yalnızca çağırılıyor?mesela "BAŞLIK" yazdık bu başlık yazısı için gerektiği kadar kb mı çağırılıyor?
+67 kb bence küçük bi resim için fazla büyük ayrıca.:)
alper, fontlar cache'de tutuluyor ve bu sebepten her seferinde sunucundan yeniden istenmiyor. Aynı CSS dosyalarının önbellekte tutulması gibi.
Bu şey için daha erken arkdaşlar, şimdililk bence sIFR ile devame din.
Wolkanca'ya katılıyorum sIFR (yeni versiyonunda adı değişmiş sanırım) kullanmak şu an için daha mantıklı yaklşaık 10-20 kb bir yükleme yapıyor.
@burcu teşekkür ederim.
Süper bi yazı, ilk fırsatta deniycem bunu. Sifr konusuna şöyle bi bakındım, bişey anlamadım, indirmek de istemedim. Css'ye gömmek daha bi rahat olcak benim için. Burcu'ya teşekkürler olur benden de.
Güzel bi yazı.. teknik olarak da faydalı olabilir ama erişilebilirlik açısından sıkıntılı bi yöntem..
İllede ben özel font kullanacam derseniz diğer arkadaşların bahsettiği gibi sifr güzel bişe..
Bi de sıkıya gelince bulduğum TXT2IMG Php Scripti vardı..
Script içine kullanmak istediğiniz font adını (Script ile aynı klasörde) font boyutunu ve rengini veriyosunuz.. çıkış olarak da png alıyosunuz...
Örnek :
http://www.yildirimbaski.com/includes/text2img/image.php?type=manset&text=Merhaba
Örnek 2 :
http://www.yildirimbaski.com/includes/text2img/image.php?type=haber&text=Merhaba%20Siyah
Xp/Sp2 ve Ie 7.0 'da bu kodu kullanarak fontu görmem için windows'ta font dosyasına çift tıklayarak windowsun font görüntüleyicisinde fontu açmam gerekiyor ancak o şekilde görebildim kapatınca font yine gözükmüyor fikri olan??
aklımdaki birşeydi. çok sağolun, ileride işime yarayabilir.