هل تحوّل GIF إلى MP4 أم WEBM؟ مقارنة الصيغة الهدف

قررت تحويل ملف GIF لديك. وبقي سؤال الهدف: MP4 أم WEBM أم WEBP المتحرك أم APNG؟ الأربعة كلها أصغر من GIF، والأربعة تقدم مقايضات مختلفة. نفحص في هذا المقال أيها الصحيح في كل حالة.

خلاصة الصيغ الهدف الأربع

MP4 (H.264): أوسع صيغ الفيديو انتشاراً. دعم شامل.

WEBM (VP9): صيغة فيديو مفتوحة. أصغر من MP4 عند الجودة نفسها، ومدعومة في المتصفحات الحديثة.

WEBP المتحرك: يتصرف كصيغة صورة (يُستخدم بوسم <img>)، ويدعم الألوان الكاملة وشفافية ألفا.

APNG: النسخة المتحركة من PNG. ألوان كاملة، وألفا بـ 8 بت، ويتصرف كصورة.

جدول المقارنة

لملف GIF مدته 5 ثوانٍ بدقة 480×270 و15 إطاراً/ث، تقريبياً:

| المعيار | GIF (المصدر) | MP4 | WEBM | WEBP متحرك | APNG | |---|---|---|---|---|---| | الحجم النمطي | 4 ميجابايت | 400 كيلوبايت | 300 كيلوبايت | 1.2 ميجابايت | 2.5 ميجابايت | | شفافية ألفا | ثنائية | لا | لا | 8 بت | 8 بت | | وسم HTML | <img> | <video> | <video> | <img> | <img> | | التشغيل التلقائي | أصيل | يحتاج خاصية | يحتاج خاصية | أصيل | أصيل | | دعم المتصفحات | شامل | شامل | حديثة | حديثة | حديثة | | دعم البريد الإلكتروني | جيد | لا يوجد | لا يوجد | لا يوجد | ضعيف | | دقة كروما كاملة | نعم | لا (4:2:0) | لا (4:2:0) | نعم | نعم |

والسطر الأخير مهم: فصيغ الفيديو تخزّن معلومات اللون بنصف الدقة (تحت-عيّنة كروما 4:2:0)، وهذا يُحدث ضبابية خفيفة عند الحواف اللونية الحادة. أما WEBP وAPNG فلا يفعلان ذلك.

السيناريو 1: حركة منتج على موقع إلكتروني

ستعمل تلقائياً في الصفحة، ولا تلزم الشفافية.

الفائز: WEBM + MP4 معاً.

<video autoplay muted loop playsinline poster="preview.jpg">
  <source src="animation.webm" type="video/webm">
  <source src="animation.mp4" type="video/mp4">
</video>

فتأخذ المتصفحات الحديثة WEBM الأصغر، وتتراجع القديمة إلى MP4. وإنتاج ملفين عمل إضافي بسيط لكنه يكسبك الكفاءة والتوافق معاً.

وإن اضطررت إلى اختيار ملف واحد فخذ MP4؛ فميزة WEBM فارق حجم بنسبة 20–30% وقد لا تستحق تحمّل مخاطرة التوافق.

السيناريو 2: حركة شعار بخلفية شفافة

سيظهر محتوى الصفحة خلفه.

الفائز: WEBP المتحرك.

فصيغ الفيديو لا تدعم شفافية ألفا عملياً. ويُستبعَد MP4/WEBM تماماً في هذا السيناريو.

WEBP مقابل APNG:

| الموضوع | WEBP متحرك | APNG | |---|---|---| | حجم الملف | أصغر | أكبر بمرتين أو ثلاث | | دعم المتصفحات | المتصفحات الحديثة | أوسع قليلاً | | خيار مع فقد | موجود | غير موجود (بلا فقد دائماً) |

وWEBP هو الاختيار الأفضل عموماً لأن وضعه مع الفقد ينتج ملفات أصغر بكثير، ودعم المتصفحات الحديثة له كافٍ.

والحالة التي تفضّل فيها APNG: حين تكون الجودة بلا فقد ضرورة قاطعة (مثل حركة واجهة دقيقة على مستوى البكسل) ويكون حجم الملف ثانوي الأهمية.

وكلاهما أفضل بكثير من الشفافية الثنائية في GIF — فبـ 256 مستوى شفافية يوفران حواف ناعمة، ولا تظهر الحواف المسنّنة التي في GIF.

السيناريو 3: حركة من تسجيل شاشة (عرض واجهة)

تسجيل يبيّن كيفية استخدام برنامج، ويحتوي على نص.

الفائز: WEBM أو WEBP المتحرك — مع الانتباه لمشكلة الكروما.

ففي هذا السيناريو قد تكون تحت-عيّنة الكروما مشكلة حقيقية. إذ تخزّن مرمّزات الفيديو معلومات اللون بنصف الدقة، وهذا يُحدث ضبابية عند حواف النص اللونية الحادة. وقد تصير نصوص الواجهة صغيرة البنط غير مقروءة.

