PNG को ICO में बदलें और एक तीखा फ़ेविकॉन पाएँ
फ़ेविकॉन वह छोटी इमेज है जो किसी वेबसाइट को उसकी दृश्य पहचान देती है। आप इसे ब्राउज़र टैब में पेज शीर्षक के बगल में, अपनी बुकमार्क सूची में, अपने ब्राउज़िंग इतिहास की पता-बार ड्रॉप-डाउन में, और कभी-कभी खोज परिणामों के साथ देखते हैं। यह छोटा होता है, पर बहुत काम करता है: एक पहचाने जाने योग्य फ़ेविकॉन उपयोगकर्ताओं को दर्जनों टैब के बीच आपका टैब ढूँढने में मदद करता है और संकेत देता है कि एक साइट तैयार और देखभाल की गई है। उस छोटे आइकन का क्लासिक फ़ॉर्मेट ICO है, और इसे बनाने का सबसे आसान तरीका एक साफ़ वर्गाकार PNG से शुरू करना और उसे कन्वर्ट करना है।
यह टूल एक PNG इमेज लेता है और उसे आपके ब्राउज़र के भीतर ही ICO फ़ेविकॉन में बदल देता है। कन्वर्ज़न आपके अपने डिवाइस का इस्तेमाल करके स्थानीय रूप से चलता है, इसलिए आपकी चुनी हुई तस्वीर कभी किसी सर्वर पर अपलोड नहीं होती। यह तब मायने रखता है जब आपका आइकन कोई लोगो या ब्रांड संपत्ति हो जिसे आप किसी तृतीय पक्ष को नहीं सौंपना चाहते। जब फ़ाइल तैयार हो जाए, तो आप बस उसे डाउनलोड कर लें।
ICO फ़ॉर्मेट क्या है और यह कई आकार क्यों रखता है
ICO एक आइकन कंटेनर फ़ॉर्मेट है जो Microsoft Windows में उत्पन्न हुआ, जहाँ यह प्रोग्राम, शॉर्टकट और फ़ोल्डर के लिए इस्तेमाल किए जाने वाले आइकन संग्रहीत करता है। इसकी परिभाषित विशेषता, और वेब फ़ेविकॉन के लिए यह मानक क्यों बना, यह है कि एक ICO फ़ाइल एक ही समय में कई रिज़ॉल्यूशन पर एक ही इमेज रख सकती है। एक निश्चित बिटमैप के बजाय, फ़ाइल वर्गाकार इमेज का एक छोटा सेट पैक करती है और ब्राउज़र या ऑपरेटिंग सिस्टम को वह आकार चुनने देती है जो उस जगह फिट हो जहाँ उसे आइकन बनाना है।
यह वाकई उपयोगी है। एक ब्राउज़र टैब को एक छोटे आइकन की ज़रूरत होती है, एक बुकमार्क बार थोड़ा बड़ा इस्तेमाल कर सकता है, और डेस्कटॉप पर एक पिन किया हुआ शॉर्टकट और भी बड़ा माँग सकता है। एक मल्टी-साइज़ ICO के साथ, हर संदर्भ वह संस्करण लेता है जो उसे सूट करे, इसलिए आपका आइकन एक छोटे बिटमैप से बड़ा होने और धुँधला होने की बजाय तीखा रहता है। ICO पारदर्शिता भी संरक्षित रखता है, जो किसी गोल या अनियमित लोगो के कोनों को किसी भी टैब रंग के सामने साफ़ रखता है।
अनुशंसित फ़ेविकॉन आकार
किसी वेबसाइट फ़ेविकॉन के लिए, शामिल करने योग्य तीन आकार हैं 16x16, 32x32 और 48x48 पिक्सेल। 16-पिक्सेल संस्करण वह है जो अधिकांश ब्राउज़र टैब और पता बार में दिखाते हैं। 32-पिक्सेल संस्करण उच्च-रिज़ॉल्यूशन डिस्प्ले पर और कुछ बुकमार्क और इतिहास दृश्यों में इस्तेमाल होता है, इसलिए यह आधुनिक स्क्रीन पर चीज़ों को तीखा रखता है। 48-पिक्सेल संस्करण Windows साइट शॉर्टकट जैसे बड़े संदर्भों को कवर करता है। चूँकि वे सभी एक ICO फ़ाइल के भीतर रहते हैं, आप एक एकल संपत्ति भेजते हैं और हर सतह को अपनी ज़रूरत का चुनाव करने देते हैं।
एक वर्गाकार PNG से शुरू करें ताकि कुछ भी न खिंचे। अगर आपकी स्रोत इमेज आयताकार या बहुत बड़ी है, तो पहले हमारे इमेज रीसाइज़र से इसे एक साफ़ वर्ग में क्रॉप या स्केल करें, फिर कन्वर्ज़न चलाएँ। एक सरल, उच्च-कंट्रास्ट डिज़ाइन 16 पिक्सेल पर एक विस्तृत इलस्ट्रेशन से कहीं बेहतर पढ़ा जाता है, इसलिए बारीक टेक्स्ट के बजाय मोटे आकार पसंद करें।
अपनी साइट में फ़ेविकॉन कैसे जोड़ें
एक बार आपकी ICO फ़ाइल तैयार हो जाने पर, इसे अपनी वेबसाइट पर अपलोड करें, परंपरागत रूप से साइट रूट में favicon.ico के रूप में। कई ब्राउज़र इसे वहाँ अपने आप ढूँढ लेते हैं, पर यह सबसे अच्छी प्रथा है कि इसे अपने HTML के head में स्पष्ट रूप से घोषित करें ताकि कोई अनुमान न हो। इस तरह एक link टैग जोड़ें:
<link rel="icon" type="image/x-icon" href="/favicon.ico">
उस लाइन को अपने पेजों के <head> सेक्शन के भीतर रखें। rel="icon" एट्रिब्यूट ब्राउज़र को बताता है कि यह संसाधन पेज आइकन है, और href उस जगह की ओर इशारा करता है जहाँ आपने फ़ाइल संग्रहीत की है। अगर आप ऊपर जैसा रूट-रिलेटिव पाथ इस्तेमाल करते हैं, तो वही घोषणा आपकी साइट के हर पेज पर काम करती है। डिप्लॉय करने के बाद, आपको हार्ड रिफ़्रेश करना पड़ सकता है या कैश साफ़ करना पड़ सकता है नया आइकन दिखने से पहले, क्योंकि ब्राउज़र फ़ेविकॉन को बड़ी दृढ़ता से थामे रहते हैं।
आपके ब्राउज़र में निजी कन्वर्ज़न
सब कुछ आपके डिवाइस पर होता है। आपका चुना हुआ PNG स्थानीय रूप से पढ़ा, डीकोड और ICO के रूप में फिर से एनकोड किया जाता है, और प्रक्रिया के दौरान कुछ भी आपकी मशीन से बाहर नहीं जाता। कोई अकाउंट नहीं, कोई कतार नहीं और कोई सर्वर-साइड स्टोरेज नहीं, जो इसे अप्रकाशित लोगो या किसी समझौते के तहत क्लाइंट के काम के लिए भी सुविधाजनक बनाता है। ग्राफ़िक्स तैयार करने और व्यवस्थित करने के और तरीकों के लिए, हमारे इमेज टूल्स का पूरा सेट देखें।
अक्सर पूछे जाने वाले प्रश्न
क्या मेरी इमेज कहीं अपलोड होती है?
नहीं। PNG को ICO में पूरी तरह आपके अपने डिवाइस पर आपके ब्राउज़र में कन्वर्ट किया जाता है। कुछ भी किसी सर्वर पर नहीं भेजा जाता और कुछ भी संग्रहीत नहीं होता, इसलिए आपकी इमेज निजी रहती है।
मेरे फ़ेविकॉन में कौन से आकार होने चाहिए?
सबसे उपयोगी आकार 16x16, 32x32 और 48x48 पिक्सेल हैं। 16-पिक्सेल इमेज ब्राउज़र टैब में दिखाई जाती है, जबकि बड़े आकार हाई-रिज़ॉल्यूशन डिस्प्ले और डेस्कटॉप शॉर्टकट पर आइकन को तीखा रखते हैं।
PNG के बजाय ICO क्यों इस्तेमाल करें?
ICO लंबे समय से चला आ रहा फ़ेविकॉन फ़ॉर्मेट है और यह एक फ़ाइल के भीतर कई आकार संग्रहीत कर सकता है। ब्राउज़र और ऑपरेटिंग सिस्टम वह रिज़ॉल्यूशन चुनते हैं जो हर संदर्भ के लिए सही हो, इसलिए आइकन एक ही बिटमैप से स्केल होने की बजाय तीखा रहता है।
क्या ICO मेरे PNG की पारदर्शिता बनाए रखता है?
हाँ। ICO फ़ॉर्मेट पारदर्शिता का समर्थन करता है, इसलिए आपके PNG के आर-पार दिखने वाले क्षेत्र संरक्षित रहते हैं और आइकन किसी भी टैब या पृष्ठभूमि रंग के साथ साफ़ तरीके से मिल जाता है।
मैं अपनी वेबसाइट में फ़ेविकॉन कैसे जोड़ूँ?
ICO फ़ाइल को अपनी साइट पर अपलोड करें, आमतौर पर रूट में favicon.ico के रूप में, और अपने HTML के head में एक link टैग जोड़ें जैसे link rel icon type image x-icon href slash favicon.ico। फिर इसे देखने के लिए अपना ब्राउज़र कैश साफ़ करें।
मेरी स्रोत इमेज वर्गाकार नहीं है। मुझे क्या करना चाहिए?
पहले इसे एक वर्ग में क्रॉप या स्केल करें ताकि यह न खिंचे। आप एक साफ़ वर्ग बनाने के लिए हमारे इमेज रीसाइज़र का इस्तेमाल कर सकते हैं, फिर सबसे अच्छे दिखने वाले फ़ेविकॉन के लिए उसे ICO में कन्वर्ट करें।