يسرد قسم "الفرص" في تقرير Lighthouse جميع الصور غير المحسَّنة، مع التوفير المحتمل بالكيلوبايت (KiB). حسِّن هذه الصور لكي يتم تحميل الصفحة بشكل أسرع وتستهلك كمية أقل من البيانات:
كيفية تصنيف Lighthouse للصور على أنّها قابلة للتحسين
تجمع Lighthouse كل صور JPEG أو BMP على الصفحة، وتضبط مستوى ضغط كل صورة على 85، ثم تقارن النسخة الأصلية بالنسخة المضغوطة. إذا كان حجم التوفير المحتمل 4 كيلوبايت أو أكثر، يضع Lighthouse علامة على الصورة باعتبارها قابلة للتحسين.
كيفية تحسين الصور
هناك العديد من الخطوات التي يمكنك اتّخاذها لتحسين صورك، بما في ذلك:
- استخدام شبكات توصيل المحتوى (CDN) للصور
- ضغط الصور
- استبدال صور GIF المتحركة بفيديو
- التحميل الكسول للصور
- عرض صور متجاوبة
- عرض الصور بأبعاد صحيحة
- استخدام صور WebP
تحسين الصور باستخدام أدوات واجهة المستخدم الرسومية
هناك طريقة أخرى تتمثل في تشغيل صورك من خلال أداة تحسين تثبّتها على الكمبيوتر وتشغّلها كواجهة مستخدم رسومية. على سبيل المثال، باستخدام ImageOptim، يمكنك سحب الصور وإفلاتها في واجهة المستخدم، ثم يتم تلقائيًا ضغط الصور بدون المساس بجودتها بشكل ملحوظ. إذا كنت تدير موقعًا إلكترونيًا صغيرًا ويمكنك تحسين جميع الصور يدويًا، من المحتمل أن يكون هذا الخيار مناسبًا لك.
Squoosh هو خيار آخر. يتولّى فريق Google Web DevRel صيانة تطبيق Squoosh.
إرشادات خاصة بكل حزمة
Drupal
يمكنك استخدام وحدة تتولّى تلقائيًا مهمّة تحسين وتقليل حجم الصور التي يتم تحميلها على موقعك الإلكتروني مع المحافظة على مستوى الجودة. يُرجى التأكّد أيضًا من أنّك تستخدم أنماط الصور السريعة الاستجابة الأصلية المتوفّرة من Drupal لجميع الصور التي يتم عرضها على الموقع الإلكتروني.
Joomla
يمكنك استخدام مكوّن إضافي لتحسين الصورة لضغط صورك مع المحافظة على مستوى الجودة.
Magento
يمكنك استخدام إضافة خارجية في Magento تعمل على تحسين الصور.
WordPress
يمكنك استخدام مكوّن WordPress الإضافي لتحسين الصورة الذي يضغط صورك مع المحافظة على الجودة.