وهناك حلان:

1. استخدم دقة عالية. فإن كان النص بعدد بكسلات كافٍ لم تُلاحَظ نعومة الكروما. أبقِ تسجيل الشاشة بدقته الأصلية.

2. استخدم WEBP. إذ يوفر WEBP دقة لونية كاملة ولا يطبّق تحت-عيّنة الكروما. فيبقى النص حاداً. ويكون الملف أكبر من الفيديو، لكن ذلك يستحق إن كانت القراءة حاسمة.

وتدعم بعض مرمّزات الفيديو ملف 4:4:4 (دقة كروما كاملة). فاستخدمه إن وُجد لكن اختبر دعم المتصفحات له.

السيناريو 4: نشرة بريدية

الفائز: GIF — لا تحوّله.

فعملاء البريد الإلكتروني لا يشغّلون الفيديو تقريباً. ودعم WEBP وAPNG ضعيف كذلك.

اترك GIF كما هو لكن حسّن حجمه: قصّر المدة (2–3 ثوانٍ)، واخفض الدقة (300–400 بكسل)، وقلّل معدل الإطارات (10 إطارات/ث)، واخفض عدد الألوان إلى 128 عند اللزوم.

وملاحظة مهمة: بعض عملاء البريد (وخصوصاً بعض إصدارات Outlook) يعرض الإطار الأول من GIF فقط. فصمّم الإطار الأول ليكون ذا معنى بمفرده.

السيناريو 5: عرض خطوة بخطوة في مقال مدونة

حركة قصيرة تبيّن كيفية إجراء عملية ما.

الفائز: فيديو MP4/WEBM — لكن فكّر في تحكم المستخدم.

ففي هذا السيناريو خيار يخص تجربة المستخدم. إذ قد تشتّت الحركة التي تعمل تلقائياً انتباه القارئ وهو لا يزال يقرأ النص، وقد يكون تكرارها المستمر مزعجاً.

البديل: امنح المستخدم التحكم في التشغيل بالخاصية controls ولا تستخدم autoplay. فيبدأ المستخدم حين يكون مستعداً، ويستطيع الإيقاف المؤقت والإرجاع.

وهذا خيار أفضل عادةً في الحركات الطويلة أو الكثيفة بالمعلومات. أما في الحركات القصيرة الزخرفية فالتشغيل التلقائي مناسب.

السيناريو 6: تحسين دفعي للموقع

في موقعك عشرات ملفات GIF وستحوّلها كلها.

الفائز: WEBM + MP4، بنهج منهجي.

الترتيب:

1. أعدّ جرداً. أي ملفات GIF وأين، وما أحجامها؟ ابدأ بأكبر الملفات؛ فالمكسب متناسب معها.

2. افرز ما يتطلب الشفافية. فهذه ينبغي أن تذهب إلى WEBP لا إلى الفيديو.

3. أنتج زوجاً لأهداف الفيديو. WEBM + MP4.

4. حدّث HTML. حوّل وسوم <img src="x.gif"> إلى كتل <video>. وأضف الخاصية poster.

5. قِس. أجرِ مقارنة قبل وبعد بأدوات سرعة الصفحات. والفارق يظهر فوراً عادةً.

6. لا تحذف ملفات GIF فوراً. احتفظ بها بضعة أسابيع؛ فينبغي أن تستطيع الرجوع إن لاحظت مشكلة. كما قد تحتاج إليها في النشرات البريدية.

إعدادات الجودة

مهما اخترت من صيغة، فالإعدادات مهمة:

لـ MP4/WEBM: استخدم CRF (عامل الجودة الثابت). ويشيع المجال 18–23 لـ H.264، و28–33 لـ VP9 (والقيمة الأدنى جودة أعلى). وفي الفيديوهات المشتقة من GIF يبقى الحجم معقولاً حتى بإعدادات جودة أعلى، لأن المصدر بسيط أصلاً.

لـ WEBP: قيمة الجودة بين 75 و90 توازن جيد لمعظم المحتوى. وثمة وضع بلا فقد أيضاً لكن الملف يكبر بوضوح.

مشترك: لا ترفع الدقة. فإذا كان عرض ملف GIF لديك 400 بكسل، فجعل الفيديو 800 بكسل لا يضيف تفصيلاً، بل يضخّم الملف فحسب.

خلاصة القرار

قرّر بثلاثة أسئلة:

1. هل تلزم الشفافية؟ نعم ← WEBP المتحرك (أو APNG إن لزمت الجودة بلا فقد).

2. هل البيئة بريد إلكتروني أو منتدى قديم؟ نعم ← اتركه GIF، وحسّنه فقط.

3. كل الحالات الأخرى ← WEBM + MP4 معاً. وإن وجب اختيار ملف واحد فـ MP4.

ملاحظة إضافية: في تسجيلات الشاشة ذات النص الحاد قد تخفض تحت-عيّنة الكروما في صيغ الفيديو مقروئية النص. وفي هذه الحالة أبقِ الدقة عالية أو انتقل إلى WEBP.