أي صيغة صور يجب أن تستخدم؟

السؤال الذي يحسم الأمر

هل الصورة مكوّنة من تدرجات لونية متصلة، أم من مساحات مسطحة وحواف حادة؟

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

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

الإجابات المختصرة

صورة فوتوغرافية ستذهب إلى شخص أو بريد إلكتروني أو نظام قديم: JPG بجودة 85 تقريبًا. مقروءة في كل مكان، وصغيرة، والفقدان غير مرئي عند هذا الإعداد.

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

أي شيء سيوضع في صفحة ويب تتحكم فيها: WebP، أو AVIF إن كنت تحتمل وقت الترميز. كلتاهما تؤدي مهمة JPG وPNG بشكل أفضل — WebP لها وضعان، بفقدان وبلا فقدان، وتحمل الشفافية في كليهما، وAVIF تخزّن الصورة الفوتوغرافية بنحو نصف حجم JPEG المكافئ.

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

ما لا تستطيع كل صيغة فعله

القيود أكثر فائدة من قوائم الميزات، لأنها ما يوقع الناس في الخطأ.

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

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

WebP لها سقف صارم قدره 16,383 بكسل لكل جانب، وهو سخي للصور الفوتوغرافية ومقيّد للصور البانورامية، أو لقطة شاشة كاملة لصفحة ويب طويلة، أو خريطة ممسوحة ضوئيًا.

AVIF بطيئة في الترميز. ثوانٍ لكل صورة فوتوغرافية كبيرة، لأنها إطار ثابت من ضغط الفيديو، والبحث هو ما يحقق صغر الحجم. أما فك الترميز ففوري، وهذه هي المقايضة الصحيحة لشيء يُرمَّز مرة ويُشاهَد كثيرًا.

أين يقع خط التوافق فعلًا

هنا تكون النصائح متأخرة سنوات في الاتجاهين. كل متصفح حالي يقرأ WebP وAVIF، ومنذ سنوات — لذا بالنسبة لموقع ويب، انتهت حجة التوافق ضدهما. وتقديم AVIF مع بديل JPEG عبر عنصر picture يزيل حتى هذا القلق.

أما خارج المتصفح فالصورة مختلفة، وهذا هو الجزء الذي يخطئ فيه الناس في الاتجاه المعاكس. برامج البريد الأقدم، وكثير من عارضات الصور على سطح المكتب، وقدر كبير من برامج الشركات، ومعظم مسارات عمل الطباعة لا تزال لا تقرأ WebP أو AVIF بشكل موثوق. لذا فالقاعدة تتعلق بالوجهة لا بالسنة: الصيغ الأحدث لصفحة ويب تتحكم فيها، وJPG أو PNG لملف تسلّمه لشخص أو لنظام.

التحويل لا يُصلح الضرر

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

ومع ذلك يستحق الأمر في اللحظة المناسبة. التحويل إلى PNG قبل جولة من التعديل يعني أن كل حفظ لاحق لا يكلّف شيئًا، بينما تعديل ملف JPG وإعادة حفظه يُتلفه في كل مرة. افعل ذلك في بداية العمل، لا بعد أربع جولات من الحفظ.

والمنطق نفسه ينطبق في الاتجاه الآخر. الترميز إلى AVIF أو WebP من ملف JPEG يعني أن المُرمِّز الجديد يرث عيوب القديم وينفق بتات حقيقية للحفاظ عليها — لذا فالملف المرمَّز مرة واحدة من الأصل أصغر وأفضل من ملف مرمَّز مرتين. ابدأ دائمًا من أفضل نسخة لديك.