الأيقونة المفضلة هي الأيقونة الصغيرة التي تظهر في علامة تبويب المتصفح وقائمة الإشارات المرجعية واقتراحات شريط العناوين عندما يزور شخص ما موقعًا إلكترونيًا. القيام بذلك بشكل صحيح يتضمن أكثر من مجرد جعل الصورة صغيرة. الأيقونة المفضلة التي تبدو حادة تتطلب أبعاد بكسل صحيحة، وتصميمًا نظيفًا ومتمركزًا، والتنسيق الصحيح للسياق الذي يتم استخدامها فيه. الحجم القياسي للأيقونة المفضلة هو 16x16 بكسل للعرض الأساسي في علامة تبويب المتصفح، مع استخدام 32x32 للشاشات عالية الكثافة و 48x48 المضمنة في حزم الأيقونة المفضلة الكاملة. الأيقونة المفضلة غير المعدة بشكل جيد تبدو ضبابية أو غير واضحة في علامة التبويب، وهو تفصيل صغير يعكس الجودة الشاملة لموقع الويب.
كيفية تغيير حجم الصورة للأيقونة المفضلة
للأيقونة المفضلة الأساسية، أدخل 16 في كل من حقلي العرض والارتفاع وقم بإلغاء تحديد خانة الاختيار الحفاظ على نسبة الأبعاد للحصول على مخرجات مربعة إجبارية. لإصدار أعلى دقة، كرر العملية بـ 32 في كلا الحقلين. لحزمة أيقونة مفضلة كاملة، قم بمعالجة نفس الصورة عند 16x16 و 32x32 و 48x48 بشكل منفصل.
جودة الصورة المصدر أكثر أهمية في أحجام الأيقونة المفضلة من أي بُعد آخر تقريبًا. الشعار المعقد أو الرسم التوضيحي المفصل يفقد كل شكله القابل للتمييز عند 16x16. الأيقونة الجريئة البسيطة ذات الحواف النظيفة والتفاصيل البسيطة تصمد بشكل أفضل بكثير. ابدأ من أكبر نسخة متاحة من الأيقونة وقم بتصغيرها للحصول على النتيجة الأكثر حدة في كل حجم. قم بتحميل أحجام متعددة مرة واحدة وقم بالتنزيل كملف ZIP عند الانتهاء.
أحجام الأيقونة المفضلة القياسية
16x16 بكسل: الحجم الأساسي المعروض في علامات تبويب المتصفح على شاشات الدقة القياسية. 32x32 بكسل: تستخدمه شاشات الكثافة العالية واختصارات سطح مكتب Windows. 48x48 بكسل: مضمنة في حزم الأيقونة المفضلة الكاملة للتوافق الأوسع. 180x180 بكسل: حجم Apple Touch Icon المستخدم عند حفظ موقع ويب على شاشة iOS الرئيسية. 192x192 بكسل: تستخدمه أجهزة Android لأيقونات تطبيقات الويب على الشاشة الرئيسية. تتضمن حزمة الأيقونة المفضلة الكاملة عادةً جميع هذه الأحجام المولدة من نفس الأيقونة المصدر.
تنسيق الإخراج للأيقونات المفضلة
PNG هو التنسيق الأكثر دعمًا على نطاق واسع لتطبيقات الأيقونة المفضلة الحديثة. تقبل معظم المتصفحات ملفات PNG للأيقونة المفضلة مباشرة عبر علامة link في رأس HTML. الخلفيات الشفافة مدعومة في PNG وتسمح للأيقونة المفضلة بالجلوس بشكل نظيف فوق لون علامة تبويب المتصفح. تنسيق ICO التقليدي يجمع أحجامًا متعددة في ملف واحد ولا يزال يستخدم لملف favicon.ico الجذر الذي تبحث عنه المتصفحات افتراضيًا. PNG بالحجم الصحيح هو النهج الأكثر مباشرة لمعظم مشاريع الويب الحديثة.