محوّل SVG إلى PNG

حوّل متجهات SVG القابلة للتحجيم إلى صور PNG جاهزة للاستخدام

ملف SVG مجموعة من التعليمات، لا صورة مكتملة. افتح أحدها في محرّر نصوص فستجد XML يصف مسارات وأشكالًا وتعبئات ومنحنيات — وصفة يتبعها المتصفح ليرسم العمل الفني من جديد بأي حجم تطلبه. أما PNG فعلى النقيض: شبكة من البكسلات الملوّنة مجمَّدة عند عرض وارتفاع ثابتين. يُسمّى تحويل أحدهما إلى الآخر بالتنقيط (rasterization)، وتؤدي هذه الأداة ذلك بالكامل داخل متصفحك. تختار حجم إخراج، فيُرسَم SVG على لوحة HTML، ويعود PNG — دون أن يغادر أي ملف جهازك.

المتجه مقابل النقطي، بعبارات واضحة

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

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

لماذا تُنقّط ملف SVG أصلًا؟

إن كان SVG يتحجّم بهذا الجمال، فلماذا تحوّله؟ التوافق هو الجواب المعتاد. كثير من الأماكن لا تقبل SVG ببساطة: عملاء بريد كثيرون يجرّدونه أو يرفضون عرضه، ومحرّرات المستندات وبرامج العروض التقديمية تريد غالبًا صورة مسطحة، والأسواق وشبكات الإعلانات تطلب PNG أو JPG، ومعظم المنصات الاجتماعية تتجاهل رفع المتجهات كليًا. كما تحظر بعض أنظمة المحتوى SVG صراحةً لأسباب أمنية، إذ يمكن للصيغة أن تضمّن سكربتات.

والسبب الثاني أنك أحيانًا تريد أصلًا بحجم ثابت. أيقونات التطبيقات والصور المصغّرة وصور معاينة Open Graph والمواد المطبوعة كلها تتوقع أبعاد بكسل دقيقة. يقفل PNG العمل الفني عند ذلك الهدف فيُعرَض بشكل متطابق في كل مكان، دون مفاجآت من عارض يفسّر المتجه بشكل مختلف. وتحويل SVG المصدري إلى الأحجام الدقيقة التي تتطلبها منصة ما هو غالبًا أنظف سبيل لنتيجة متّسقة.

اختيار دقة التصدير المناسبة

لأن PNG لا يستطيع التحجيم لأعلى بسلاسة، فإن الحجم الذي تصدّر به يهم أكثر من أي متجه. صدّر بحجم صغير جدًا فتبدو الصورة ناعمة على الشاشات الحديثة؛ وصدّر بحجم كبير دون داعٍ فتهدر عرض النطاق. قاعدة بسيطة: حدّد أكبر حجم ستُعرَض به الصورة على الإطلاق، ثم اعرضها بذلك على الأقل، ويفضَّل أكثر للشاشات عالية الكثافة.

الشاشات القياسية جيدة عند 1x — الحجم الاسمي للعمل الفني. أما الشاشات عالية الدقة وريتينا فتحشد نحو ضعف البكسلات في الحيّز نفسه، فالتصدير 2x يبقي الأيقونات والرسوم حادة بدل أن تكون ضبابية. وللطباعة أو الملصقات أو الشاشات الكبيرة جدًا، يمنحك 3x أو 4x متّسعًا. ولأن المصدر متجه، فالتصدير بحجم أكبر لا يكلّفك شيئًا من الجودة — إذ تُعاد حسبة المنحنيات ببساطة عند عدد البكسلات الأعلى قبل التسطيح. عند الشك، اعرض بحجم سخيّ؛ يمكنك دائمًا تصغير PNG كبير، لكنك لا تستطيع أبدًا استعادة التفاصيل بتكبير صغير.

الشفافية تأتي معك في الرحلة

تدعم PNG قناة ألفا كاملة، ما يعني أن الشفافية تنجو من التحويل. إن لم يكن لِـSVG تعبئة خلفية، فإن PNG الناتجة تبقي تلك المناطق شفافة، فيستقر شعار أو أيقونة بنظافة على أي لون دون مربع أبيض قبيح حولها. وإن احتجت إلى خلفية صلبة بدلًا من ذلك، فأعطِ SVG واحدة قبل التحويل. وفي كلتا الحالتين، ما تراه في المتجه هو ما ستحفظه PNG، وهو بالضبط لماذا تكون PNG — لا JPG — الهدف الطبيعي للأيقونات والشارات والطبقات.

كل شيء يبقى على جهازك

يعمل هذا المحوّل ككود محلي في متصفحك باستخدام واجهة اللوحة (canvas). تُقرأ ملف SVG وتُرسَم وتُصدَّر دون أن تُرسَل إلى خادم أبدًا، فلا رفع، ولا طابور انتظار، ولا نسخة من عملك الفني قابعة في تخزين شخص آخر. وهذا أسرع لك وأأمن لأي شيء تفضّل ألّا تسلّمه لطرف ثالث، من علامات تجارية لم تُطلق بعد إلى مخططات داخلية. وعند انتهائك هنا، استكشف بقية أدوات الصور لدينا — وإن كنت تبني أصلًا لويندوز أو أيقونة موقع، فإن محوّل PNG إلى ICO خطوة تالية طبيعية.

الأسئلة الشائعة