विंडोज़, मैक और लिनक्स पर Google रोबोटो फ़ॉन्ट कैसे स्थापित करें

रोबोटो फॉन्ट गूगल द्वारा बनाया गया एक सेन्स-सेरिफ टाइपफेस है। यह सुरुचिपूर्ण है और एंड्रॉइड फोन जैसे उच्च-रिज़ॉल्यूशन स्क्रीन पर अच्छी तरह से प्रस्तुत करता है। जैसे, यह कई अनुप्रयोगों के लिए एकदम सही है। इसके अलावा, विंडोज़, मैकओएस, और लिनक्स पर रोबोटो फॉन्ट को स्थापित करना केक का एक टुकड़ा है।

इस पोस्ट में, हम आपको दिखाते हैं कि विंडोज, मैकओएस, लिनक्स और यहां तक ​​कि अपनी वेबसाइट पर भी Google रोबोटो फॉन्ट कैसे स्थापित करें। आइए शुरू करें!

Google रोबोटो फ़ॉन्ट डाउनलोड करना

आपका प्लेटफॉर्म चाहे जो भी हो, आपको सबसे पहले रोबोटो फॉन्ट पैक डाउनलोड करना होगा। ऐसा करने के लिए, रोबोटो फ़ॉन्ट साइट पर जाएं। संपूर्ण फ़ॉन्ट परिवार को डाउनलोड करने का सबसे सरल तरीका है "परिवार डाउनलोड करें" बटन पर क्लिक करना।

यह आपके कंप्यूटर पर एक ज़िप फ़ाइल के रूप में समाप्त हो जाएगा, जिस बिंदु पर आप इसे अपने ऑपरेटिंग सिस्टम (ओएस) पर स्थापित करने में सक्षम होंगे।

Windows, Mac और Linux पर Google रोबोटो फ़ॉन्ट कैसे स्थापित करें

अच्छी खबर यह है कि आप चाहे जिस प्लेटफॉर्म पर रोबोटो फॉन्ट इंस्टॉल करना चाहें, इसमें कुछ क्लिक लगेंगे।

विंडोज के लिए सबसे पहले रोबोटो फॉन्ट फोल्डर को अनजिप करें। इसके बाद, स्टार्ट मेन्यू पर जाएं और सेटिंग पेज खोलें।

यहां से, निजीकरण विकल्प, फिर फ़ॉन्ट्स पर क्लिक करें।

इसके बाद, निकाले गए फोंट को इंस्टॉलर विंडो पर खींचें। कुछ सेकंड के बाद, विंडोज़ के भीतर Google रोबोटो फॉन्ट स्थापित हो जाएगा। आप इसे वैसे ही चुन सकते हैं जैसे आप अपने इंस्टॉल किए गए एप्लिकेशन में से किसी अन्य फ़ॉन्ट से करते हैं।

मैक के लिए, पहले ज़िप फ़ाइल निकालें, फिर फ़ोल्डर के अंदर के सभी फ़ॉन्ट चुनें (LICENSE.txt पर छोड़कर), राइट-क्लिक करें, और संदर्भ मेनू से "इसके साथ खोलें -> फ़ॉन्ट बुक" चुनें।

यह उन्हें फॉन्ट बुक में लोड करेगा और उन्हें आपके अनुप्रयोगों में उपयोग के लिए उपलब्ध कराएगा।

ध्यान दें कि आप अलग-अलग फ़ॉन्ट फ़ाइलों को फ़ॉन्ट बुक में लोड करने के लिए डबल-क्लिक भी कर सकते हैं।

अपना होम फोल्डर खोलें और हिडन फाइल्स/फोल्डर्स को देखने के विकल्प को इनेबल करें। ".fonts" फ़ोल्डर का पता लगाएँ। यदि यह मौजूद नहीं है, तो इसे बनाएं। इसके बाद, रोबोटो फ़ॉन्ट फ़ोल्डर को इस “.fonts” फ़ोल्डर में ले जाएँ।

वैकल्पिक रूप से, आप अपने फोंट को प्रबंधित करने के लिए फ़ॉन्ट प्रबंधक प्रोग्राम का उपयोग कर सकते हैं।

1. सॉफ्टवेयर केंद्र या भंडार से फ़ॉन्ट प्रबंधक स्थापित करें।

2. एक बार इसके इंस्टाल हो जाने के बाद, इसे और फ़ॉन्ट्स ऐप (फिर से, सर्च बार से) खोलें।

3. फॉन्ट मैनेजर में, सुनिश्चित करें कि आप मैनेज टैब पर हैं और प्लस आइकन पर क्लिक करें।

4. अपने निकाले गए फ़ॉन्ट फ़ोल्डर में नेविगेट करें और उन्हें आवश्यकतानुसार जोड़ें।

आपके द्वारा उपयोग किए जा रहे ऐप्स को पुनरारंभ करने के बाद, आपको चयन के लिए उपलब्ध रोबोटो फ़ॉन्ट देखना चाहिए।

किसी वेबसाइट पर Google रोबोटो फ़ॉन्ट का उपयोग करना

