ما الذي تقدمه أداة مولد الفافيكون (Favicon)؟
تتيح لك هذه الأداة تحويل صورة واحدة تقوم بتزويدها بها إلى مجموعة متكاملة من ملفات الأيقونات المناسبة للاستخدامات المختلفة على مواقع الويب، مثل أيقونات علامات تبويب المتصفح، وأيقونات آبل للتفاعل باللمس (Apple touch icons)، وأيقونات تطبيقات الويب التقدمية (PWAs). بعد معالجة الصورة، تقوم الأداة بتجميع هذه الأيقونات داخل ملف ZIP واحد جاهز للتحميل، كما توفر لك كود HTML البرمجي اللازم لدمج هذه الأيقونات في موقعك الإلكتروني بكل سهولة.
الملفات المدخلة والمواصفات المطلوبة
للبدء في استخدام الأداة، يتعين عليك تزويدها بملف صورة يتوافق مع المعايير التالية:
- نوع الملف: تدعم الأداة رفع ملف صورة واحد بصيغة PNG، أو JPG، أو SVG.
- حجم الملف: الحد الأقصى لحجم الملف المدخل هو 50 ميغابايت.
- أبعاد الصورة: بالنسبة لصور PNG أو JPG، يُنصح بأن تكون الأبعاد 512 × 512 بكسل على الأقل؛ حيث إن استخدام صور بأبعاد أصغر قد يؤدي إلى ظهور الأيقونات الكبيرة بشكل باهت وغير واضح.
خيارات التحكم في المظهر والخلفية
توفر الأداة خيارات مرنة للتحكم في كيفية ظهور الأيقونات وتوافقها مع الأبعاد المربعة:
التعامل مع الصور غير المربعة
بما أن الأيقونات تكون مربعة الشكل دائمًا، فإن الأداة تتيح لك طريقتين لمعالجة الصور غير المربعة لتجنب تمديدها أو تشويهها:
- احتواء (مع هوامش): يضمن هذا الخيار بقاء الصورة كاملة مرئية في الوسط مع إضافة هوامش حولها لتصبح مربعة الشكل. وهو الخيار الافتراضي لمعالجة الصور غير المربعة.
- ملء (قص): يتيح هذا الخيار ملء المربع بالكامل بالصورة، مع قص الحواف الزائدة الخارجة عن الإطار.
إعدادات الخلفية
يمكنك تحديد مظهر الخلفية للأيقونات الناتجة بناءً على التفضيلات التالية:
- شفافة: يتم إنتاج الأيقونات بدون أي لون خلفية، وهو الخيار الافتراضي للأداة. تعد الخلفية الشفافة مثالية لعلامات تبويب المتصفح.
- اللون: تتيح لك الأداة اختيار لون خلفية محدد. ويعد تحديد لون للخلفية خيارًا أكثر أمانًا لأيقونات شاشة آيفون الرئيسية، نظرًا لأن المساحات الشفافة في هذه الأجهزة يتم تلوينها باللون الأسود تلقائيًا.
الملفات الناتجة وحزمة الأيقونات
عند اكتمال عملية المعالجة، ستحصل على حزمة الأيقونات الخاصة بك داخل ملف ZIP يحتوي على الملفات التالية:
- favicon.ico: يحتوي هذا الملف الكلاسيكي داخله على نسخ بمقاسات 16 و32 و48 بكسل.
- أيقونات PNG: يتم توليد أيقونات بصيغة PNG بمقاسات متعددة تشمل 16، و32، و180، و192، و512 بكسل.
- site.webmanifest: ملف نصي صغير يسرد الأيقونات الكبيرة لتحديد مسار الأيقونات ومقاساتها للأجهزة المختلفة.
- ملف الفيكتور (SVG): إذا كانت الصورة المصدر التي رفعتها بصيغة SVG، فسيتم تضمين ملف الفيكتور نفسه داخل الحزمة لضمان الوضوح التام بأي مقاس.
- كود HTML: كود مخصص لنسخه ولصقه داخل وسم
<head>في صفحات موقعك الإلكتروني لربط الأيقونات بشكل صحيح.
كما تعرض لك الأداة أبعاد الصورة التي تم تحميلها بالبكسل بصيغة "{w} × {h} بكسل".
قواعد العمل ورسائل الخطأ المحتملة
تعمل الأداة وفق مجموعة من القواعد التقنية لضمان جودة الأيقونات، وتظهر للمستخدم رسائل تنبيهية أو أخطاء في الحالات التالية:
- تنبيه جودة الصورة: إذا قمت برفع صورة PNG أو JPG بأبعاد صغيرة، ستظهر لك رسالة تنبيهية نصها: "حجم المصدر صغير (
{w}×{h}بكسل): قد تبدو الأيقونات الكبيرة باهتة بعض الشيء. يفضل استخدام مقاس 512 × 512 أو أكبر — أو ملف SVG — للحصول على أفضل جودة.". - عدم اختيار ملف: عند محاولة بدء المعالجة دون رفع ملف، تظهر رسالة: "يرجى اختيار صورة بصيغة PNG أو JPG أو SVG أولاً.".
- صيغة غير مدعومة: إذا تم رفع ملف بصيغة غير مدعومة، تظهر رسالة: "الصيغ المدعومة هي PNG وJPG وSVG فقط.".
- ملف تالف أو فارغ: في حال تعذر قراءة الملف كصورة، تظهر رسالة: "تعذر فتح هذا الملف كصورة. قد يكون تالفًا، فارغًا، أو ليس ملف صورة بالفعل.".
- خطأ في ملف SVG: إذا كان ملف SVG غير صالح، تظهر رسالة: "تعذر قراءة ملف SVG هذا. يرجى التأكد من أن الملف مستند SVG صالح.".
- تجاوز الحجم المسموح: إذا تجاوز الملف المرفوع الحد الأقصى، تظهر رسالة: "حجم هذا الملف يتجاوز 50 ميغابايت. يرجى استخدام صورة مصدر أصغر.".
- فشل عام في المعالجة: في حال حدوث مشكلة غير متوقعة أثناء التوليد، تظهر رسالة: "فشل إنشاء الأيقونات. يرجى تجربة صورة أخرى.".
الخصوصية وأمان البيانات
تتميز الأداة بمعالجة البيانات محليًا بشكل كامل؛ حيث يتم تحويل صورتك إلى أيقونات داخل متصفحك مباشرة، ولا يتم تحميل أي شيء إلى خوادم BroBroGo.
الأسئلة الشائعة
ما هي الملفات التي تحتوي عليها حزمة الأيقونات؟
ملف favicon.ico يحتوي داخله على نسخ بمقاسات 16 و32 و48 بكسل، وأيقونات PNG بمقاسات 16 و32 و180 و192 و512 بكسل، وملف site.webmanifest الذي يسرد الأيقونات الكبيرة. وإذا بدأت بملف SVG، فسيتم تضمين ملف الفيكتور نفسه أيضًا. كل هذا في ملف ZIP واحد.
ما هو المقاس المناسب للصورة المصدر؟
صيغة SVG هي الخيار المثالي — حيث يتم رسم كل أيقونة من الفيكتور مباشرة، مما يحافظ على وضوحها التام حتى بمقاس 16 بكسل. بالنسبة لصور PNG أو JPG، يفضل البدء بمقاس 512 × 512 على الأقل؛ لأن الصور الأصغر سيتم تكبيرها وقد تبدو باهتة.
هل يجب أن تكون الخلفية شفافة أم ملونة؟
تبدو أيقونات علامات التبويب ممتازة بخلفية شفافة. ومع ذلك، فإن الشاشات الرئيسية لأجهزة آيفون وآيباد تحول المساحات الشفافة إلى اللون الأسود — لذا إذا كان من المحتمل أن يضيف المستخدمون موقعك إلى شاشاتهم الرئيسية، فمن الأفضل اختيار لون للخلفية.
ماذا يحدث إذا لم تكن الصورة المصدر مربعة؟
الأيقونات تكون مربعة الشكل دائمًا، لكن صورتك لن تتعرض للتمديد أو التشويه. بشكل افتراضي، يتم توسيط الصورة مع إضافة هوامش حولها؛ ويمكنك التبديل إلى خيار "ملء (قص)" لقص الحواف الزائدة بدلاً من ذلك.
أين يجب أن أضع هذه الملفات في موقعي؟
ارفعها إلى المجلد الرئيسي لموقعك الإلكتروني بحيث يمكن الوصول إلى favicon.ico عبر المسار /favicon.ico، ثم الصق الأسطر البرمجية الناتجة داخل وسم <head> في صفحاتك. ستختار المتصفحات المقاس المناسب تلقائيًا.