عندما يضيف مستخدمو 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 صالح](https://developer.chrome.google.cn/static/docs/lighthouse/pwa/apple-touch-icon/image/does-provide-valid-appl-cc7f9dc2832c7.png?authuser=5&hl=ar)
لا تتحقق أداة Lighthouse من وجود الأيقونة بالفعل أو ما إذا كان الحجم الصحيح.
كيفية إضافة رمز Apple touch
إضافة
<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
بالمسار الفعلي للرمز.
لتقديم تجربة جيدة للمستخدم، تأكَّد ممّا يلي:
- يبلغ حجم الرمز 180×180 بكسل أو 192×192 بكسل.
- المسار المحدد للرمز صالح
- خلفية الرمز غير شفافة