PNG أم JPEG أم WebP: أي صيغة صور تستخدم؟

معظم قرارات اختيار صيغة الصورة تعود إلى سؤالين. هل تحتاج الصورة إلى مناطق شفافة؟ وهل سيكون فقدان بسيط في الجودة ملحوظًا؟ أجب عن هذين السؤالين وستختار الصيغة نفسها تقريبًا. أما السؤال الثالث، أين سيذهب الملف، فيحدد هل الصيغ الأحدث مسموحة أصلًا، لأن المتاجر الإلكترونية وتطبيقات كثيرة ما زالت لا تقبل إلا JPEG وPNG.

يقارن هذا الدليل بين الصيغ الأربع التي ستصادفها غالبًا للصور والرسومات على الويب: JPEG وPNG وWebP وAVIF. وينتهي باختيار سريع للمهام المعتادة: الشعارات، وصور المنتجات، والصور العادية، والصور المقصوصة بخلفية شفافة.

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

تفاصيل الصيغ مأخوذة من دليل MDN لأنواع ملفات الصور. وصف الدعم لم يعد مهمًا للمتصفحات كما كان: كل المتصفحات الرئيسية الحالية تعرض WebP، وAVIF مدعوم في الإصدارات الحديثة منها جميعًا. أين ما زال يهم؟ في كل مكان آخر، مثل نماذج الرفع والمتاجر الإلكترونية وبرامج البريد الإلكتروني وبرامج سطح المكتب القديمة.

الضغط بفقد وبلا فقد، بكلمات بسيطة

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

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

ينتج عن ذلك قاعدتان عمليتان:

• كل حفظ بفقد يخسر قليلًا إضافيًا. احتفظ بأصل بلا فقد (ملف الكاميرا الأصلي أو PNG أو ملف برنامج التعديل نفسه) وصدّر منه نسخًا بفقد، بدل تعديل ملف JPEG نفسه وإعادة حفظه.
• الضغط بفقد أسوأ ما يكون على الحواف الحادة. الشعار المحفوظ بصيغة JPEG يحصل على "تشويش البعوض" الملطخ حول الحروف، ولقطة الشاشة تحصل على نص ضبابي.

الشفافية: الميزة الحاسمة للصور المقصوصة

لا يحتوي JPEG على قناة ألفا. لا توجد طريقة لتخزين معلومة "هذا البكسل شفاف" في JPEG، لذلك عندما تزيل الخلفية وتحفظ بصيغة JPEG تُملأ المنطقة الفارغة بلون مصمت، عادةً الأبيض أو الأسود. إذا أردت أن توضع الصورة المقصوصة فوق محتوى آخر، فأنت تحتاج إلى PNG أو WebP أو AVIF.

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

يدعم WebP الشفافية في وضعيه بلا فقد وبفقد. تقول وثائق WebP من Google إن WebP بلا فقد يضيف الشفافية مقابل نحو 22% بايتات إضافية، وإن WebP بفقد مع الشفافية أصغر عادةً بنحو 3 مرات من ملف PNG مكافئ. وهذا يجعل WebP بفقد أكفأ طريقة لنشر صورة منتج شفافة على موقعك.

حجم الملف

للصورة نفسها، الترتيب التقريبي من الأكبر إلى الأصغر هو PNG ثم JPEG ثم WebP ثم AVIF، مع تحفظ كبير: PNG "كبير" فقط في الصور الفوتوغرافية. أما في الرسومات المسطحة قليلة الألوان، فكثيرًا ما يكون PNG أصغر من JPEG وأكثر حدة دائمًا.

أرقام Google المنشورة عن WebP معيار مفيد:

• ملفات WebP بلا فقد أصغر بنسبة 26% من ملفات PNG.
• ملفات WebP بفقد أصغر بنسبة 25 إلى 34% من ملفات JPEG المماثلة عند درجة جودة SSIM نفسها.

نصيحة MDN للصور النقطية على الويب هي تفضيل WebP أو AVIF، فهما يضغطان عمومًا أفضل من PNG وJPEG وGIF. ويدعم AVIF أيضًا ألوانًا بعمق 10 و12 بت، وهذا يفيد في التدرجات الناعمة. نقطة ضعفه هي الدعم خارج المتصفحات: تطبيقات ونماذج رفع كثيرة ما زالت ترفضه.

