मान्य Apple-टच-आइकॉन उपलब्ध नहीं कराता

जब iOS Safari के उपयोगकर्ता प्रोग्रेसिव वेब ऐप्लिकेशन (पीडब्ल्यूए) को तो दिखाई देने वाले आइकन को Apple टच आइकन कहा जाता है. आपके पास यह तय करने का विकल्प होता है कि ऐप्लिकेशन को किस आइकॉन का इस्तेमाल करना चाहिए. आपके <head> में <link rel="apple-touch-icon" href="/example.png"> टैग पेज. अगर आपके पेज में यह लिंक टैग नहीं है, तो iOS पेज का कॉन्टेंट होता है. दूसरे शब्दों में, iOS को डाउनलोड करने का निर्देश देने से खोज के बेहतर नतीजे मिलते हैं उपयोगकर्ता अनुभव मिलता है.

लाइटहाउस Apple के टच आइकॉन का ऑडिट कैसे फ़ेल हो जाता है

लाइटहाउस बिना <link rel="apple-touch-icon" href="/example.png"> वाले पेजों को फ़्लैग करता है टैग को <head> में जोड़ें:

मान्य apple-Touch-icon उपलब्ध नहीं है

लाइटहाउस इस बात की जांच नहीं करता कि आइकॉन वाकई मौजूद है या नहीं सही साइज़.

Apple का टच आइकॉन जोड़ने का तरीका

  1. अपने पेज के <head> में <link rel="apple-touch-icon" href="/example.png"> जोड़ें:

    <!DOCTYPE html>
<html lang="en">
  <head>
    …
    <link rel="apple-touch-icon" href="/example.png">
    …
  </head>
  …

  2. /example.png को अपने आइकॉन के असल पाथ से बदलें.

अच्छा उपयोगकर्ता अनुभव देने के लिए, पक्का करें कि:

  • आइकॉन 180x180 पिक्सल या 192x192 पिक्सल का है
  • आइकॉन के लिए तय किया गया पाथ मान्य है
  • आइकॉन का बैकग्राउंड पारदर्शी नहीं है

संसाधन