يسرد قسم "الفرص" في تقرير Lighthouse جميع الصور بتنسيقات الصور القديمة، ويعرض التوفيرات المحتملة التي تم تحقيقها من خلال عرض إصدارات AVIF من هذه الصور:
![لقطة شاشة لتدقيق أداة Lighthouse الخاصة بعرض الصور بالتنسيقات الحديثة](https://developer.chrome.com/static/docs/lighthouse/performance/uses-webp-images/image/a-screenshot-the-lightho-f5772f34fea23.png?authuser=5&hl=ar)
ما أهمية عرض الصور بتنسيق AVIF أو WebP؟
AVIF وWebP هما تنسيقان للصور يتميزان بخصائص ضغط وجودة فائقة مقارنةً بصيغهما القديمة بتنسيق JPEG وPNG. إنّ ترميز الصور بهذه التنسيقات بدلاً من JPEG أو PNG يعني أنه سيتم تحميلها بشكل أسرع وتستهلك كمية أقل من بيانات شبكة الجوّال.
يتوفر AVIF في Chrome وFirefox وOpera، ويعرض أحجام ملفات أصغر مقارنةً بالتنسيقات الأخرى التي لها نفس إعدادات الجودة. يمكنك الاطّلاع على الدرس التطبيقي حول ترميز صور AVIF للحصول على مزيد من المعلومات حول هذا النوع من المحتوى.
يتوافق تنسيق WebP مع أحدث إصدارات متصفّحات Chrome وFirefox وSafari وEdge وOpera، ويوفّر إمكانية ضغط أفضل للصور على الويب بدون فقدان البيانات. يمكنك الاطّلاع على تنسيق صورة جديد للويب لمعرفة مزيد من المعلومات حول تنسيق WebP.
آلية Lighthouse في احتساب المبالغ التي يمكن توفيرها
تجمع أداة Lighthouse كل صورة BMP وJPEG وPNG على الصفحة، وتحوِّل كل صورة إلى تنسيق WebP، وتقدِّر حجم ملف AVIF، وتسجّل مبالغ التوفير المحتملة استنادًا إلى أرقام الإحالات الناجحة.
توافُق المتصفح
يتوافق تنسيق WebP مع أحدث إصدارات Chrome وFirefox وSafari وEdge وOpera، في حين تتوفّر إمكانية استخدام AVIF بشكل محدود. يجب تقديم صورة احتياطية بتنسيق PNG أو JPEG للتوافق مع المتصفحات القديمة. يُرجى مراجعة القسم كيف يمكنني اكتشاف توافق المتصفِّح مع WebP؟ للحصول على نظرة عامة على الأساليب الاحتياطية والقائمة أدناه لمعرفة ما إذا كان المتصفِّح متوافقًا مع تنسيقات الصور.
للاطّلاع على توافق المتصفِّح الحالي مع كل تنسيق حديث، اطّلِع على الإدخالات أدناه:
إرشادات خاصة بحِزم البيانات
AMP
يمكنك عرض جميع مكوِّنات
amp-img
بتنسيق WebP مع تحديد عنصر احتياطي مناسب
للمتصفّحات الأخرى.
Drupal
يمكنك تثبيت وحدة للاستفادة من تنسيقات صور WebP وإعدادها في موقعك الإلكتروني. وتنشئ هذه الوحدات تلقائيًا إصدار WebP من الصور التي حمّلتها بهدف تحسين مُدد التحميل.
Joomla
ويمكنك استخدام plugin أو خدمة تتيح لك تحويل صورك المحمَّلة إلى أفضل التنسيقات تلقائيًا.
Magento
ننصحك بالبحث في سوق Magento عن مجموعة متنوعة من إضافات الجهات الخارجية للاستفادة من تنسيقات الصور الأحدث.
iPhone
تجدر الإشارة إلى أنّ فيديوهات Webp وصور avif وفيديوهات Webm لن تعمل على هواتف iPhone التي تعمل بالإصدارات الأقدم من نظام التشغيل iOS 16.
WordPress
يمكنك استخدام plugin أو خدمة تتيح لك تحويل صورك المحمَّلة إلى أفضل التنسيقات تلقائيًا.