طريقة الاستخدام
- اختر مصدر SVG: ملفات SVG، أو كود SVG ملصوق. في حالة الملفات، انقر على اختر ملفات أو أفلتها على المربع.
- اضبط الحجم. يضرب المقياس الحجم الخاص بالرسم، والعرض (بكسل) يجعل الصورة بهذا العرض.
- اختر الخلفية. الشفافة تُبقي المناطق المفتوحة شفافة في PNG وWebP وAVIF، واللون يملؤها.
- اختر صيغة الملف الناتج وانقر على حوّل الرسومات. مع عدة ملفات تحصل على ملف ZIP واحد.
الحجم والوضوح
SVG رسم مكوّن من أشكال، لذلك يبقى واضحاً عند أي حجم. يُطبَّق المقياس على العرض والارتفاع اللذين يعلنهما الرسم، أو على viewBox عند غيابهما. فالصورة بأربعة أضعاف المقياس لها أربعة أضعاف البكسلات في كل اتجاه، أي ستة عشر ضعفاً في المجموع.
الروابط والبرامج النصية
تُعرض الرسمة عبر عنصر الصورة في المتصفح. لا تعمل البرامج النصية داخل SVG، ولا تُحمَّل الروابط إلى ملفات أخرى، مثل الخطوط أو الصور المضمّنة بعنوان إلكتروني. لذلك قد يُرسم النص بخط احتياطي. وإذا احتجت إلى خط بعينه، فحوّل النص إلى مخططات (outlines) في البرنامج الذي صنع ملف SVG.
الشفافية والصيغ
تحتفظ PNG وWebP وAVIF بالمناطق الشفافة. وJPEG لا تدعم الشفافية، لذلك تكون خلفيتها بيضاء ما لم تختر لوناً. ويُحدّ الضلع الأطول بـ8192 بكسل، وتُصغَّر الصورة التي يعجز المتصفح عن حملها.
مثال: أيقونة 64 × 64 بأربعة أضعاف
أيقونة SVG عرضها وارتفاعها 64 تصبح 256 × 256 بكسل بمقياس 4. اختر عرضاً 1024 بدلاً من ذلك، فتصبح الأيقونة نفسها 1024 × 1024 بكسل. وتبقى واضحة، لأن المتصفح يرسم الأشكال من جديد بهذا الحجم.
الأسئلة الشائعة
هل يُرفع ملف SVG إلى خادم؟
لا. يُقرأ الملف أو الكود الملصوق ويُرسم في متصفحك، وتُكتب ملفات PNG أو JPEG أو WebP أو AVIF على جهازك. يمكنك التحقق بقطع اتصال الإنترنت بعد تحميل الصفحة، ثم تحويل رسم.
لماذا تبدو بعض الخطوط مختلفة في الصورة؟
إذا سمّى الرسم خطاً لا تستطيع الصورة الوصول إليه، يستعمل المتصفح خطاً احتياطياً. ولا تُحمَّل الخطوط المرتبطة بعنوان إلكتروني، لذلك حوّل النص إلى مخططات في البرنامج الذي صنع ملف SVG.
لماذا لا تظهر الصور المرتبطة داخل ملف SVG؟
لأسباب تتعلق بالأمان، لا يحمّل الرسم المعروض ملفات أخرى، فتُترك الصورة المضمّنة بعنوان إلكتروني خارج الرسم. ضمّن الصورة داخل SVG بعنوان بيانات (data)، أو حوّلها أولاً.
لماذا تكون صورتي أصغر مما توقعت؟
تأخذ الصورة الحجم الخاص بالرسم ما لم تختر مقياساً أو عرضاً. ويستعمل الرسم الذي لا يملك عرضاً ولا ارتفاعاً قيمة viewBox، والرسم الذي لا يملك أيّاً منهما يُعامل كمربع بضلع 512 بكسل.
أي صيغة للإخراج أختار؟
PNG بلا فقد ويحتفظ بالشفافية، فيناسب الأيقونات والشعارات. وJPEG أصغر للصور الفوتوغرافية لكنه بلا شفافية. وWebP وAVIF أصغر من ذلك، حيث يستطيع متصفحك حفظهما.
هل يمكنني تحويل عدة ملفات SVG معاً؟
نعم. اختر حتى 30 ملفاً وحوّلها معاً. يحتفظ كل ملف باسمه مع الامتداد الجديد، وتنزّلها كلها في ملف ZIP واحد.
المصادر
- MDN: HTMLCanvasElement.toBlob()، كيف تُكتب الصورة (باللغة الإنجليزية)
- W3C SVG 2: مواصفة الرسومات المتجهة القابلة للتحجيم (باللغة الإنجليزية)
- MDN: خاصية viewBox في SVG (باللغة الإنجليزية)
آخر مراجعة للأرقام والنص: الثلاثاء، 30 جمادى الأولى 1448 بعد الهجرة.