أنشئ أيقونة الموقع من صورة واحدة

كيف تنشئ الأيقونة

أضف صورة واحدة أو أفلتها في الصفحة. خيار ملء المربع محدد مسبقًا: يبقي الوسط ويقص الباقي. إظهار الصورة كاملة يبقي كل الحواف ويترك فراغًا حولها. الخلفية قد تكون شفافة أو بيضاء أو سوداء أو لونًا مخصصًا. اضغط إنشاء حزمة الأيقونة، ثم تنزيل الكل. اسم الملف ⁦pixzeno-favicon.zip⁩. الصورة التالية تستبدل الحالية.

صورة واحدة في كل مرة، بحد ⁦25 MB⁩، ومن غير أن يتجاوز أي ضلع ⁦12,000⁩ بكسل. تُرفض ⁦GIF⁩ و⁦HEIC⁩ و⁦SVG⁩، وكذلك أي نوع ليس ⁦JPG⁩ أو ⁦PNG⁩ أو ⁦WebP⁩. يُقبل ⁦WebP⁩ المتحرك كصورة ثابتة، ولا تُحفظ الحركة. صورة ⁦JPEG⁩ أعيدت تسميتها إلى ⁦.png⁩ تُقرأ ⁦JPEG⁩. ملف نصي أعيدت تسميته إلى ⁦.jpg⁩ يُرفض.

ما الذي تحتويه الحزمة

في ملف ⁦ZIP⁩ سبعة ملفات. ⁦favicon.ico⁩ حاوية ICO بداخلها صور ⁦PNG⁩ بمقاس 16 و32 و48. ليس ملف ⁦PNG⁩ أُعيدت تسميته إلى ⁦.ico⁩. وإلى جانبه ⁦favicon-16x16.png⁩ و⁦favicon-32x32.png⁩ و⁦favicon-48x48.png⁩ و⁦apple-touch-icon.png⁩ بمقاس ⁦180×180⁩. ⁦icon-192.png⁩ و⁦icon-512.png⁩ موجودان لملف ⁦manifest⁩ تكتبه أنت. الحزمة لا تتضمن ⁦manifest⁩، وهاتان الأيقونتان ليستا ⁦maskable⁩، ولا يُنشأ ⁦SVG⁩.

مربع ⁦HTML⁩ يعرض وسوم الربط لـ ⁦favicon.ico⁩ ولملفات ⁦PNG⁩ الثلاثة ولأيقونة ⁦Apple⁩. المسارات تبدأ من جذر الموقع. ⁦icon-192.png⁩ و⁦icon-512.png⁩ داخل ⁦ZIP⁩ وليسا داخل هذا المقتطف. نسخ ⁦HTML⁩ يضع النص نفسه في الحافظة.

املأ المربع، أو أبقِ الصورة كاملة

الملء يأخذ أكبر مربع يستقر في الوسط. في الصورة العريضة يُترك اليمين واليسار. في الصورة الطويلة يُترك الأعلى والأسفل. الإظهار الكامل يصغّر الصورة كلها داخل المربع، والفراغ يستخدم الخلفية التي اخترتها. لا يوجد تحريك ولا تكبير. الاختيار نفسه يُستخدم لكل المقاسات. إذا أردت اختيار المربع بيدك، اقص الصورة أولًا.

• قص الصورة

الشفافية وملف Apple

الشفافية هي الخيار الافتراضي. تبقى في أيقونات ⁦PNG⁩ وفي صور ⁦PNG⁩ داخل ⁦favicon.ico⁩. ملف ⁦apple-touch-icon.png⁩ يبقى غير شفاف: أبيض إذا كانت الخلفية شفافة، وإلا فاللون الذي تختاره. هو ⁦PNG⁩ مربع بمقاس ⁦180×180⁩، وهذه الأداة لا تدور زواياه. صورة ⁦JPEG⁩ لا تحمل شفافية أصلًا. تفاصيل الكاميرا والموقع من المصدر لا تُنسخ إلى الأيقونات.

مقاس الأيقونة ليس مقاس المصدر

كل أيقونة تُنزَّل مربعة: ⁦16⁩ و⁦32⁩ و⁦48⁩ و⁦180⁩ و⁦192⁩ و⁦512⁩ بكسل. تبويب المتصفح ليس له مقاس عرض واحد. إذا كان الضلع الأطول في صورتك أقل من ⁦512⁩ بكسل، تقول الصفحة إن الأيقونات الأكبر نسخ مكبرة وإن التفاصيل لا تُضاف. إذا زاد الضلع الأطول على ⁦1,024⁩ بكسل، تُرسم الأيقونات من نسخة عمل بهذا المقاس. الملفات التي تنزّلها تبقى بمقاسات الأيقونات نفسها. معاينة 16 المكبرة هي ملف 16 الناتج، معروضًا كبيرًا ببكسلات حادة.

• غيّر مقاس الصورة
• افحص أبعاد البكسل

استخدام الملفات في الموقع

قد تطلب المتصفحات ⁦/favicon.ico⁩ من جذر الموقع من تلقاء نفسها. ويمكنك أيضًا الإشارة إلى الأيقونة بوسم ⁦link rel="icon"⁩، وهذا ما يفعله ⁦HTML⁩ المنسوخ. الجذر ليس المكان الوحيد الصالح: عدّل المسارات إذا كانت الملفات في مكان آخر. قد يحتفظ المتصفح بالأيقونة السابقة، فلا تظهر الجديدة حتى يُحدَّث ذلك التخزين. هذه أيقونات موقع. ليست حزمة متجر تطبيقات، وهذه الصفحة ليست تحويلًا عامًا لصيغة الصورة.

• حوّل صيغة الصورة