Manifest Icons: Web App Manifest में icons Array
Manifest icon एक web app manifest के icons array में एक entry है — वह JSON फ़ाइल जो आपकी साइट के इंस्टॉल होने पर उसका वर्णन करती है। हर entry एक src, एक sizes string, आमतौर पर एक type, और वैकल्पिक रूप से एक purpose देती है, और browser home screen, app launcher, task switcher और splash screen के लिए सबसे नज़दीकी मैच चुनता है। कम-से-कम एक 192x192 और एक 512x512 PNG घोषित करें।
यह array किसलिए है
Web app manifest आपके head से लिंक की गई एक JSON फ़ाइल है जो browser को बताती है कि इंस्टॉल होने पर आपकी साइट कैसे व्यवहार करे: उसका नाम, उसका start URL, उसका display mode, उसका theme colour, और उसके icons। Manifest icons वे हैं जो browser chrome के बाहर इस्तेमाल होते हैं: launcher, app switcher, install prompt, splash screen।
Favicon link tags के विपरीत, यह array निर्देशों के एक सेट के बजाय उम्मीदवारों की एक सूची है। आप बताते हैं कि हर फ़ाइल क्या है, और browser हर surface के हिसाब से चुनता है। इसका मतलब है कि ज़्यादा entries घोषित करना सस्ता है: जब तक किसी surface को ज़रूरत न हो तब तक कुछ भी download नहीं होता।
एक न्यूनतम manifest
{
"name": "Example App",
"short_name": "Example",
"start_url": "/",
"display": "standalone",
"theme_color": "#0b0b0b",
"background_color": "#ffffff",
"icons": [
{ "src": "/icon-192.png", "sizes": "192x192", "type": "image/png" },
{ "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" },
{
"src": "/icon-maskable-512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
}
]
}इसे head से <link rel="manifest" href="/manifest.json"> से लिंक करें। फ़ाइल का नाम manifest.webmanifest भी हो सकता है; असल में link tag ही मायने रखता है।
एक icon entry के fields
| Field | यह क्या करता है |
|---|---|
| src | image का path, manifest URL के सापेक्ष हल होता है। अनिवार्य। |
| sizes | "WIDTHxHEIGHT" के रूप में dimensions, या multi-size फ़ाइल के लिए कई space-separated। |
| type | MIME type, जैसे image/png. Browser को उन formats को छोड़ने देता है जिन्हें वह decode नहीं कर सकता। |
| purpose | "any" (डिफ़ॉल्ट), crop के लिए सुरक्षित icons हेतु "maskable", या "monochrome"। |
Manifest icon FAQ
192 और 512 ही क्यों?
192x192 वह size है जिसे Android आम screen densities पर home screen आइकन के लिए इस्तेमाल करता है, और 512x512 वह size है जो splash screen और install prompt के लिए इस्तेमाल होती है। मिलकर ये Chromium browsers में installability जाँच को पूरा करती हैं।
क्या manifest icons मेरे favicon की जगह ले लेते हैं?
नहीं। वे सिर्फ़ इंस्टॉल-किए-गए-app वाले surfaces को कवर करते हैं। Browser tabs, bookmarks और history अब भी आपके link rel="icon" tags और /favicon.ico से आते हैं, इसलिए दोनों भेजें।
क्या iOS manifest icons पढ़ता है?
Safari name और display mode जैसी चीज़ों के लिए manifest पढ़ता है, लेकिन Home Screen आइकन apple-touch-icon link से आता है। अगर आप चाहते हैं कि आइकन iOS और Android दोनों पर सही हो तो दोनों घोषित करें।