В разделе «Возможности» вашего отчёта Lighthouse перечислены все неоптимизированные изображения с потенциальной экономией в кибибайтах (КиБ) . Оптимизируйте эти изображения, чтобы страница загружалась быстрее и потребляла меньше данных:
Как Lighthouse отмечает изображения как подлежащие оптимизации
Lighthouse собирает все изображения JPEG или BMP на странице, устанавливает для каждого из них уровень сжатия 85, а затем сравнивает исходную версию со сжатой. Если потенциальная экономия составляет 4 КБ или более, Lighthouse отмечает изображение как подлежащее оптимизации.
Как оптимизировать изображения
Для оптимизации изображений можно предпринять множество шагов, в том числе:
- Использование CDN изображений
- Сжатие изображений
- Замена анимированных GIF-файлов видео
- Ленивая загрузка изображений
- Подача адаптивных изображений
- Подача изображений с правильными размерами
- Использование изображений WebP
Оптимизируйте изображения с помощью инструментов с графическим интерфейсом
Другой подход — пропустить изображения через оптимизатор, установленный на компьютер и работающий в графическом интерфейсе. Например, в ImageOptim вы просто перетаскиваете изображения в его интерфейс, и он автоматически сжимает их без заметного ухудшения качества. Если у вас небольшой сайт и вы можете оптимизировать все изображения вручную, этого варианта, вероятно, будет достаточно.
Squoosh — ещё один вариант. Squoosh поддерживается командой Google Web DevRel.
Руководство по конкретному стеку
Друпал
Рассмотрите возможность использования модуля , который автоматически оптимизирует и уменьшает размер изображений, загружаемых через сайт, сохраняя при этом качество. Также убедитесь, что вы используете встроенные адаптивные стили изображений Drupal для всех изображений, отображаемых на сайте.
Джумла
Рассмотрите возможность использования плагина для оптимизации изображений , который сжимает изображения, сохраняя при этом качество.
Магенто
Рассмотрите возможность использования стороннего расширения Magento, оптимизирующего изображения .
WordPress
Рассмотрите возможность использования плагина WordPress для оптимизации изображений , который сжимает ваши изображения, сохраняя при этом качество.