Skip to content

صيغ الصور موضحة: PNG وJPG وWebP وAVIF — متى تستخدم أيها

10 دقائق قراءة

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

ما الذي يكبّر حجم ملف الصورة فعلاً

قبل الحديث عن الصيغ، تحدّد ثلاثة أرقام مقدار المساحة التي تستهلكها الصورة:

  • الأبعاد بالبكسل. صورة بمقاس 4000×3000 تحوي بياناتٍ تعادل 16 ضعفاً لنفس الصورة بمقاس 1000×750. اختيار الصيغة لن ينقذك من رفع صورة 4000 بكسل في مكانٍ عرضه 600 بكسل — أنت ترمي البايتات على معالج المستخدم ليس إلا.
  • عمق الألوان والقنوات. بكسل RGB من 8 بت يساوي 3 بايت؛ بكسل RGBA من 8 بت (مع قناة ألفا للشفافية) يساوي 4. 16 بت لكل قناة يضاعف ذلك. معظم الصور بصيغة 8-بت RGB، وهذا مناسب.
  • الضغط. هنا تبدأ الصيغة بالأهمية فعلاً. صورتان بنفس البكسلات تماماً قد يكون حجمهما 5 ميغابايت أو 200 كيلوبايت بحسب الكوديك الذي رمّزهما وبأي جودة.

أرخص توفيرٍ للحجم يكون دائماً تقريباً في الخطوة الأولى: قلّص المقاس قبل الضغط. صورة مصغّرة عرضها 600 بكسل بصيغة AVIF مضبوطة جيداً ستبقى تتفوّق على JPG بمقاس 4000 بكسل. إذا لم تجلب الصورة بعد إلى أبعاد عرضها الفعلية، افعل ذلك أولاً بأداةٍ مثل أداة تغيير حجم الصور لدينا قبل أن تتجه لتحويل الصيغة.

الصيغ الأربع التي تهم اليوم

هناك عشرات صيغ الصور. في 2026 تحتاج فقط أن تفهم أربعاً منها جيداً: PNG وJPG وWebP وAVIF. تظهر أيضاً GIF وSVG لكن لأسبابٍ ضيّقة سنغطّيها في النهاية.

PNG — بلا فقدان، صديقة للشفافية، كبيرة

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

لهذه الموثوقية ثمن: ملفات PNG للصور الفوتوغرافية كبيرة بشكلٍ كارثي. صورة بمقاس 1200×800 قد تكون 3 ميغابايت كـ PNG و180 كيلوبايت كـ JPG، بلا فرقٍ مرئي. PNG جيدة لصفوف البكسلات المتطابقة الطويلة (الشعارات، الأيقونات، لقطات الواجهة، الرسم الخطي) وسيئة لتفاصيل الصور الفوتوغرافية الحقيقية المليئة بالتشويش.

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

JPG — العامل العتيق للصور الفوتوغرافية

JPG (أو JPEG، الشيء نفسه) من عام 1992 ولا يزال يؤدّي عملاً واحداً أفضل من أي شيءٍ آخر تقريباً: ضغط الصور الفوتوغرافية. يتخلّص ضغطها الذي يفقد بعض البيانات من تفاصيلَ بصرية بالكاد ترى — تحوّلاتٍ لونية دقيقة في الظلال، وتشويشٍ عالي التردّد في درجات البشرة — والنتيجة بجودة 75 إلى 85 لا تكاد تتميّز عن الأصل من مسافة المشاهدة العادية، بجزءٍ يسير من الحجم.

JPG لا تملك قناة ألفا. لا تستطيع الشفافية. تصدير شعارٍ ذي خلفية شفافة كـ JPG يعطيك خلفية بيضاء على كل شيء — الإجابة الخاطئة في كل مرة. JPG تتدهور أيضاً مع كل حفظٍ متكرّر؛ الأخطاء تتراكم. حرّر بـ PNG أو بصيغة الأصل (RAW)، وصدّر إلى JPG مرّة واحدة في النهاية.

استخدم JPG لـ: الصور الفوتوغرافية، التدرّجات اللونية المعقّدة، أي شيء يمكنك تحمّل أن يكون فيه "مطابقاً إدراكياً" بدل "مطابقاً بايتاً ببايت". لا تستخدم JPG لـ: الشعارات، الأيقونات، لقطات النصوص، أي شيء يحتاج شفافية.

WebP — الخيار العصري الآمن

