फ़ेविकॉन के लिए ICO बनाम PNG
ICO सार्वभौमिक लेकिन पुराना है; PNG आधुनिक है लेकिन स्पष्ट लिंकिंग की आवश्यकता है। यहां दोनों को एक साथ उपयोग करने का तरीका बताया गया है।
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
ICO: सार्वभौमिक फ़ॉलबैक
प्रत्येक डेस्कटॉप ब्राउज़र आपके कुछ भी किए बिना /favicon.ico लाता है। यह एक कंटेनर है जो कई रिज़ॉल्यूशन रख सकता है।
Windows शॉर्टकट और फ़ाइल एक्सप्लोरर .ico पर निर्भर हैं, इसलिए भले ही आपको वेब फ़ेविकॉन की परवाह न हो, OS के लिए एक शिप करें।
PNG: किसी भी घनत्व पर पिक्सेल-परिपूर्ण
जब आप इसे <link rel='icon' size='...'> से लिंक करते हैं तो PNG उच्च-DPI डिस्प्ले पर स्पष्ट रूप से प्रदर्शित होता है।
वेब मेनिफेस्ट के लिए 192×192 और 512×512 PNG का उपयोग करें, और apple-touch-icon के लिए 180×180 का उपयोग करें।
फैसला: दोनों का उपयोग करें
सार्वभौमिक समर्थन के लिए एक बहु-आकार .ico, साथ ही एचडी डिस्प्ले और PWA इंस्टाल संकेतों के लिए PNG वेरिएंट शिप करें। सबसे तेज़ स्केलेबल आइकन के लिए शीर्ष पर SVG जोड़ें।
सामान्य प्रश्न
Should I use ICO or PNG for a favicon?
Use both: ICO for universal /favicon.ico fallback and PNG for high-DPI tabs and PWA manifest icons.
Does every browser support PNG favicons?
Modern browsers do when you link them with <link rel="icon" type="image/png">. ICO remains the safest default.
Is ICO outdated?
ICO is older but still required for Windows shortcuts and automatic /favicon.ico discovery by browsers.