Dikkat: Bu yazı güncel olmayan bilgiler içerir. Güncel yazıyı okumak için tıklayınız.
Diyelim ki kız arkadaşınıza bir site yaptınız, ona yazdığınız şiirleri – ki böyle biri var mıdır bilmiyorum – web sitenizde yayınlıyorsunuz. Ya her başlığı grafik olarak düzenleyerek o ana göre hoş bir yazı tipi kullanacak ya da Times New Roman, Arial gibi klasik fontlara mahkum olacaksınız.
Bir çocuk siteniz var, düzenli haberler giriyorsunuz. Haber başlıklarını grafik olarak düzenleyerek çocukların ilgisini çekecek bir font kullanacak, ya da Times New Roman, Arial gibi fontların kölesi olacaksınız.
İşte çekilecek bu eziyeti önceden farkedip dayanamayan, günlerce annesinin ‘Mike oğlum uyu artık, Mike çocuğum yemeğe gel!’ laflarının arasında bu güzel, şirin, bir o kadar da küçük ve kullanışlı (şeyi) yazan Mike Davidson‘ın ’sIFR’ adlı eklentisini burada inceliyor, kullanımına göz atıyoruz.
sIFR küçük bir flash, birkaç javascript ve css dosyasıyla çok iyi işler çıkarabiliyor. Bu küçük uygulama CSS’den tanıdığımız headline (h1, h2 vb.) normal yazınızı, karşıdaki kişinin bilgisayarında olmasa bile, istediğiniz her font ve renge dönüştürme olanağı sağlıyor. Ayrıca sIFR;
Şimdi de sIFR’i nasıl kullanacağımıza değinelim.
sIFR-print.css ve sIFR-screen.css dosyalarını sayfalarınıza ekleyin.sifr.js adlı javascript dosyasını sayfanıza ekleyin;
<script type="text/javascript">if(typeof sIFR == "function"){ sIFR.replaceElement("h1", named({sFlashSrc: "./flashadi.swf", sColor: "#000", sCase: "upper"})); }; </script>
sFlashSrc kodu ile hazırladığımız swf dosyamızın yolunu belirtiyor, sColor:ile yazımının rengini belirliyoruz. Tam listeye zip dosyasından çıkan ‘documentation’ bölümünden ulaşınız.h1 {
font-size: 16px;
font-family:'Lucida Grande', 'Lucida Sans Unicode', Arial;
color:#FFFFFF;
font-weight:normal;
}Bu headline’ı HTML dosyamızda istediğimiz yere ekliyoruz, bu sIFR tarafından değiştirilecek olan yazımız olacak.<h1>İşte bu kadar kolay</h1>.sIFR-hasFlash h1 {
visibility: hidden;
font-size: 16px;
text-align:center;}Burada visibility: hidden; kodunda bir değişiklik yapmamaya dikkat edin.Etiketler: kullanım kılavuzu, makale, sIFR
YORUMLAR
TOPLAM 36 YORUM.
Yorumlarınız değerlidir. Bu yazıyla ilgili düşüncelerinizi belirtebilir, yardım talebinde bulunabilirsiniz.
Abdullah Dağlı, (#) - 21.1.2006
bunu ben de arıyordum açıkçası.Ancak benim merak ettiğim web sayfamızda standart fontlar dışındaki fontları flash yöntemi dışında bir yöntemle kullanamıyor muyuz?Yani bir html koduyla (ve ya dinamik bir dille) fontları kodlarımıza import ederek bunun tanınmasını sağlıyamıyor muyuz.Ancak bu flash işini ilk defa duyduğumu itiraf edeyim…
Muhammet Sevim, (#) - 21.1.2006
sIFR kullanmadan sade HTML kodları ile kullanıcının bilgisayarında olmayan fontları göstermek de tabii ki mümkün, ancak sIFR kadar sağlıklı değil. Bunun için Microsoft’un bir küçük ve eski(!) programı olan Weft’i kullanmak gerekiyor. Uğraştırıcı, sağlıksız. Bununla ilgili Azerice’den çevirdiğim (ya da çevirmeye çalıştığım) bir makale vardı. http://www.sadecedizayn.com/??=ders&DersID=60 adresinden ulaşman mümkün.
Abdullah Dağlı, (#) - 21.1.2006
makale açılmıyor.Ama dediğin gibi bu en iyisi gibi görünüyor.Ancak denemedim ama inşallah sistemde hız farkı oluşturmaz… :)
Muhammet Sevim, (#) - 21.1.2006
Sistemde hız farkı oluşmaz, daha önceden dediğim gibi 10 kb’den küçük bir boyutu olduğu gibi sadece bir kez yükleniyor. Ama yinede uzun makaleleri sIFR ile yazdırmanı tavsiye etmem, başlıklar kafidir :)
Abdullah Dağlı, (#) - 21.1.2006
:) bunu kullanacağım sağol bu yazın ve yardımların için…
Erhan BAYRAK, (#) - 20.3.2006
evet çok teşekkürler yazıda çok güzel ve anlaşılır olmuş. ilk denememde becerdim :)
oky, (#) - 30.5.2006
bir gün bunun yapılacağını biliyordum!
kullanmayı planlıyorum, teşekkürler.
esatergun, (#) - 14.6.2006
çok anlaşılır açıklanmış ama uzun iş gibi geldi bana.
skykhan, (#) - 19.6.2006
Evet mümkün hatta bir eklentisi bile var wordpress de. Ama şu şekilde çalışıyor; yazı başlığına senin yazdığın yazı çıkıyor onun üstünede istediğin font çıkıyor. Bazen yazı ile font birbirine giriyor baya kötü bir şey.
Mesut Murt, (#) - 6.7.2006
Anlatomlarınız için teşekürler. Fakat ben 2-3 defa denediysemde olumlu bir sonuç alamadım .. örnek bir dosyayı sitenize koyma imkanınız var mı.. indirip incelesek .. ve hatamızın nerde olduğunu tesbit edebilsek iyi olur gibi…
yakuter, (#) - 21.7.2006
Her ne kadar ingilizcesini okuyup sitemde kullandıktan sonra makaleni görmüş olsam da :( çok güzel bir makale ;) teşekkür ederim. :) Ha bu arada sitemde bu makalenden de bahsettim ;)
Bora Dan, (#) - 20.8.2006
Verdiğin bilgiler için çok sağol. Baya İşime Yaradı ve aradığım şeydi tam olarak. 3. denememde yapmış olsamda o kadar zorlanmadım :). bu yazıyı(linkini belirterek) sitemde insanlarla paylaşıcam inşallah.
kolay Gelsin
Ömer Sinan Ağacan, (#) - 30.8.2006
Gerçekten çok güzel bir şey. Yeni tasarımlarımda h3 niyetine sürekli sFIR tekniği ile çok güzel fontlar kullanıyorum.
Bu arada sFIR ın CSS dosyalarını tüm sayfalara eklemek yerine asıl CSS dosyamıza eklesek daha pratik olmaz mı?
Ömer Sinan Ağacan, (#) - 31.8.2006
Herşey güzel de, ben wordpress kullanıcısıyım, kendi temamı yaparken onlarca temadan esinlendim ve sFIR dosyasını da başka bir temadan aldım. Fakat o dosyada türkçe karakter desteği yok, font türkçe karakterleri destekliyor ama türkçe karatker yazdığımda boşluk oluşuyor, acaba türkçe karakterleri nasıl tanıtabilirm?
Sanalmanyak, (#) - 31.10.2006
evet ben de Ömer le aynı sorunu yasıyorum nasıl Türkçe karakter sorununu da hallederiz bu konuda da yardımcı olur musun
Muhammet Sevim, (#) - 31.10.2006
Merhaba,
Bu sayfa üzerinden sorununuzun çözümün ulaşabilirsiniz. Kolay gelsin.
Sanalmanyak, (#) - 1.11.2006
yapamadım desem :( abi sen bunun türkçeleşmiş halini yollasan çok mu olurum:S
sIFR İle Güzelleşelim « En iyi Blog SiteLeri, (#) - 7.11.2006
[...] Sanırım iki resim arasındaki 7 farkı görebiliyorsunuzdur sIFR, sitenizdeki normal karakterleri javascript kullanarak flash dosyasındaki karakterler ile değiştiriyor. Bu da doğal olarak görünümü resimdeki gibi pürüzsüzleştiriyor. Tabi bunu duyunca hemen atladım siteye. Biraz uğraştırdı ama yine de düzelttim büyük karakterlerimi. Daha sonra da her zaman yaptığım gibi bu öğrendiklerimi bir makaleye dökmeye ve sIFR ‘ın kullanımını anlatmaya karar verdim. Ta ki Muhammet Sevim‘in bunu zaten çok güzel bir şekilde anlattığını görene kadar [...]
Türkçe CSS kaynakları | Blog ve Wolkanca - işimiz gücümüz blog!, (#) - 15.2.2007
[...] Web’de font özgürlüğü: ’sIFR’ [...]
code64, (#) - 11.4.2007
Çok güzel bir açıklama olmuş eline sağlık ama benim gibi acemiler için biraz zor görünüyor
code64, (#) - 11.4.2007
Ya hocam çok güzel anlatmıssın ama ben 7. adımda takıldım oradaki kodu nereye yapıştırıcaz
bunu nereye koyucam anlamadım
Ömer, (#) - 4.8.2007
hocam 6. adındaki dosyaları nereye ve nasıl ekleyebiliriz.
Muhammet Sevim, (#) - 4.8.2007
@ömer,
kısa süre içerisinde sIFR’in yeni versiyonu olan 3′ün ayrıntılı kullanım kılavuzunu yazacağım. Hem daha ayrıntılı olacak, hem de yeni versiyonun kullanımını anlatacağı için, bu gece veya yarına kadar beklemeni rica ediyorum.
Ömer, (#) - 4.8.2007
teşekkürler..
Muhammet Sevim » sIFR 3: Kullanım Kılavuzu · Dijital Medya Tasarımı, Web standartları (CSS/XHTML) ve dünyada olup bitenler üzerine…, (#) - 6.8.2007
[...] anlamadıysanız ve “sIFR” kelimesini yanlış yazdığımızı düşünüyorsanız, tekniğin tanıtıldığı yazının giriş bölümünü okumanızı tavsiye [...]
ikra.web.tr, (#) - 27.10.2007
bu güzel paylaşımınızdan dolayı çok teşekkür ederim
buna ihtiyacım v ardı denedim çok uğraştım ama bir sonuca ulaşamadım.
şu aşağıdaki linke bakarak sorunun nerede olduğunu tahmin edebilir misiniz?
http://www.ikra.web.tr/site/sifr.php
acaba hangi aşamada hata yapmışım? teşekkürler…
bu arada szie ulaşabileceğim bir iletişim linki aradım bulamadım…
insomniac, (#) - 11.6.2008
güzel anlatmışsın teşekkürler…denedim yaptım ama bi font için bu kadar işkence çekilmez ya :)
cn_erdem, (#) - 5.9.2008
Merhaba!
Açıklamaların için çok teşekkür ederim yanlız bu sistemin kurulumunu video şeklinde anlatman mümkün mü ? Bu tür karışık gözüken işlemleri pek bilmeyen arkadaşlar için video yapıldığı takdirde çok yaralı olacağı zannındayım ayrıca Herhalde bu konuda yapılmış tek Türkçe video kaynak olma husunda da çok önemli bir görev üstlenecektir.
Teşekkürler…
0 n 8 = ? » Blog Archive » Flash kullanmadan sIFR yapımı, (#) - 3.11.2008
[...] sağlıyor. Bu konu hakkında Muhammet Sevim’in kullanım kılavuzu makalesini ve sIFR tanıtım makalesini okuyabilirsiniz. Ayrıca uygulamanın fikir babası olan Mike Davidson’ın konu hakkındaki [...]
» Adobe Flash kullanmadan sIFR yapımı »»» adobe, coffeecup, design, flash, font, font maker, generator, opentype, sifr, sifr font maker, sifrgenerator, swf, tasarım, truetype, üreteç, yaratıcı, yazıtipi chat odaları , (#) - 8.11.2008
[...] konu hakkında Muhammet Sevim’in kullanım kılavuzu makalesini ve sIFR tanıtım makalesini okuyabilirsiniz. Ayrıca uygulamanın fikir babası olan Mike Davidson’ın konu hakkındaki [...]
sIFR 3.0 Kurulumu : gurcell technology, (#) - 8.2.2009
[...] de birşey anlamadıysanız ve “sIFR” kelimesini yanlış yazdığımızı düşünüyorsanız, tekniğin tanıtıldığı yazının giriş bölümünü okumanızı tavsiye [...]
Ajans, (#) - 15.2.2009
Arkadaşlar ben bu olayı ne yaptıysam çalıştıramadım, acaba sorun sunucudamı bendemi yoksa dildemi çözemedim gitti, hemde herşeyi okuduğum halde..
Muhammet Sevim, (#) - 15.2.2009
Bu yazıyı değil de, aşağıdaki linkten ulaşabileceğiniz yazıdaki talimatları uygulayıp güncel versiyonu bir de o şekilde uygulamanızı öneririm. Eğer local veya gerçek bir sunucudan çalıştırmayı denerseniz script sorunsuz olarak işleyecektir.
http://www.muhammetsevim.com/yazi/sifr-3-kullanim-kilavuzu/
sIFR 3.0 Kurulumu | gurcell technology, (#) - 21.2.2009
[...] de birşey anlamadıysanız ve “sIFR” kelimesini yanlış yazdığımızı düşünüyorsanız, tekniğin tanıtıldığı yazının giriş bölümünü okumanızı tavsiye [...]
Web’de Yazı Tipi Özgürlüğü | UBenzer | Umut Benzer | O da kim?, (#) - 27.8.2009
[...] http://www.muhammetsevim.com/yazi/webde-font-ozgurlugu-sifr/ [...]
Türkçe CSS Kaynakları ve Yazıları « WebeGe Blog, (#) - 12.12.2009
[...] Web’de font özgürlüğü: ’sIFR’ [...]
Yorumunuzu ekleyin
E-posta adresiniz hiçbir zaman yayınlanmayacaktır. Temel HTML metin şekillendirilmesi izinlidir. Sadece bu konuyla ilgili yorum yapmayı unutmayınız. Teşekkürler :)