كيف تضغط الصور للويب (دون إفساد الجودة)

لماذا يهم ضغط الصور

الأرقام واضحة:

• 53% من مستخدمي الجوال يغادرون الصفحة إذا استغرق تحميلها أكثر من 3 ثوانٍ (Google)
• كل 100 ميلي ثانية من تحسين وقت التحميل ترفع التحويلات بنسبة 1% (Deloitte)
• Core Web Vitals تؤثر مباشرة في ترتيب Google - و LCP (Largest Contentful Paint) يكون صورة في أغلب الأحيان
• تقدّم صفحة الويب المتوسطة 1.5 MB من الصور - معظمها غير محسّن

قائمة التحقق لضغط الصور

1. اختر الصيغة المناسبة: WebP للويب، و JPG للصور الفوتوغرافية، و PNG فقط عند الحاجة إلى الشفافية وتعذّر استخدام WebP
2. غيّر الحجم أولًا: لا تعرض صورة بعرض 4000px في إطار عرضه 800px. غيّر حجم صورك إلى حجم العرض (أو ضعفه لشاشات Retina).
3. اضغط: استخدم جودة 75-85 للصيغ ذات الفقد. معظم الناس لا يلاحظون الفرق.
4. استخدم WebP: حوّل إلى WebP لتوفير فوري بنسبة 25-35%.
5. التحميل الكسول: أضف loading="lazy" إلى الصور أسفل الشاشة الأولى.
6. حدّد الأبعاد: أضف دائمًا الخاصيتين width و height لمنع اهتزاز التخطيط.

أدوات مجانية لضغط الصور

داخل المتصفح (بلا رفع)

• الضغط الذكي من WebP Buddy: يجد إعداد الجودة الأمثل تلقائيًا. يعمل بالكامل داخل متصفحك - صورك لا تغادر جهازك.
• ضغط WebP: تحكم يدوي في جودة صور WebP.
• التحويل الجماعي: حوّل واضغط صورًا متعددة دفعة واحدة.

سطر الأوامر

# Convert and compress with cwebp
cwebp -q 80 photo.jpg -o photo.webp

# Compress existing WebP
cwebp -q 75 image.webp -o image-compressed.webp

# Batch convert a folder
for f in *.jpg; do cwebp -q 80 "$f" -o "${f%.jpg}.webp"; done

جدول سريع لإعدادات الجودة

الأسئلة الشائعة