फ़ेविकॉन क्या है?

फ़ेविकॉन क्या है, उसका काम क्या है, और वह साइट के ब्रांड व इस्तेमाल के अनुभव को कैसे बेहतर बनाता है — यह गाइड यही समझाती है। अपनी साइट के लिए फ़ेविकॉन बनाना भी इसमें शामिल है।

फ़ेविकॉन की परिभाषा

फ़ेविकॉन, "favorite icon" (पसंदीदा आइकन) का छोटा रूप है — एक छोटी आइकन या छवि जो किसी वेबसाइट या पेज को दर्शाती है। यह ब्राउज़र और डिवाइस पर कई जगह दिखती है: सबसे आम तौर पर टैब में पेज टाइटल के पास, बुकमार्क में, ब्राउज़र इतिहास में, और मोबाइल होम स्क्रीन पर जब साइट शॉर्टकट के रूप में सेव की जाती है।

फ़ेविकॉन आमतौर पर वर्गाकार छवियाँ होती हैं, अक्सर 16x16, 32x32 या 48x48 पिक्सेल। आधुनिक इस्तेमाल में हाई-रिज़ॉल्यूशन डिस्प्ले और मोबाइल के लिए 512x512 पिक्सेल तक के बड़े आकार भी चलते हैं।

फ़ेविकॉन कहाँ दिखते हैं

उपयोगकर्ताओं को आपकी साइट पहचानने और उस तक पहुँचने में मदद के लिए फ़ेविकॉन कई जगह दिखते हैं:

  • ब्राउज़र टैब: सबसे दिखने वाली जगह — ब्राउज़र टैब में पेज टाइटल के पास
  • बुकमार्क: बुकमार्क सूची में नाम के बगल में
  • ब्राउज़र इतिहास: ब्राउज़र के इतिहास मेन्यू में
  • एड्रेस बार: कुछ ब्राउज़र एड्रेस बार में भी फ़ेविकॉन दिखाते हैं
  • मोबाइल होम स्क्रीन: जब उपयोगकर्ता साइट को होम स्क्रीन पर जोड़ते हैं, तो फ़ेविकॉन ऐप आइकन बन जाता है
  • खोज परिणाम: कुछ सर्च इंजन खोज परिणामों के बगल में फ़ेविकॉन दिखाते हैं
ब्राउज़र टैब, बुकमार्क और एड्रेस बार में फ़ेविकॉन कैसे दिखते हैं, इसके उदाहरण

उदाहरण: टैब और बुकमार्क में दिखते फ़ेविकॉन

फ़ेविकॉन क्यों ज़रूरी हैं

फ़ेविकॉन साइट की ब्रांडिंग और इस्तेमाल के अनुभव दोनों में अहम भूमिका निभाते हैं:

ब्रांड पहचान

अच्छा डिज़ाइन वाला फ़ेविकॉन खुले टैब के बीच आपकी साइट को तुरंत पहचानने में मदद करता है। यह ब्रांड को मजबूत करता है और साइट याद रहती है।

पेशेवर रूप

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

इस्तेमाल का अनुभव

फ़ेविकॉन से बुकमार्क, इतिहास और खुले टैब में साइट ढूँढना आसान हो जाता है। जो लोग बार-बार आते हैं, उनके लिए यह खास तौर पर काम आता है।

मोबाइल अनुभव

मोबाइल पर, होम स्क्रीन पर जोड़ने पर फ़ेविकॉन ऐप आइकन बनता है। साफ़ और पहचाना जा सकने वाला आइकन मोबाइल अनुभव को बेहतर बनाता है।

फ़ेविकॉन के प्रारूप और आकार

आधुनिक साइटों को सभी ब्राउज़र और डिवाइस पर ठीक दिखने के लिए कई प्रारूप और आकार देने चाहिए:

ICO प्रारूप

पारंपरिक favicon.ico प्रारूप, आमतौर पर 16x16 या 32x32 पिक्सेल। सबसे व्यापक समर्थन वाला प्रारूप है और हर ब्राउज़र में चलता है।

PNG प्रारूप

PNG फ़ेविकॉन 16x16, 32x32, 48x48, 96x96, 180x180, 192x192 और 512x512 पिक्सेल जैसे कई आकारों में आम हैं। ICO की तुलना में गुणवत्ता बेहतर होती है और पारदर्शिता भी मिलती है।

SVG प्रारूप

