2010-08-08 11 views
9

मुझे उत्सुकता है कि अगर किसी के पास यह विचार है कि यह सामान दृश्यों के पीछे कैसे काम करता है। मुझे दिलचस्पी है यदि आपके अपने फ़ॉन्ट्स को होस्ट करने का कोई तरीका है और यदि वे वहां के सभी प्रमुख ब्राउज़रों के लिए भी काम करेंगे?टाइपकिट दृश्यों के पीछे कैसे काम करता है?

उत्तर

10

टाइपकिट के ब्लॉग पर this interesting post मिला। यह वह उत्तर था जिसे मैं ढूंढ रहा था।

संपादित करें: मैंने web font server लिखा है जो आलेख में वर्णित कुछ तकनीकों को उधार देता है।

1

मैं कल्पना वे सिर्फ इस तरह फोंट एम्बेड कर रहे हैं:

@font-face { 
    font-family: " your FontName "; 
    src: url(/location/of/font/FontFileName.eot); /* IE */ 
    src: local(" real FontName "), url(/location/of/font/FontFileName.ttf) format("truetype"); /* non-IE */ 
} 

/* THEN use like you would any other font */ 
.yourFontName { font-family:" your FontName ", verdana, helvetica, sans-serif; 
} 

http://randsco.com/index.php/2009/07/04/p680

मुझे लगता है कि परीक्षण किया है और यह IE8, एफएफ, क्रोम और सफारी विंडोज पर काम करता है।

+2

वे इसे इस तरह से नहीं कर रहे हैं - वे डेटा-यूआरआई का उपयोग करके इसे एम्बेड कर रहे हैं, इसलिए किसी सर्वर पर फ़ॉन्ट फ़ाइल का संदर्भ देने के बजाय, बेस 64-एन्कोडेड फ़ॉन्ट सीधे स्टाइलशीट में एम्बेड किया गया है। – Connor

7

मैं सुझाव देता हूं कि WOFF (वेब ​​ओपन फ़ॉन्ट प्रारूप) देखें। नियमित डेस्कटॉप फ़ॉन्ट्स को WOFF में परिवर्तित करने के लिए उपलब्ध विभिन्न एप्लिकेशन (कम से कम एक निःशुल्क वेब ऐप) उपलब्ध होना चाहिए।

आपके इच्छित किसी भी फ़ॉन्ट को एम्बेड करने में एकमात्र असली बाधा लाइसेंसिंग प्रतिबंध हैं, और यह हल करने के लिए टाइपकिट बनाया गया था। वे कानूनी रूप से वेब फोंट को एम्बेड करने का साधन प्रदान करते हैं कि उन्होंने टाइप फाउंड्री — से सदस्यता अधिकार प्राप्त किए हैं, इसलिए सदस्यता लागत।

आप एलीन के सुझाव के रूप में ऐसा कर सकते हैं यदि आप ऐसे फ़ॉन्ट्स पा सकते हैं जिनके पास ऐसे लाइसेंसिंग प्रतिबंध नहीं हैं, या आप वेब उपयोग के लिए विशेष रूप से लाइसेंस प्राप्त डब्ल्यूओएफएफ फोंट प्राप्त कर सकते हैं, और जो तेजी से लोडिंग के लिए भी संपीड़ित हैं। वैकल्पिक रूप से, आप अपने ट्रू टाइप/ओपन टाइप फ़ॉन्ट को WOFF में परिवर्तित कर सकते हैं और वैधता के बावजूद, इच्छित किसी भी फ़ॉन्ट का उपयोग कर सकते हैं।

हालांकि, जिस तरह से बहुत बढ़िया फोंट एम्बेड करता है उन्हें सीएसएस में सीधे एम्बेड करके है:

@font-face { 
    font-family: "bello-pro-1"; 
    src: url(data:font/woff;base64,...=); 
    font-style: normal; 
    font-weight: 400; 
} 

— जहां ... WOFF Base64 में encoded फ़ाइल है। एक बार जब आप एक डब्ल्यूओएफएफ फ़ॉन्ट प्राप्त कर लेते हैं तो आप इसे स्वयं भी कर सकते हैं।

डब्ल्यूओएफएफ में कोई सहज डीआरएम नहीं है, इसलिए मुझे यकीन नहीं है कि फ़ॉन्ट फाउंड्री ने अचानक डब्ल्यूओएफएफ के माध्यम से वेब फोंट को गले लगाने के लिए प्रेरित किया है, लेकिन कुछ फ़ॉन्ट डिजाइनरों से मैंने जो पढ़ा है, उससे ऐसा लगता है कि कुछ हो सकते हैं वेब पेज कैसे काम करते हैं और "समान उत्पत्ति" नीति वास्तव में क्या मायने रखती है, इसकी मौलिक गलतफहमी।

संबंधित मुद्दे