TTF से WOFF2 फ़ॉन्ट कन्वर्टर
फ़ॉन्ट को खुद होस्ट करने की शुरुआत यहीं से होती है। आज का हर ब्राउज़र सबसे पहले WOFF2 ही डाउनलोड करता है, और आपके पास जो TrueType डेटा पहले से है, उसे पैक करने का यह सबसे छोटा फॉर्मेट है। यह पेज उसे लोड करने वाला CSS रूल भी लिख देता है।
फ़ॉन्ट कन्वर्टर
या TTF, OTF, WOFF … फ़ाइलें यहाँ ड्रop करें ·
प्रति फ़ाइल अधिकतम 95 MB· अधिकतम 20 फ़ाइलें· 30 मिनट बाद हटा दी जाती हैं
फ़ाइलें हमारे सर्वर पर प्रोसेस होती हैं और 30 मिनट बाद हटा दी जाती हैं।
जो स्क्रिप्ट आप इस्तेमाल नहीं करते उन्हें हटाने से वेब फ़ॉन्ट सैकड़ों KB से घटकर 30 KB से कम हो सकता है। कंप्यूटर पर इंस्टॉल करने वाले फ़ॉन्ट के लिए सभी अक्षर रखें।
वह टेक्स्ट या अक्षर पेस्ट करें जो फ़ॉन्ट में होने चाहिए, जैसे लोगो का शब्द या हेडलाइन। बाकी सब हटा दिया जाता है।
हिंट Windows स्क्रीन पर छोटे टेक्स्ट को साफ़ बनाते हैं। इन्हें हटाने से वेब फ़ॉन्ट में अक्सर 10–30% बचत होती है; ऑटो-हिंट उन फ़ॉन्ट में हिंट जोड़ता है जिनमें नहीं हैं।
मूल नाम रखने के लिए खाली छोड़ें। नाम बदलने पर बदला हुआ फ़ॉन्ट मूल फ़ॉन्ट के साथ बिना टकराव के इंस्टॉल हो सकता है।
जैसे Regular, Bold, Italic। मूल स्टाइल नाम रखने के लिए खाली छोड़ें।
इस टूल का उपयोग कैसे करें
- 1
TTF फ़ाइलें अपलोड करें
जितने भी वेट और स्टाइल इस्तेमाल करने हैं, सब जोड़ें। एक बार में 20 फ़ाइलें तक, हर फ़ाइल 95 MB तक। Variable TTF भी चलते हैं और उनके axes बने रहते हैं।
- 2
CSS चालू रखें, हो सके तो सबसेट बनाएँ
@font-face CSS शामिल करें पहले से चुना हुआ है। अगर आपकी साइट किसी पश्चिमी भाषा में है, तो एडवांस्ड सेटिंग में रखे जाने वाले अक्षर को Basic Latin या Latin + accents पर रखें, और हिंटिंग को Remove पर सेट करने पर भी विचार करें।
- 3
WOFF2 में कन्वर्ट करें
WOFF2 में कन्वर्ट करें → दबाएँ और फ़ॉन्ट को .css फ़ाइल के साथ डाउनलोड करें। दोनों को अपनी साइट पर अपलोड करें, फिर स्टाइलशीट को लिंक करें या नियम को अपनी CSS में पेस्ट कर लें।
अपनी वेबसाइट के लिए TTF को WOFF2 में कैसे बदलें?
अपनी .ttf अपलोड करें, @font-face CSS शामिल करें को चुना हुआ रहने दें और WOFF2 में कन्वर्ट करें → दबाएँ। आपको .woff2 फ़ाइल के साथ एक .css फ़ाइल मिलती है, जिसमें उसी की ओर इशारा करता @font-face नियम होता है।
वेबसाइट के लिए WOFF2 ही सही वेब फ़ॉन्ट फॉर्मेट क्यों है
TTF बिना कंप्रेस किया टेबल डेटा है: आउटलाइन, मेट्रिक्स, कर्निंग, नाम। WOFF2, जो 2018 में W3C Recommendation के रूप में प्रकाशित हुआ, ठीक यही टेबल रखता है, लेकिन पहले ग्लिफ़ आउटलाइन को इस तरह दोबारा व्यवस्थित करता है कि वे बेहतर कंप्रेस हों, फिर उन्हें Brotli से कंप्रेस करता है, जिसे Google ने 2015 में जारी किया था। Google के अपने परीक्षणों में WOFF2 पुराने WOFF फ़ॉर्मेट से औसतन करीब 30% छोटा निकला, और डाउनलोड के बाद ब्राउज़र मूल फ़ॉन्ट डेटा वापस बना लेता है, इसलिए अक्षरों के आकार में कुछ नहीं बदलता।
फ़ॉन्ट रेंडरिंग को रोकते हैं, इसलिए उनका साइज़ किलोबाइट से ज़्यादा मायने रखता है। वेब फ़ॉन्ट आने तक ब्राउज़र या तो टेक्स्ट छिपाता है या फ़ॉलबैक दिखाता है, और देर से हुआ बदलाव लेआउट को खिसका सकता है। छोटी फ़ाइलें यह अवधि घटाती हैं, और यहाँ दो विकल्प इसे और घटाते हैं: रखे जाने वाले अक्षर वे ग्लिफ़ हटाता है जो आपके पेज कभी नहीं दिखाते, और हिंटिंग को Remove पर रखने से वे निर्देश हट जाते हैं जिन्हें फ़ोन और हाई-डेंसिटी स्क्रीन वैसे भी अनदेखा करते हैं। डेस्कटॉप उपयोग के लिए TTF मास्टर संभालकर रखें; WOFF2 to TTF बाद में वेब फ़ॉन्ट को खोल सकता है, पर सबसेट में हटाए गए ग्लिफ़ वापस नहीं ला सकता।
TTF और WOFF2 का फ़ाइल साइज़
TTF, पूरा कैरेक्टर सेट
100%
बिना कंप्रेस किए फ़ॉन्ट टेबल, जैसे डेस्कटॉप पर इंस्टॉल होते हैं
WOFF2, Basic Latin सबसेट
अक्सर 10–25%
Brotli कंप्रेशन के साथ कम ग्लिफ़; फ़ॉन्ट के अनुसार बदलता है
WOFF2 फ़ॉन्ट के लिए @font-face रूल
@font-face {
font-family: "Brand Sans";
src: url("/fonts/brand-sans-regular.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
unicode-range: U+0000-00FF;
}WOFF2 ब्राउज़र सपोर्ट, हर वर्ज़न के हिसाब से
2014
Chrome 36
Google का ब्राउज़र डिफ़ॉल्ट रूप से WOFF2 डिकोड करने वाला पहला ब्राउज़र बना।
2015
Firefox 39
Mozilla डिफ़ॉल्ट रूप से WOFF2 डिकोडिंग चालू करता है।
2016
Edge 14
Microsoft का पहला Edge Windows 10 Anniversary Update के साथ WOFF2 जोड़ता है।
2018
W3C Recommendation
स्पेसिफ़िकेशन अंतिम हो जाती है; तब तक macOS और iOS पर Safari भी WOFF2 डिकोड करने लगता है।
TTF
TrueType फ़ॉन्ट
TTF, TrueType फ़ॉन्ट फ़ॉर्मैट है जिसे Apple ने 1980 के दशक के अंत में बनाया और 1991 में जारी किया, फिर Microsoft को लाइसेंस दिया। यह ग्लिफ़ की रूपरेखा क्वाड्रैटिक कर्व से तय करता है और हिंटिंग निर्देश शामिल करता है जिससे स्क्रीन पर टेक्स्ट साफ़ दिखता है। इसे हर डेस्कटॉप ऑपरेटिंग सिस्टम, वर्ड प्रोसेसर और डिज़ाइन ऐप सपोर्ट करता है। इसमें OpenType की कुछ उन्नत टाइपोग्राफ़ी सुविधाएँ नहीं हैं और यह वेब फ़ॉन्ट फ़ॉर्मैट से बड़ा होता है।
- कंप्रेशन
- लॉसलेस
- ट्रांसपेरेंसी (पारदर्शिता)
- –
- एनिमेशन
- –
- शुरुआत का वर्ष
- 1991 · Apple
WOFF2
Web Open Font Format 2
WOFF2, Web Open Font Format का दूसरा संस्करण है। यह Google के Brotli कंप्रेशन पर आधारित है और 2018 में W3C Recommendation के रूप में प्रकाशित हुआ था। इसकी फ़ाइलें WOFF से लगभग 30% छोटी होती हैं, जिससे पेज तेज़ी से लोड होते हैं। हर आधुनिक ब्राउज़र WOFF2 को सपोर्ट करता है और वेब फ़ॉन्ट के लिए यही फ़ॉर्मेट सुझाया जाता है। डेस्कटॉप ऑपरेटिंग सिस्टम और डिज़ाइन ऐप इसे सीधे इंस्टॉल नहीं कर सकते।
- कंप्रेशन
- लॉसलेस
- ट्रांसपेरेंसी (पारदर्शिता)
- –
- एनिमेशन
- –
- शुरुआत का वर्ष
- 2018 · W3C (Google)
TTF to WOFF2 डेस्कटॉप फ़ॉन्ट को उस Brotli-कंप्रेस्ड कंटेनर में पैक करता है जिसे ब्राउज़र पसंद करते हैं, ताकि वही ग्लिफ़ कम बाइट में विज़िटर तक पहुँचें; उलटा पेज उनके लिए है जिन्हें वेब पर मिला फ़ॉन्ट इंस्टॉल करना है।
TTF से WOFF2: अक्सर पूछे जाने वाले सवाल
क्या WOFF2 के साथ अब भी TTF या WOFF फ़ॉलबैक चाहिए?
आज के पब्लिक वेबसाइट के लिए आमतौर पर नहीं। Chrome, Edge, Firefox और Safari कई सालों से WOFF2 पढ़ते हैं, और जो कुछ ब्राउज़र नहीं पढ़ते, जैसे Internet Explorer 11, उनके लिए अलग फ़ाइल रखना शायद ही ज़रूरी है। अगर आपके analytics में ऐसे विज़िटर दिखें, तभी TTF to WOFF आउटपुट को दूसरी src एंट्री के रूप में जोड़ें।
मेरा WOFF2 फ़ॉन्ट अब भी 100 KB से बड़ा क्यों है?
कंप्रेशन सिर्फ़ यह घटाता है कि ग्लिफ़ कैसे स्टोर होते हैं, यह नहीं कि कितने हैं। जिस फ़ॉन्ट में Latin, Cyrillic, Greek और Vietnamese सब हैं, वह सबको साथ भेजता है। जिन स्क्रिप्ट को आप सच में दिखाते हैं, सिर्फ़ उनका सबसेट बनाने से टेक्स्ट फ़ॉन्ट कुछ दर्जन किलोबाइट तक आ जाता है।
font-display: swap क्या करता है?
यह ब्राउज़र को बताता है कि टेक्स्ट तुरंत फ़ॉलबैक फ़ॉन्ट में दिखाए और आपका वेब फ़ॉन्ट आते ही उसे बदल दे, बजाय इसके कि डाउनलोड होने तक टेक्स्ट छिपा रहे। इसे ऊपर के उदाहरण की तरह अपने @font-face नियम में जोड़ें, या धीमे कनेक्शन पर देर से होने वाला बदलाव न चाहें तो optional इस्तेमाल करें।
क्या मैं Google Fonts के TTF को WOFF2 में बदलकर खुद होस्ट कर सकता हूँ?
हाँ। Google Fonts के फ़ॉन्ट SIL Open Font License या Apache License के तहत जारी होते हैं, और दोनों कन्वर्ज़न और खुद होस्ट करने की अनुमति देते हैं। फ़ाइल खुद होस्ट करने से किसी थर्ड-पार्टी सर्वर को रिक्वेस्ट भी नहीं जाती।
क्या WOFF2 ईमेल न्यूज़लेटर में काम करता है?
सिर्फ़ कुछ क्लाइंट में। Apple Mail और iOS Mail वेब फ़ॉन्ट को @font-face से लोड करते हैं, जबकि Gmail और ज़्यादातर Outlook वर्ज़न इन्हें अनदेखा करके आपका फ़ॉलबैक फ़ॉन्ट दिखाते हैं। ईमेल के font stack में हमेशा कोई सुरक्षित सिस्टम फ़ॉन्ट रखें।