اختيار تنسيق الصورة المناسب هو أحد أبسط القرارات وأكثرها تأثيرًا في تطوير الويب. الاختيار الخاطئ قد يُضاعف أو يُثلّث وزن صفحتك، ويُبطئ مؤشرات Core Web Vitals، ويُضرّ بترتيبك في نتائج البحث. إليك تحليلًا عمليًا لمتى تستخدم JPG وPNG وWebP في 2026.
JPG: مثالي للصور الفوتوغرافية
يستخدم JPG ضغطًا مع فقدان البيانات مُحسَّنًا للمحتوى الفوتوغرافي — الصور ذات التدرجات اللونية التدريجية والأنسجة المعقدة والألوان الكثيرة. عند جودة 80–85%، يبدو JPG متطابقًا مع الأصل بينما يكون أصغر بـ 5–10 أضعاف من المصدر غير المضغوط. لا يدعم JPG الشفافية.
PNG: مثالي للصور ذات الشفافية أو الحواف الحادة
يستخدم PNG ضغطًا بدون فقدان البيانات — لا تُحذف أي بيانات بكسل. مثالي للشعارات والأيقونات والصور الملتقطة من الشاشة التي تحتوي على عناصر واجهة المستخدم والرسوم التوضيحية ذات الألوان الثابتة وأي صورة تتطلب خلفية شفافة. ضعف PNG هو حجم الملف: الصورة عالية الدقة المحفوظة بتنسيق PNG غالبًا أكبر بـ 5–10 أضعاف من JPG المكافئ.
WebP: البديل الحديث لكليهما
طوّرت Google تنسيق WebP عام 2010، وهو مدعوم الآن من جميع المتصفحات الحديثة (Chrome وFirefox وSafari 14+ وEdge وOpera)، ويدعم الضغط مع وبدون فقدان البيانات بالإضافة إلى الشفافية. عند جودة بصرية مماثلة، ينتج WebP ملفات أصغر بنحو 25–34% من JPG و26% من PNG. هذا يجعل WebP التنسيق الأمثل لتقريبًا جميع صور الويب في 2026.
- صور فوتوغرافية، بدون شفافية → WebP (مع فقدان) أو JPG
- شعار أو أيقونة أو رسم توضيحي مع شفافية → WebP (بدون فقدان) أو PNG
- لقطة شاشة مع نصوص وعناصر واجهة → WebP (بدون فقدان) أو PNG
- صورة للبريد الإلكتروني (توافق واسع) → JPG
- صورة للطباعة → PNG أو JPG بجودة عالية (90%+)
- أي صورة ويب للمتصفحات الحديثة → WebP بالأولوية