SVG (Scalable Vector Graphics) फ़ेविकॉन रिज़ॉल्यूशन से स्वतंत्र होते हैं और हर आकार पर साफ़ दिखते हैं। आधुनिक ब्राउज़र इन्हें समर्थन देते हैं, इसलिए हाई-रिज़ॉल्यूशन डिस्प्ले के लिए ये उपयुक्त हैं।

Apple Touch Icon

Apple डिवाइस होम स्क्रीन आइकन के लिए apple-touch-icon.png का उपयोग करते हैं, आमतौर पर 180x180 पिक्सेल। इससे iOS होम स्क्रीन पर सेव करने पर साइट पेशेवर दिखती है।

फ़ेविकॉन आकार के उदाहरण

16x16 पिक्सेल फ़ेविकॉन का उदाहरण16×16
32x32 पिक्सेल फ़ेविकॉन का उदाहरण32×32
48x48 पिक्सेल फ़ेविकॉन का उदाहरण48×48
96x96 पिक्सेल फ़ेविकॉन का उदाहरण96×96

उदाहरण: वही फ़ेविकॉन अलग-अलग आकारों में

फ़ेविकॉन डिज़ाइन की अच्छी प्रथाएँ

फ़ेविकॉन बनाते समय ये डिज़ाइन सिद्धांत ध्यान में रखें:

  • सरलता: फ़ेविकॉन छोटे होते हैं, इसलिए सरल आकार सबसे अच्छा काम करते हैं। छोटे आकार पर गायब हो जाने वाले बारीक विवरण से बचें
  • ऊँचा कंट्रास्ट: अलग-अलग ब्राउज़र पृष्ठभूमि पर दिखने के लिए अच्छे कंट्रास्ट वाले रंग चुनें
  • ब्रांड की एकरूपता: फ़ेविकॉन ब्रांड से जुड़ा होना चाहिए और समग्र डिज़ाइन का हिस्सा दिखना चाहिए
  • स्केलेबिलिटी: 16x16 से 512x512 पिक्सेल तक हर आकार पर ठीक दिखे, ऐसा डिज़ाइन करें
  • जाँच: अलग-अलग ब्राउज़र और डिवाइस पर जाँचें कि फ़ेविकॉन सही दिख रहा है
सरल, ऊँचे कंट्रास्ट वाले अच्छे फ़ेविकॉन डिज़ाइन के उदाहरण

अच्छे उदाहरण: सरल, ऊँचे कंट्रास्ट वाले फ़ेविकॉन

बहुत जटिल या कम कंट्रास्ट वाले खराब फ़ेविकॉन डिज़ाइन के उदाहरण

बचें: बहुत जटिल या कम कंट्रास्ट वाले डिज़ाइन

फ़ेविकॉन कैसे बनाएँ

आधुनिक टूल के साथ फ़ेविकॉन बनाना पहले से आसान है। चाहे शून्य से शुरू करें या मौजूदा डिज़ाइन से बनाएँ, आप यह कर सकते हैं:

ऑनलाइन फ़ेविकॉन जेनरेटर इस्तेमाल करें

logo87.com जैसे टूल से फ़ेविकॉन जल्दी बन जाता है। टेक्स्ट लिखें, रंग और फ़ॉन्ट चुनें, और सभी ज़रूरी आकार व प्रारूप वाला पूरा पैकेज डाउनलोड करें। डिज़ाइन अनुभव के बिना यह सबसे आसान तरीका है।

मौजूदा छवियों से बदलें

अगर पहले से लोगो या छवि है, तो हमारे SVG से PNG जैसे टूल से उसे फ़ेविकॉन बना सकते हैं। ब्रांड से मेल खाने वाले प्रारूप और आकार में बदलें।

शून्य से डिज़ाइन करें

पेशेवर डिज़ाइनर ग्राफ़िक सॉफ़्टवेयर से हर ज़रूरी आकार पर पिक्सेल-सटीक नतीजा निकाल सकते हैं। शून्य से बनाते समय नियंत्रण पूरा रहता है।

निष्कर्ष

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

ऑनलाइन जेनरेटर से बनाएँ, मौजूदा छवि से बदलें, या शून्य से डिज़ाइन करें — ठीक से बनाना साइट की पेशेवर छवि और अनुभव में निवेश है। फ़ेविकॉन बनाना सीखने से ऑनलाइन ब्रांड और मज़बूत होता है।