जब iOS Safari के उपयोगकर्ता अपनी होम स्क्रीन पर प्रोग्रेसिव वेब ऐप्लिकेशन (PWA) जोड़ते हैं, तो स्क्रीन पर दिखने वाले आइकॉन को Apple टच आइकॉन कहा जाता है.
आपके पास यह तय करने का विकल्प होता है कि आपके ऐप्लिकेशन को किस आइकॉन का इस्तेमाल करना चाहिए. इसके लिए, अपने पेज के <head> में <link rel="apple-touch-icon" href="/example.png"> टैग शामिल करें. अगर आपके पेज पर यह लिंक टैग नहीं है, तो iOS पेज के कॉन्टेंट का स्क्रीनशॉट लेकर एक आइकॉन जनरेट करता है. दूसरे शब्दों में, iOS को किसी आइकॉन को डाउनलोड करने का निर्देश देने से, उपयोगकर्ता को बेहतर अनुभव मिलता है.
Lighthouse Apple के टच आइकॉन का ऑडिट कैसे काम नहीं करता
Lighthouse, ऐसे पेजों को फ़्लैग करता है जिनके <head> में <link rel="apple-touch-icon" href="/example.png"> टैग नहीं होता:
लाइटहाउस यह जांच नहीं करता है कि आइकॉन असल में मौजूद है या नहीं या आइकॉन का साइज़ सही है या नहीं.
Apple टच आइकॉन कैसे जोड़ें
<link rel="apple-touch-icon" href="/example.png">को अपने पेज के<head>में जोड़ें:<!DOCTYPE html> <html lang="en"> <head> … <link rel="apple-touch-icon" href="/example.png"> … </head> …/example.pngको अपने आइकॉन के असल पाथ से बदलें.
अच्छा उपयोगकर्ता अनुभव देने के लिए, पक्का करें कि:
- यह आइकॉन 180x180 पिक्सल या 192x192 पिक्सल का होता है
- आइकन के लिए बताया गया पथ मान्य है
- आइकॉन का बैकग्राउंड पारदर्शी नहीं है