لا يتم تقديم رمز apple- touch صالح

عندما يضيف مستخدمو iOS Safari تطبيقات الويب التقدّمية (PWA) إلى شاشاتهم الرئيسية، يُطلق على الرمز الذي يظهر اسم Apple touch icon. يمكنك تحديد الرمز الذي يجب أن يستخدمه تطبيقك عن طريق تضمين علامة <link rel="apple-touch-icon" href="/example.png"> في <head> من صفحتك. إذا لم تكن صفحتك تحتوي على علامة الرابط هذه، سينشئ نظام iOS رمزًا من خلال أخذ لقطة شاشة لمحتوى الصفحة. بمعنى آخر، يؤدي توجيه iOS بتنزيل رمز إلى تجربة مستخدم أكثر تحسينًا.

كيف يتعذّر التدقيق في رمز Lighthouse في Apple الذي يعمل باللمس

تضع Lighthouse علامة على الصفحات التي لا تحتوي على علامة <link rel="apple-touch-icon" href="/example.png"> في <head>:

لا يتم تقديم رمز apple- touch-icon صالح

لا تتحقق أداة Lighthouse من وجود الأيقونة بالفعل أو ما إذا كان الحجم الصحيح.

كيفية إضافة رمز Apple touch

  1. إضافة <link rel="apple-touch-icon" href="/example.png"> إلى <head> في صفحتك:

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

  2. استبدِل /example.png بالمسار الفعلي للرمز.

لتقديم تجربة جيدة للمستخدم، تأكَّد ممّا يلي:

  • يبلغ حجم الرمز 180×180 بكسل أو 192×192 بكسل.
  • المسار المحدد للرمز صالح
  • خلفية الرمز غير شفافة

المراجِع