يجب أن يتضمن بيان الويب أيقونات 192 بكسل

يبدو أن Discourse يوفر أيقونة بحجم 512 بكسل في ملف الويب مانيفست بصيغة JSON. تحت إعدادات الموقع، ثم العلامة التجارية، يوجد حقل واحد فقط لأيقونة المانيفست، مما يوحي بأن الصور المرفقة سيتم تحجيمها إلى 512×512 بكسل.

{
   ...
   "icons":[
      {
         "src":"https://community.toph.co/uploads/default/optimized/2X/5/5b9de7676657b71384fb77c662616d73765f0293_2_512x512.png",
         "sizes":"512x512",
         "type":"image/png"
      },
      {
         "src":"https://community.toph.co/uploads/default/optimized/2X/5/5b9de7676657b71384fb77c662616d73765f0293_2_512x512.png",
         "sizes":"512x512",
         "type":"image/png",
         "purpose":"maskable"
      }
   ],
   ...
}

ومع ذلك، وفقًا لـ https://web.dev/add-manifest/:

بالنسبة لمتصفح Chrome، يجب عليك توفير أيقونة بحجم 192×192 بكسل على الأقل، وأيقونة بحجم 512×512 بكسل.

لاحظت أن هذا ينطبق أيضًا على Firefox (على الأقل على جهاز يعمل بنظام LineageOS). إليك كيف يبدو الأمر:

لاحظ وجود أيقونتين لـ Toph و Drafts؟ كلاهما يوفر أيقونات بحجم 192 بكسل (من بين أحجام أخرى). سابقًا، كانت Toph و Drafts تحتويان على عدة أيقونات ولكن ليس بأحجام 192 بكسل. كما كانتا تبدوان مشابهتين لأيقونة Community (أي تحتويان على حواف داكنة حول المنطقة البيضاء). تطبيق Community في هذه الصورة هو مثيل من Discourse.

يبدو أن هذه مشكلة تتعلق بـ LineageOS، أو ربما إصدار متصفحك.

اختبرت هذا في Chrome (الإصدار 89) و Firefox (الإصدار 87) على نظام Android (الإصدار 10) وظهرت النتيجة بشكل جيد:

كما تم اختباره أيضًا في Safari:

من خلال ما أراه في الكود، يبدو أنك محق، فالحجم الوحيد هو 512 بكسل. هناك العديد من الأجهزة والمتصفحات والأحجام الموصى بها لكل منها، لذا أعتقد أنه من الصعب على Discourse تغطية جميعها. يبدو أن 512 بكسل تعمل بشكل جيد لمعظم الحالات.

4 إعجابات

لقد قمت بتثبيت Meta كتطبيق ويب تقدمي (PWA) باستخدام كل من Firefox و Chrome على هاتفي، ويعمل أيقونة 512 بكسل بشكل ممتاز بالنسبة لي.

يمكننا إضافة مهمة لإعادة حجم أيقونة 512 بكسل، ولكن إذا لم يكن هناك فرق في المنصات المدعومة رسميًا لدينا، فلا أرى قيمة في ذلك.

هل يمكنك تكرار هذه المشكلة باستخدام Meta / Android Chrome؟

4 إعجابات