حجم الملف يهم أكثر عندما تقدّم صورًا كثيرة لزوار كثيرين. أما لرفع صورة واحدة إلى متجر إلكتروني يعيد ضغط كل شيء على أي حال، فالصيغة التي يقبلها المتجر أهم من البايتات التي توفرها.

أين تُقبل كل صيغة

المتصفحات هي الجزء السهل. المتاجر الإلكترونية والتطبيقات هي حيث تُرفض الصيغ. هذه الصيغ المقبولة وفق وثائق كل منصة، كما راجعناها في أكتوبر 2026:

يبرز أمران. أولًا، لا تقبل Amazon ولا Walmart ولا كتالوجات Meta صيغتي WebP وAVIF، فاحتفظ بـ JPEG أو PNG للرفع إلى المتاجر الإلكترونية. ثانيًا، يقول Etsy إن ملفات PNG الشفافة غير مدعومة وقد تظهر المناطق الشفافة سوداء، فادمج الصور المقصوصة على لون قبل رفعها هناك. وللمقاسات الدقيقة بالبكسل لكل منصة، راجع مرجع مقاسات صور المنتجات.

أي صيغة تستخدم للمهام الشائعة

الشعارات

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

صور المنتجات

للصور الرئيسية في المتاجر الإلكترونية، استخدم JPEG على خلفية بيضاء نقية. تصف مدونة البائعين في Amazon صيغة JPEG بأنها المفضلة، وكل متجر في الجدول أعلاه يقبلها. صدّر بإعداد جودة عالٍ (نحو 85 إلى 92 في معظم الأدوات) من أصل بلا فقد.

وفي متجرك الخاص، ارفع JPEG أو PNG عالي الجودة ودع المنصة تحوّله. تقول Shopify مثلًا إن خدمة الصور لديها تقدّم تلقائيًا لكل زائر أفضل صيغة يدعمها متصفحه.

الصور العادية

JPEG هو الخيار الافتراضي الآمن للمشاركة والرفع. وعلى موقع تتحكم فيه، يعطي WebP أو AVIF مع بديل JPEG المظهر نفسه ببايتات أقل. إذا كان هاتفك يحفظ ملفات HEIC، فحوّلها إلى JPEG قبل رفعها إلى أي مكان لا يذكر HEIC.

الصور المقصوصة والشفافة

استخدم PNG عندما يجب أن يعمل الملف في كل مكان: في العروض التقديمية والمستندات وأدوات التصميم ومعظم نماذج الرفع. واستخدم WebP عندما تضع الصورة في صفحة ويب خاصة بك وتريدها صغيرة. ولا تستخدم JPEG إلا إذا ملأت الخلفية عمدًا بلون مصمت، مثل الأبيض لمتجر إلكتروني.

لقطات الشاشة والمخططات

PNG أو WebP بلا فقد. الصيغ الفاقدة تجعل النص ضبابيًا.

تقديم الصيغ الحديثة مع بديل احتياطي

إذا كنت تدير موقعك الخاص، فلست مضطرًا إلى اختيار صيغة واحدة. عنصر HTML picture يدع المتصفح يختار أول صيغة يفهمها:

<picture>
  <source srcset="product.avif" type="image/avif">
  <source srcset="product.webp" type="image/webp">
  <img src="product.png" alt="Leather wallet, front view" width="1200" height="1200">
</picture>

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

التحويل بين الصيغ دون مفاجآت

• من PNG أو WebP إلى JPEG: تُدمج المناطق الشفافة. اختر لون التعبئة بنفسك (عادةً الأبيض) بدل ترك الأداة تختاره، لأن بعض الأدوات تستخدم الأسود افتراضيًا.
• من JPEG إلى PNG: يصبح الملف أكبر لا أفضل. الجودة التي فُقدت في JPEG لا تعود.
• من أي صيغة إلى WebP أو AVIF: تحقق من بقاء الشفافية ومن صحة الألوان، وحوّل إلى ملف ألوان sRGB أولًا إذا كانت الصورة ستُعرض على الويب.
• إعادة حفظ ملفات JPEG: كل حفظ بجودة أقل يضاعف الفقد. صدّر مرة واحدة من الأصل.

خيار أسرع للصور المقصوصة

إذا كنت تزيل الخلفيات بالجملة، فإن removebackground.dev يصدّر الصورة المقصوصة بصيغة PNG أو WebP شفافة، أو بصيغة JPG على أي لون مصمت، فتحصل من الرفع نفسه على JPEG على أبيض للمتجر الإلكتروني وPNG شفاف لموقعك.