फ़ेविकॉन के लिए ICO बनाम PNG
ICO सार्वभौमिक लेकिन पुराना है; PNG आधुनिक है लेकिन स्पष्ट लिंकिंग की आवश्यकता है। यहां दोनों को एक साथ उपयोग करने का तरीका बताया गया है।
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 जोड़ें।