धुंधला टैब आइकन, जिस पर तब तक ध्यान नहीं जाता जब तक वह अपनी साइट न हो
आप वेबसाइट में फेविकॉन जोड़ने के लिए बस PNG लोगो का नाम बदलकर favicon.ico कर देते हैं और डाल देते हैं, और यह ज्यादातर चल जाता है — जब तक आपको ध्यान नहीं आता कि ब्राउज़र टैब का आइकन बाकी जगह जितना साफ दिखने के मुकाबले थोड़ा धुंधला या अजीब तरह से कटा हुआ लग रहा है। ऐसा इसलिए होता है क्योंकि एक ही इमेज फाइल को ब्राउज़र को जितनी छोटी साइज़ चाहिए उतने में खींचा या दबाया जाता है, और यह स्केलिंग शायद ही कभी उतनी शार्प दिखती है जितनी उस खास साइज़ के लिए बनाई गई वर्ज़न दिखती।
सही .ico फाइल इसे अलग तरीके से हल करती है: एक इमेज को तुरंत रीसाइज़ करने के बजाय, यह कई पहले से बनी साइज़ को एक फाइल में साथ बांधती है, तो ब्राउज़र किसी को खींचने-दबाने के बजाय पहले से सही साइज़ वाला वर्ज़न चुन लेता है।
एक फाइल में कई इमेज क्यों हो सकती हैं
यही वह हिस्सा है जो .ico को सामान्य इमेज फाइल से असल में अलग बनाता है: यह एक कंटेनर फॉर्मेट है जो एक साथ कई अलग इमेज रख सकता है — आमतौर पर 16, 32, 48, 64, 128 और 256 पिक्सल, सब एक ही .ico फाइल में। ब्राउज़र टैब को एक छोटा 16px आइकन चाहिए; डेस्कटॉप शॉर्टकट या ऐप आइकन को कहीं बड़ा कुछ चाहिए; सही .ico हर सिचुएशन को उसकी अपनी, पहले से रेंडर की गई साइज़ देता है, न कि एक ही इमेज से सारा काम चलवाता है।
यही वजह है कि सिर्फ PNG का नाम बदलकर .ico कर देना वैसे काम नहीं करता जैसा लोग सोचते हैं — यह तकनीकी रूप से कुछ जगहों पर लोड हो जाता है, पर वहाँ भी बस एक ही साइज़ को बाकी हर जगह खींचा जा रहा होता है, जो इस फॉर्मेट का असली मकसद ही चूक जाता है।
आपकी सोर्स इमेज स्क्वेयर क्यों होनी चाहिए
चूंकि .ico के अंदर बनने वाली हर साइज़ एक स्क्वेयर के रूप में रेंडर होती है, नॉन-स्क्वेयर सोर्स इमेज को फिट करने के लिए खींचा या दबाया जाता है — यहीं ज्यादातर फेविकॉन कोशिशें साफ गलत हो जाती हैं, खासकर सिंबल के साथ टेक्स्ट वाले चौड़े लोगो में। एक स्क्वेयर सोर्स (या ऐसी इमेज जिसमें असली सब्जेक्ट बीच में हो और आसपास पर्याप्त जगह हो) हर साइज़ में साफ नतीजा देता है, जबकि एक चौड़ा लोगो स्क्वेयर में ठूँसने पर लगभग हमेशा अजीब लगता है।
अगर आपके पास सिर्फ एक चौड़ा हॉरिज़ॉन्टल लोगो है, तो आमतौर पर बेहतर है कि सिर्फ उसका आइकन या सिंबल वाला हिस्सा अलग निकालें — अपने आप में स्क्वेयर — बजाय इसके कि पूरा वर्डमार्क 16px के स्क्वेयर में ठूँसें जहाँ टेक्स्ट वैसे भी पढ़ा नहीं जा सकेगा।
अंदर का आधुनिक फॉर्मेट, और इसका व्यावहारिक मतलब
आजकल की .ico फाइलें आमतौर पर PNG-एम्बेडेड फॉर्मेट इस्तेमाल करती हैं (Windows Vista से सपोर्टेड और सभी ब्राउज़र में यूनिवर्सल), पुराने रॉ बिटमैप-आधारित फॉर्मेट के बजाय — कंटेनर के अंदर हर साइज़ एक सामान्य PNG इमेज के रूप में स्टोर होती है, जो पुराने फॉर्मेट की जटिल संरचना के मुकाबले सरल, ज्यादा व्यापक रूप से कम्पैटिबल और सही तरीके से बनाना आसान है।
व्यावहारिक रूप से, इसका मतलब है कि आज एक सही ढंग से बना फेविकॉन कन्वर्टर दशकों पुरानी बिटमैप कम्पैटिबिलिटी की उलझनों की चिंता नहीं करता — उसे बस हर टारगेट साइज़ में साफ PNG रेंडर करना है और उन्हें सही तरीके से कंटेनर में पैक करना है।