यदि आप अपनी वेबसाइट पर रोबोटो फॉन्ट का उपयोग करना चाहते हैं, तो आप CSS3 @font-face का उपयोग कर सकते हैं। बाहरी फ़ॉन्ट को अपने वेबपेज पर एम्बेड करने के लिए सिंटैक्स।

FontSquirrel रोबोटो फॉन्ट पेज पर जाएं, "वेबफॉन्ट किट" पर क्लिक करें, फिर अपना पसंदीदा फॉन्ट फॉर्मेट, एक सबसेट (यदि कोई हो) चुनें और "@Font-Face Kit डाउनलोड करें" पर क्लिक करें।

ज़िप की गई फ़ाइल को अपनी वेबसाइट के फ़ॉन्ट फ़ोल्डर में निकालें। अपनी वेब स्टाइलशीट खोलें और निम्नलिखित कोड जोड़ें:

@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Regular-webfont.eot');
    src: url('Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-Regular-webfont.woff') format('woff'),
         url('Roboto-Regular-webfont.ttf') format('truetype'),
         url('Roboto-Regular-webfont.svg#RobotoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Italic-webfont.eot');
    src: url('Roboto-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-Italic-webfont.woff') format('woff'),
         url('Roboto-Italic-webfont.ttf') format('truetype'),
         url('Roboto-Italic-webfont.svg#RobotoItalic') format('svg');
    font-weight: normal;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Bold-webfont.eot');
    src: url('Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-Bold-webfont.woff') format('woff'),
         url('Roboto-Bold-webfont.ttf') format('truetype'),
         url('Roboto-Bold-webfont.svg#RobotoBold') format('svg');
    font-weight: bold;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('Roboto-BoldItalic-webfont.eot');
    src: url('Roboto-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-BoldItalic-webfont.woff') format('woff'),
         url('Roboto-BoldItalic-webfont.ttf') format('truetype'),
         url('Roboto-BoldItalic-webfont.svg#RobotoBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Thin-webfont.eot');
    src: url('Roboto-Thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-Thin-webfont.woff') format('woff'),
         url('Roboto-Thin-webfont.ttf') format('truetype'),
         url('Roboto-Thin-webfont.svg#RobotoThin') format('svg');
    font-weight: 200;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('Roboto-ThinItalic-webfont.eot');
    src: url('Roboto-ThinItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-ThinItalic-webfont.woff') format('woff'),
         url('Roboto-ThinItalic-webfont.ttf') format('truetype'),
         url('Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg'); (under the Apache Software License). 
    font-weight: 200;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Light-webfont.eot');
    src: url('Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-Light-webfont.woff') format('woff'),
         url('Roboto-Light-webfont.ttf') format('truetype'),
         url('Roboto-Light-webfont.svg#RobotoLight') format('svg');
    font-weight: 100;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('Roboto-LightItalic-webfont.eot');
    src: url('Roboto-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-LightItalic-webfont.woff') format('woff'),
         url('Roboto-LightItalic-webfont.ttf') format('truetype'),
         url('Roboto-LightItalic-webfont.svg#RobotoLightItalic') format('svg');
    font-weight: 100;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Medium-webfont.eot');
    src: url('Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-Medium-webfont.woff') format('woff'),
         url('Roboto-Medium-webfont.ttf') format('truetype'),
         url('Roboto-Medium-webfont.svg#RobotoMedium') format('svg');
    font-weight: 300;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('Roboto-MediumItalic-webfont.eot');
    src: url('Roboto-MediumItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('Roboto-MediumItalic-webfont.woff') format('woff'),
         url('Roboto-MediumItalic-webfont.ttf') format('truetype'),
         url('Roboto-MediumItalic-webfont.svg#RobotoMediumItalic') format('svg');
    font-weight: 300;
    font-style: italic;
}

सुनिश्चित करें कि आपने फ़ॉन्ट फ़ोल्डर के पथ को इंगित करने के लिए "src" को बदल दिया है।

इसके बाद, आप सिंटैक्स का उपयोग कर सकते हैं font-family:"Roboto"; अपने वेब पेज पर रोबोटो फ़ॉन्ट प्रदर्शित करने के लिए।

निष्कर्ष में

Google का रोबोटो फॉन्ट हेल्वेटिका और एरियल जैसे मेनस्टेज का एक स्टाइलिश विकल्प है। क्या अधिक है, यह Google की सामग्री डिज़ाइन पहल में सबसे आगे है। फिर भी, रोबोटो सभी तरह के अनुप्रयोगों में काम करता है, और इसे विंडोज, मैकओएस, लिनक्स और यहां तक ​​कि आपकी वेबसाइट पर स्थापित करना आसान है।

यदि आप रोबोटो के प्रशंसक नहीं हैं, तो विभिन्न साइट डिज़ाइन तत्वों की जांच करने के तरीके पर हमारा लेख आपको यह जानने में मदद कर सकता है कि किसी विशिष्ट वेबसाइट पर कौन से फोंट का उपयोग किया जाता है। क्या आप अपने कंप्यूटर पर रोबोटो फॉन्ट का उपयोग करते हैं, और यदि हां, तो किस उद्देश्य के लिए? हमें नीचे टिप्पणी अनुभाग में बताएं!