Оптимизация изображений в WordPress: как ускорить сайт и улучшить SEO

Автор: Вера Полякова | Опубликовано: 02.12.2025

Изображения часто занимают значительную часть веса страниц на сайтах WordPress, что замедляет загрузку и негативно влияет на поведенческие факторы и SEO. В этой статье мы подробно разберем, как оптимизировать изображения в WordPress, чтобы ускорить сайт и улучшить позиции в поисковой выдаче. Рассмотрим эффективные плагины и приведем примеры кода для автоматизации процесса.

Почему важно оптимизировать изображения в WordPress

Большие и не оптимизированные изображения увеличивают время загрузки страниц, что ведет к ухудшению пользовательского опыта и снижению конверсии. Google учитывает скорость загрузки при ранжировании сайта, поэтому оптимизация изображений — важный аспект SEO. Также оптимизация снижает нагрузку на сервер и экономит трафик пользователей.

Без оптимизации изображения могут занимать десятки мегабайт, особенно если используются форматы BMP или PNG без сжатия. Правильный подход позволяет уменьшить размер файлов в несколько раз без заметной потери качества.

Оптимизация включает несколько направлений: сжатие файлов, выбор правильного формата, адаптивные изображения для разных устройств, отложенная загрузка (lazy load) и автоматическое добавление атрибутов alt для SEO.

Как реализовать автоматическую оптимизацию изображений в коде WordPress

Помимо плагинов, можно написать собственный код для базовой оптимизации изображений. Например, можно использовать хуки WordPress для обработки загружаемых файлов. Ниже пример функции, которая сжимает JPEG изображения при загрузке с помощью встроенной функции wp_image_editor_save_pre.

add_filter('wp_image_editor_save_pre', 'wpreg_optimize_image_on_upload', 10, 2);
function wpreg_optimize_image_on_upload($image, $args) {
    if (strpos($args['mime_type'], 'jpeg') !== false || strpos($args['mime_type'], 'jpg') !== false) {
        $image->set_quality(75); // Устанавливаем качество сжатия 75%
    }
    return $image;
}

Эта функция уменьшит качество JPEG при сохранении, что снизит размер файла без заметной потери качества. Аналогично можно реализовать дополнительные фильтры для PNG и WebP.

Автоматическое создание WebP форматов для изображений

WebP — современный формат, обеспечивающий лучшее сжатие, но не все браузеры поддерживают его. Можно добавить код, который при загрузке создаст WebP версию изображения и подставит ее в srcset для браузеров, которые поддерживают WebP.

function wpreg_generate_webp_on_upload($metadata, $attachment_id) {
    $upload_dir = wp_upload_dir();
    $file = $upload_dir['basedir'] . '/' . $metadata['file'];
    $webp_file = preg_replace('/\.(jpe?g|png)$/i', '.webp', $file);

    if (file_exists($file)) {
        $image = imagecreatefromstring(file_get_contents($file));
        if ($image !== false) {
            imagewebp($image, $webp_file, 80); // Качество 80%
            imagedestroy($image);
        }
    }
    return $metadata;
}
add_filter('wp_generate_attachment_metadata', 'wpreg_generate_webp_on_upload', 10, 2);

Этот код автоматически создаст WebP копию изображения при его загрузке, которая может быть использована с помощью дополнительного кода или плагина для вывода WebP в front-end.

Дополнительные советы по оптимизации изображений в WordPress

Lazy Load — отложенная загрузка изображений

Отложенная загрузка позволяет загружать изображения только тогда, когда пользователь прокручивает страницу до их появления в окне просмотра. Это сокращает первоначальное время загрузки и снижает нагрузку на сервер.

В WordPress начиная с версии 5.5 встроена поддержка lazy load через атрибут loading="lazy". Чтобы включить ее для всех изображений, можно добавить фильтр:

add_filter('wp_lazy_loading_enabled', '__return_true');

Также можно использовать плагины с расширенными возможностями ленивой загрузки, например, a3 Lazy Load или встроенные функции в оптимизирующих плагинах.

Выбор правильного размера изображения (адаптивные изображения)

WordPress автоматически генерирует несколько размеров для загруженного изображения, и при выводе в шаблонах стоит использовать функции wp_get_attachment_image() или the_post_thumbnail() с параметром srcset. Это позволяет браузеру выбирать подходящий размер под экран пользователя.

Пример использования:

echo wp_get_attachment_image($attachment_id, 'medium');

Это гарантирует, что пользователи с мобильных устройств не будут загружать полные версии изображений, что экономит трафик и ускоряет загрузку.

Использование CDN для доставки изображений

Content Delivery Network (CDN) распределяет копии ваших изображений по серверам в разных географических точках, что сокращает время доставки данных пользователям.

Популярные CDN для WordPress — Cloudflare, BunnyCDN, KeyCDN. Многие оптимизирующие плагины интегрируются с CDN, что облегчает настройку и автоматическую загрузку оптимизированных изображений.

Итоговые рекомендации по оптимизации изображений на WordPress

Используйте плагины WP Smush, ShortPixel или EWWW Image Optimizer для автоматической оптимизации.
Реализуйте ленивую загрузку (lazy load) для снижения времени первой загрузки.
Настраивайте адаптивные изображения с помощью srcset и используйте правильные размеры.
Добавляйте поддержку современных форматов, таких как WebP, с помощью плагинов или собственного кода.
Используйте CDN для ускорения доставки изображений.

Оптимизация изображений — эффективный способ повысить скорость сайта, улучшить SEO и пользовательский опыт без больших затрат времени и ресурсов. Начинайте с простых решений и постепенно внедряйте более сложные методы.

Оптимизация изображений в WordPress: улучшение скорости и SEO

Почему важно оптимизировать изображения в WordPress

Популярные плагины для оптимизации изображений в WordPress

1. WP Smush

2. ShortPixel Image Optimizer

3. EWWW Image Optimizer