Оптимизация изображений WordPress — это не только конвертация JPG в WebP. Важно, какой файл реально скачивает браузер, соответствует ли его размер месту в макете и не задерживается ли главное изображение страницы.
С чего начать
- Найдите самые тяжёлые изображения в DevTools Network.
- Сравните фактическое разрешение файла и размер, в котором он показывается на экране.
- Проверьте, есть ли подходящие версии изображения для мобильного и десктопного вида.
- Выберите формат с хорошим соотношением качества и размера: иногда WebP/AVIF, иногда JPEG или PNG оправданнее.
- После изменений проверьте визуальное качество и метрики LCP.
Как WordPress помогает с размерами
Когда изображение добавлено через медиатеку, WordPress может создавать несколько размеров и формировать srcset/sizes. При выводе из темы используйте штатные функции, например wp_get_attachment_image(), чтобы по возможности сохранять эти возможности.
Если же вставлен прямой URL огромного оригинала, браузер может скачивать больше, чем нужно. Для карточек каталога предпочитайте сформированную миниатюру, а не полный файл из медиатеки.
WebP и AVIF: что выбирать
WebP широко поддерживается современными браузерами и нередко эффективнее JPEG/PNG. AVIF тоже может сокращать размер, но его обработка на сервере зависит от PHP/библиотек изображений и конфигурации WordPress. Не конвертируйте всё без контроля качества: скриншоты интерфейса, логотипы и фотографии ведут себя по-разному.
Главное изображение и lazy loading
Не добавляйте loading="lazy" бездумно ко всем изображениям. Если изображение является крупнейшим элементом первого экрана (LCP), отложенная загрузка может задерживать появление контента. А изображения ниже первого экрана часто можно загружать лениво.
Что делать с уже загруженными файлами
Перед массовой оптимизацией сделайте резервную копию медиафайлов и базы. Проверьте, заменяет ли плагин исходники или создаёт новые форматы рядом с ними. После конвертации осмотрите 3–5 характерных страниц: фото, карточки товаров, логотипы, прозрачные PNG и анимации.
Проверка готовности
- На мобильном загружается разумная по разрешению версия файла.
- У всех значимых изображений осмысленный
alt(у декоративных — пустой). - Заданы размеры или резервируется пространство, чтобы не было скачков макета.
- Не ломаются WebP/AVIF для браузеров и устройств аудитории.
- Измерение LCP после изменений не стало хуже.
Связанный разбор: медленный WordPress и кеширование.
Источник: https://developer.wordpress.org/reference/functions/wp_get_attachment_image/
Материал был полезен?
Помогите нам сделать материалы точнее и понятнее.