نشرت غوغل WebP عام 2010، وتدعمها كل المتصفّحات الكبرى منذ نحو 2020. صيغة واحدة تتعامل مع الضغط بفقدان وبدون فقدان، تدعم الشفافية، وتتفوّق باستمرار على PNG وJPG في حجم الملف بنفس الجودة البصرية. للصور الفوتوغرافية، WebP بجودة 80 تكون عادةً أصغر بـ 25 إلى 35 بالمئة من JPG المكافئ. للمحتوى بنمط PNG (الشعارات، الواجهات)، WebP بلا فقدان أصغر عادةً بـ 20 إلى 30 بالمئة من PNG.

كلمة "باستمرار" مهمّة. WebP لا تملك حالةً سحرية تسحق فيها المنافسة — هي ببساطة أفضل بثباتٍ في كل شيء. هذا يجعلها خياراً افتراضياً جيّداً حين لا تحسّن صورةً صورة.

التحفّظ: عدد قليل من البيئات القديمة (برامج بريد قديمة جداً، بعض برامج تحرير الصور، خطوط تصدير CMS معيّنة) لا تقبل WebP حتى الآن. للموقع، آمنة. لملفٍ تبعثه عبر البريد إلى عميلٍ غير تقني، أرسل JPG أو PNG.

استخدم WebP لـ: أي صورةٍ على الويب تقريباً حين تتحكّم بالواجهة. لا تستخدم WebP لـ: تسليمات إلى أنظمة قد لا تقبلها، أو مرفقات البريد التجاري.

AVIF — البطل الجديد، مع تحفّظات

AVIF (2019، مبنية على كوديك الفيديو AV1) هي أحدث صيغة في هذه القائمة. بنفس الجودة البصرية، تنتج ملفات أصغر بـ 30 إلى 50 بالمئة من WebP — وWebP كانت أصلاً أصغر من JPG. دعم المتصفّحات أصبح الآن شاملاً في المتصفّحات الحديثة.

تحفّظان. الأول: ترميز AVIF بطيء — أبطأ بشكلٍ ملموس من JPG أو WebP. لصورةٍ رئيسية لمرّة واحدة لا يهم؛ لدفعةٍ من 5000 صورة منتج يهم. الثاني: تتفاوت جودة المرمّزات بشكلٍ كبير — مرمّز AVIF سيئ الضبط قد ينتج عيوباً مكتلة غريبة في المناطق المنبسطة (السماء، التدرّجات الناعمة) لا توجد في WebP مكافئ. استخدم مرمّزاً موثوقاً وافحص الناتج.

استخدم AVIF لـ: الصفحات الحسّاسة للأداء، السياقات الحساسة لعرض النطاق (الجوّال، الأسواق الناشئة)، الصور التي تخدمها مرّة وتخزّنها بقوة. لا تستخدم AVIF لـ: صور تحتاج إلى تحريرها لاحقاً، تسليمات إلى أنظمة لا تقبلها (معظم البريد، أدوات التصميم الأقدم).

الإشارتان المشرّفتان: GIF وSVG

GIF ميتة عملياً. تكدّس 256 لوناً فقط، تنتج ملفاتٍ ضخمة لأي شيءٍ فوتوغرافي، والشيء الوحيد الذي تحسنه (الرسوم المتحرّكة القصيرة) صار يفعله فيديو MP4/WebM القصير، وWebP المتحرّكة، وAVIF المتحرّكة. الاستثناء: رسوم البكسل المتحرّكة الصغيرة وسياقات الميمات حيث "GIF" هي الملف المتوقّع ثقافياً.

SVG ليست صيغة نقطية أصلاً — هي صيغة متجهية. تصف SVGs الأشكال والمسارات والنصوص رياضياً، فتتسع لأي حجمٍ دون فقدان الحدّة، وغالباً ما تكون صغيرة جداً (بضعة كيلوبايت). استخدم SVG لأي شعار أو أيقونة أو رسم تملكه كمتجه. لا تحاول استخدام SVG للصور الفوتوغرافية — الأداة الخطأ.

شجرة القرار: أي صيغة، الآن

