تحويل SVG إلى WebP
حوّل ملفًا متجهيًا إلى صورة WebP بعرض البكسل الذي يحتاجه تصميم صفحتك تمامًا. يفيدك ذلك حين يرفض نظام إدارة المحتوى رفع ملفات SVG، أو حين تحتاج معاينة مواقع التواصل إلى صورة نقطية، أو حين يحتوي الرسم التوضيحي على مسارات كثيرة تجعل المتصفح بطيئًا في عرضه.
محوّل الصور
أو أفلت ملفات JPG, JPEG, JPE … هنا ·
الحد الأقصى 95 MB لكل ملف· حتى 20 ملفًا· تُحذف بعد 30 دقيقة
تُعالج الملفات على خوادمنا وتُحذف بعد 30 دقيقة.
القيمة 85 تُبقي الصور مطابقة للأصل بصرياً. خفّضها فقط عند الحاجة إلى ملف أصغر.
صيغ JPG وBMP وEPS لا تدعم الشفافية. تُملأ البكسلات الشفافة بهذا اللون.
لون سداسي عشري يُستخدم خلف البكسلات الشفافة، مثل #FFFFFF.
هذه الصيغة تحمل صورة واحدة فقط. اختر مخرجات GIF أو WebP إن أردت الاحتفاظ بالحركة.
الأيقونة متعددة الأحجام تحوي عدة دقات في ملف واحد، وتختار المتصفحات وأنظمة التشغيل ما تحتاجه.
أبقِ الأبعاد الأصلية، أو أدخل ضلعاً واحداً وستبقى نسبة الأبعاد.
عدد البكسل للضلع الذي اخترته أعلاه.
نسبة مئوية من الأبعاد الأصلية.
sRGB مناسب للشاشات والويب. أبقِ الأصلي لسير عمل الطباعة؛ ودرجات الرمادي تتخلص من الألوان.
بيانات وصفية فقط، والقيمة 0 تُبقي القيمة الأصلية. تقرأ الطابعات وبعض البوابات هذا الرقم، ولا يغير أبعاد البكسل.
طريقة استخدام هذه الأداة
- 1
ارفع ملف SVG
أضف ما يصل إلى 20 ملف .svg مصدّرة من Figma أو Illustrator أو Inkscape أو إحدى مكتبات الرسوم البيانية، بحد أقصى 95 MB لكل ملف.
- 2
حدّد عرض الصورة الناتجة
يبدأ تغيير حجم الصورة الناتجة بعرض 1200 px؛ غيّره إلى ضعف العرض الذي ستشغله الصورة في الصفحة. الجودة 90، أو فعّل بلا فقد ضمن الإعدادات المتقدمة للشعارات والأيقونات ذات الألوان المسطحة.
- 3
حوّل إلى WebP
اضغط التحويل إلى WebP ثم نزّل الملفات أو ملف ZIP واحدًا. تبقى المناطق الشفافة شفافة.
كيف أحوّل SVG إلى WebP بمقاس محدد؟
ارفع ملف SVG، واضبط تغيير حجم الصورة الناتجة على العرض المطلوب بالبكسل (1200 px افتراضيًا)، ثم اضغط التحويل إلى WebP. يُرسم المتجه من جديد بذلك العرض، فلا يحدث تكبير ولا تمويه.
متى يجب تحويل SVG إلى WebP
أصبح SVG توصية من W3C عام 2001، وهو الصيغة المناسبة لمعظم الشعارات والأيقونات: بضعة كيلوبايتات من النص تبقى حادة عند أي تكبير. تبدأ المشكلة حين يغادر الملف شيفرتك. يرفض WordPress وكثير من منشئي المتاجر المستضافة رفع SVG، وتُجلب معاينات الروابط على Facebook وLinkedIn وX كصور نقطية، وتصدّر أدوات التصميم رسومًا بتأثيرات نقطية مضمّنة تحوّل ملف المتجهات إلى عدة ميغابايتات من الشيفرة.
WebP، الذي أطلقته Google عام 2010 ودعمته Safari أخيرًا في الإصدار 14 عام 2020، هو الصورة النقطية المصممة لهذه المهمة: أصغر من PNG بالمظهر نفسه، مع قناة ألفا حقيقية. يتخطى رسم SVG مباشرة إلى WebP بمقاسه النهائي الالتفاف المعتاد عبر تصدير PNG كبير. وإن أردت العكس، فصفحتنا عن WebP إلى SVG تشرح لماذا يحتاج ذلك الاتجاه إلى تتبّع لا إلى تحويل.
مقاسات تحويل SVG إلى WebP لمواضع الويب الشائعة
1200 × 630 px
معاينة رابط Open Graph
الصورة التي تظهر عند مشاركة الصفحة
1920 × 1080 px
رسم رئيسي بعرض الصفحة كاملًا
يغطي معظم شاشات سطح المكتب بمقياس 1×
1600 × 900 px
صورة عمود المدونة بمقياس 2×
لعمود محتوى بعرض 800 px
400 × 100 px
شعار الترويسة بمقياس 2×
لخانة شعار بمقاس 200 × 50 px
SVG
رسومات متجهة قابلة للتحجيم (SVG)
SVG صيغة متجهة قائمة على XML اعتمدها W3C عام 2001. فهي تصف الأشكال والمسارات والنصوص بدل البكسلات، فتبقى حادة بأي حجم، وغالبًا ما تكون صغيرة جدًا للشعارات والأيقونات. وتدعم الشفافية وتنسيق CSS والبرمجة والحركة، وتعرضها كل المتصفحات مباشرةً. لا يناسب SVG الصور الفوتوغرافية، وقد يبطؤ عرض الرسومات المعقدة. يمكن فتحه وتحريره في Illustrator وInkscape وFigma والمتصفحات.
- الضغط
- –
- الشفافية
- نعم
- الحركة
- نعم
- سنة الظهور
- 2001 · W3C
WEBP
صورة WebP
WebP صيغة صور أصدرتها Google عام 2010 لتسريع تحميل صفحات الويب. تدعم الضغط مع الفقد وبلا فقد وشفافية ألفا والحركة في صيغة واحدة. تكون ملفات WebP ذات الفقد أصغر عادةً بنسبة 25–35% من JPEG بجودة مرئية مماثلة، وWebP بلا فقد أصغر عادةً من PNG. تدعمها كل المتصفحات الحالية، لكن بعض برامج سطح المكتب الأقدم وخدمات الطباعة ونماذج الرفع ما زالت ترفضها. يفتح Windows وmacOS ومعظم برامج تحرير الصور الحديثة ملفات WebP.
- الضغط
- مع فقدان أو دونه
- الشفافية
- نعم
- الحركة
- نعم
- سنة الظهور
- 2010 · Google
يحوّل الناس SVG إلى WebP للحصول على صورة نقطية خفيفة ثابتة المقاس للأماكن التي لا تقبل ملفات المتجهات أو ترسمها ببطء، مثل نظام إدارة المحتوى أو معاينة اجتماعية أو صفحة هبوط مزدحمة؛ أما WebP إلى SVG فهو عمل تتبّع وليس تبديل صيغة.
كيف يُحوَّل SVG إلى صورة نقطية وما الذي يجب التحقق منه
يقرأ المحوّل عرض SVG وارتفاعه وviewBox الخاصة به، ثم يرسم كل مسار بالعرض الذي تحدده؛ ويتبع الارتفاع نسبة الأبعاد. ولأن الرسم يتم بالمقاس النهائي، تُنعَّم الخطوط الرفيعة والنصوص الصغيرة مرة واحدة وبالمقياس الصحيح. أما تكبير PNG صغير لاحقًا فلا يبدو نظيفًا بالقدر نفسه.
الخطوط هي المفاجأة المعتادة. إذا كان SVG يشير إلى خط غير مضمّن أو غير محوّل إلى مسارات، يُستخدم خط بديل وتتغير أطوال الأسطر. حوّل النص إلى مسارات في أداة التصميم قبل التصدير. والصور الخارجية المرتبطة بعنوان URL داخل SVG لا تُجلب، فضمّنها أو سطّح الرسم أولًا.
تحويل SVG إلى WebP: ما يُنصح به وما يُتجنب
| افعل | لا تفعل |
|---|---|
| حوّل بضعف عرض CSS المعروض | تحويل الأيقونات البسيطة المضمّنة التي يكون حجمها أصغر بصيغة SVG |
| استخدم بلا فقد للشعارات المسطحة قليلة الألوان | التحويل بعرض 4000 px لخانة بعرض 600 px |
| احتفظ بالأصل SVG لأي مقاسات مستقبلية | إرسال WebP في النشرات البريدية |
| قدّم ملف WebP مع سمتي width وheight لتجنب اهتزاز التخطيط | توقّع نص حي: ملف WebP بكسلات وليس نصًا قابلًا للتحديد |
أسئلة شائعة حول تحويل SVG إلى WebP
ما عرض البكسل المناسب عند تحويل SVG إلى WebP؟
خذ العرض الذي تُعرض به الصورة بوحدة بكسل CSS وضاعفه، لتبقى حادة على شاشات الهواتف والحواسيب المحمولة عالية الكثافة. الرسم المعروض في عمود بعرض 800 px ينبغي تحويله بعرض 1600 px. نادرًا ما يفيد الوصول إلى 3× على الويب، لأن حجم الملف يكبر بينما يبقى الكسب المرئي ضئيلًا.
هل WebP أفضل من SVG للموقع الإلكتروني؟
ليس للشعارات والأيقونات والمخططات البسيطة: ملف SVG النظيف صغير جدًا وحاد بأي مقاس، فاحتفظ به. يتفوق WebP في الرسوم المعقدة ذات التدرجات أو المرشحات أو آلاف المسارات، وفي أي مكان يقبل الصور النقطية فقط، مثل معاينات التواصل الاجتماعي أو نظام إدارة محتوى لا يدعم SVG.
هل تحتفظ صورة WebP بالخلفية الشفافة لملف SVG؟
نعم. يدعم WebP قناة ألفا كاملة في الوضعين مع الفقد وبلا فقد، فتبقى المناطق التي لا تعبئة فيها داخل SVG شفافة. تُنعَّم حواف الأشكال مقابل الشفافية، فتبدو سليمة على أي لون خلفية.
WebP بفقدان أم بدون فقدان للرسوم المتجهة؟
يناسب وضع بلا فقد الشعارات والأيقونات والمخططات المسطحة ذات الألوان الصلبة القليلة؛ فهي تُضغط جيدًا جدًا وتحتفظ بحواف نظيفة تمامًا. أما الوضع مع الفقد بجودة 85 إلى 90 فيناسب الرسوم ذات التدرجات أو الظلال أو الخامات، حيث تثقل ملفات بلا فقد. جرّب الوضعين على ملف واحد واحتفظ بالأصغر الذي يبدو نظيفًا.
لماذا لا أستطيع رفع SVG إلى WordPress؟
لا يدرج WordPress ملفات SVG ضمن أنواع الرفع المسموحة لأن SVG قد يحمل سكربتات. وهو يقبل WebP منذ الإصدار 5.8 الصادر عام 2021، لذا يمنحك التحويل ملفًا تقبله مكتبة الوسائط دون إضافة أمان. وما زال بإمكان المواقع التي تحتاج متجهات حقيقية إضافة دعم SVG عبر إضافة تنقّي الملفات.
هل يمكنني استخدام WebP في رسالة بريدية إخبارية؟
تجنّبه. عدة برامج بريد، منها Outlook لسطح المكتب على Windows، لا تعرض WebP، كما أن Gmail لا يعرض SVG. حوّل الرسم بدلًا من ذلك عبر SVG إلى PNG للبريد.