امشِ نازلاً. أول تطابق هو جوابك.

  1. هل هو شعار أو أيقونة أو رسم تملكه كمتجه؟ → SVG.
  2. هل هي لقطة واجهة أو نصّ تهمّ فيه حدّة البكسل، والملف صغير (أقل من بضع مئات الكيلوبايت)؟ → PNG (أو WebP بلا فقدان إن كنت تتحكّم بالبيئة).
  3. هل هي صورة فوتوغرافية، وأنت تحسّن لموقعٍ حديث؟ → AVIF أولاً، ثم WebP كاحتياط، ثم JPG كملاذٍ أخير.
  4. هل هي صورة فوتوغرافية تُرسل بالبريد، أو تُرفق بمستند، أو تُسلَّم لعميل؟ → JPG بجودة 85.
  5. هل تحتاج شفافيةً على سطحٍ غير ويب (برنامج تحرير، شرائح عرض)؟ → PNG.
  6. هل هي رسوم متحرّكة؟ → فيديو MP4/WebM قصير لأي شيءٍ حديث، WebP المتحرّكة لواجهات الصفحات، GIF فقط حين يكون متوقّعاً ثقافياً.

لمعظم سير العمل الواقعي: PNG للرسوم بالشفافية، JPG أو WebP للصور الفوتوغرافية، AVIF حين تحتاج فعلاً مكسب عرض النطاق. كفّ عن التعلّق بالحالات الحدّية.

سير العمل الذي يوفّر البايتات فعلاً

اختيار الصيغة خطوة في سلسلة. تخطّي الخطوات الأخرى هو السبب الأشيع لـ "حوّلت كل شيء إلى WebP والموقع لا يزال بطيئاً". هنا الخطوات التي تُحدث فرقاً.

قلّص أولاً، ثم اضغط، ثم حوّل

الترتيب يهم. إذا كانت صورتك بعرض 4000 بكسل، وتخطيطك يعرضها بعرض 1200 بكسل، فكل تحويلٍ تفعله قبل ذلك يضيع — أنت ترمّز 11 ميغابكسل من التفاصيل سيرميها المتصفّح بعدها. خفّض الأبعاد أولاً بـ أداة تغيير حجم الصور لدينا، ثم استخدم أداة ضغط الصور لضغط البايتات، ثم محوّل الصور إن كنت أيضاً تحتاج لتغيير الصيغة.

اقطع قبل أن تضغط

إن كان موضوع الصورة 40 بالمئة من الإطار والبقية سماء، تستطيع التخلّص من 60 بالمئة من البكسلات بلا تكلفةٍ في الجودة بالقصّ. أداتنا أداة قصّ الصور هي الأسرع؛ افعل ذلك قبل تحويل الصيغة، لا بعده. المنطق نفسه ينطبق على اللقطات بأشرطة سوداء وتسجيلات الشاشة.

طابِق الجودة مع سياق العرض

شعار رئيسي على صفحة تسويقية يستحق جودة 85 فأعلى. مصغّرة في خيط تعليقات تنجو بجودة 65. لا أحد سيلاحظ الفرق على مصغّرة 200 بكسل، والتوفير في تحميل الصفحة حقيقي. معظم أدوات الضغط على الإنترنت تعطيك شريط جودة — استخدمه بقصد، لا على قاعدة "الأقصى يعني الأفضل".

اجمع الصور في PDF واحدة حين تستطيع

إن كنت تُرسل مجموعة صور لأحد (مسح عقد، معرض منتج، ألبوم إجازة)، فإن PDF واحدة غالباً أصغر من مجموع أجزائها وأمتع للقراءة بكثير. أداتنا محوّل الصور إلى PDF تجمعها من جانب المتصفّح. فقط انتبه: ترث PDF أبعاد الصور المدخلة، إذن قلّص واقطع أولاً.

أخطاء تُرسل صوراً بحجم 4 ميغابايت

"الحفظ بـ PNG للحفاظ على الجودة" لصورةٍ فوتوغرافية

الخطأ الأغلى. PNG بلا فقدان، وهذا يبدو الخيار الآمن. لصورةٍ فوتوغرافية ينتج ملفاً أكبر بعشرة أضعاف من JPG المكافئ بجودة 85، بلا تحسّنٍ مرئي. بلا فقدان لا تعني "جودة عالية" — تعني "بكسلات دقيقة". الصور الفوتوغرافية لا تستفيد من البكسلات الدقيقة، لأن العين البشرية لا ترى الفرق.

إعادة حفظ JPG مرّاتٍ متكرّرة

كل حفظٍ لـ JPG يضيف عيوب ضغط. افتح، حرّر، احفظ، افتح، حرّر، احفظ — وبعد ثلاث جولات تبدو الصورة أسوأ بشكلٍ ظاهر. حرّر بأعلى دقّةٍ يسمح بها مصدرك (RAW، PNG، WebP/AVIF الأصلية)، وصدّر إلى JPG مرّة واحدة عند الانتهاء.

استخدام WebP لملف "سأرسله بالبريد إلى جدتي"

دعم المتصفّحات شامل. عملاء البريد ليسوا متصفّحات. بعض تطبيقات البريد الأقدم لا تعرض مرفقات WebP حتى الآن، والمستلِم يرى صورةً مكسورة أو تنزيلاً لا يستطيع فتحه. للبريد والأسطح الأقدم المشابهة، JPG وPNG هما الخياران الآمنان حتى الآن.

الثقة العمياء بـ"التحويل التلقائي" للصيغة

كثير من منصّات CMS تشحن اليوم الصور كـ"ما يقبله المتصفّح". هذا في الغالب صحيح، لكنه قد يعيد ترميز JPG مضغوطة سلفاً إلى WebP، فيضيف جولة ضغطٍ بفقدانٍ ثانية فوق الأولى. تفحّص افتراضات منصّتك؛ أحياناً "ارفع JPG وحسب" هو الصحيح، ويجب على المنصّة أن تتركها وشأنها.

اعتبار جودة 100 "الخيار الآمن"

جودة 100 في الصيغ بفقدان (JPG، WebP، AVIF) في الغالب إهدار. الفارق في الحجم بين جودة 90 و100 كبير؛ والفارق المرئي يكاد لا يُذكر. لمعظم المحتوى الفوتوغرافي، النقطة المثلى بين جودة 80 و85.

الخصوصية: لماذا التحويل في المتصفّح يهم

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

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

المحوّلات على جانب العميل تنجز كل العمل داخل لسان متصفّحك عبر WebAssembly أو واجهة Canvas الأصيلة. يُقرأ الملف إلى الذاكرة، يُعالَج محلّياً، ويُكتب كتنزيل. افتح أدوات المطوّرين، انتقل إلى لوحة الشبكة — لن ترى أي رفع. كل أداة على easytoolapp — سواء محوّل الصور أو أداة ضغط الصور أو أداة تغيير الحجم أو أداة القصّ — تعمل بهذا الأسلوب. لأي شيءٍ لا تنشره علناً، هذا هو الخيار الوحيد الذي يمكن الدفاع عنه.

ما معنى "بلا فقدان" فعلاً عند الصور

"بلا فقدان" واحدة من أكثر الكلمات إساءةً للاستخدام في عالم أدوات الصور. كن دقيقاً في تحديد أيها تقصد.

  • بلا فقدان رياضياً — كل بكسل ناتج يساوي كل بكسل مدخل. PNG وWebP بلا فقدان تفعلان هذا. AVIF بلا فقدان موجودة أيضاً لكنها نادرة الاستخدام.
  • بلا فقدان بصرياً — يبدو الناتج مطابقاً من مسافة المشاهدة العادية، لكن البايتات الأساسية مختلفة. JPG بجودة 90 إلى 95، WebP بجودة 90، AVIF بجودة 80 — كلّها تتأهّل للتصوير الاعتيادي.
  • "بلا فقدان ضمن هذا السير" — لغة تسويقية. تعني عادةً أن الأداة لم تُدخل ضغطاً إضافياً فوق ما كان موجوداً. اقرأ الحروف الصغيرة.

للرسوم ذات الحواف الحادّة والمناطق المنبسطة الواسعة (الشعارات، الواجهات) تهم اللافقدانية الرياضية، لأن الضغط بفقدان يلطّخ تلك الحواف بهالاتٍ خفيفة. للصور الفوتوغرافية لا تهمّ تقريباً أبداً؛ بلا فقدان بصرياً بجزءٍ يسير من الحجم هو المقايضة الأفضل.

الخلاصة الصريحة

قلّص أولاً. اقطع إن استطعت. اختر الصيغة التي تطابق نوع المحتوى، لا الصيغة التي اعتدت عليها. للصور الفوتوغرافية على الويب: AVIF إن أمكن، WebP وإلا، JPG كاحتياط. للرسوم ذات الشفافية: PNG، أو SVG إن كانت متجهية. جودة 80 إلى 85 كافية تقريباً دائماً؛ جودة 100 إهدارٌ تقريباً دائماً. وإن احتوت الصورة شيئاً لا تنشره علناً، فلتُجرَ التحويلة في متصفّحك، لا على خادم شخصٍ آخر.

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