Оптимизация изображений: конвертация JPEG в WebP с помощью скрипта

Что такое WebP и зачем он нужен?

WebP — это современный формат изображений, разработанный Google, который обеспечивает высокую степень сжатия без значительной потери качества.
Использование WebP позволяет уменьшить размер файлов до 30%–50% по сравнению с JPEG и PNG, что ускоряет загрузку страниц,
особенно на мобильных устройствах, и улучшает пользовательский опыт.

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

Основные преимущества WebP:

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

Плагины для работы с WebP в WordPress

Если вы используете WordPress, конвертация изображений в WebP может быть реализована с помощью плагинов. Вот несколько популярных решений:

• WebP Converter for Media: автоматическое создание WebP-копий изображений и их подмена при загрузке сайта.
• ShortPixel Image Optimizer: мощный инструмент для оптимизации изображений, который поддерживает WebP и работает с большими библиотеками.
• Imagify: позволяет оптимизировать изображения, включая преобразование в WebP, с простым интерфейсом и гибкими настройками.

Сегодня мы хотим поговорить, о ситуации, когда вы можете это сделать автоматически, не используя платных плагинов. То есть бесплатно. И в этой статье вы узнаете, как с помощью простого скрипта автоматически конвертировать изображения в формат WebP и настроить ваш веб-сервер (Nginx или Apache) для автоматической подмены JPG на WebP.

Описание скрипта conv_jpg_to_webp.sh

Скрипт conv_jpg_to_webp.sh предназначен для автоматической конверсии изображений форматов
JPEG и JPG в современный формат WebP. Это особенно полезно для владельцев сайтов,
так как WebP обеспечивает лучшее сжатие изображений при сохранении высокого качества.
В результате уменьшается размер файлов, ускоряется загрузка сайта, а поисковые системы,
такие как Google, учитывают это в рейтинге производительности.

Как работает скрипт?

Скрипт выполняет поиск всех файлов с расширением .jpg или .jpeg
в текущей директории и ее поддиректориях. Затем каждый найденный файл преобразуется в WebP
с качеством 80%, после чего оригинальный файл удаляется. Если конвертация завершилась с ошибкой,
исходный файл остается неизменным.

Как пользоваться скриптом?

1. Создайте резервную копию: перед запуском скрипта обязательно сделайте
   резервную копию всех файлов, так как оригинальные изображения будут удалены после конвертации.
2. Убедитесь, что установлен инструмент cwebp:
   это утилита командной строки для преобразования в WebP. Установить ее можно с помощью
   пакетного менеджера вашей системы, например:
   sudo apt install webp для Ubuntu/Debian.
3. Сохраните скрипт: создайте файл conv_jpg_to_webp.sh
   и вставьте в него следующий код:

   
   #!/bin/sh
   
   # Находим все файлы с расширениями .jpg и .jpeg
   find . -type f \( -iname "*.jpg" -o -iname "*.jpeg" \) | while IFS= read -r i; do
       # Определяем имя выходного файла
       output="${i%.*}.webp"
       
       # Конвертируем файл в формат WebP
       cwebp -q 80 "$i" -o "$output"
       
       # Проверяем, успешно ли прошла конвертация
       if [ $? -eq 0 ]; then
           # Удаляем оригинальный файл
           rm "$i"
       else
           echo "Ошибка при конвертации файла $i"
       fi
   done
               

4. Запустите скрипт: сделайте файл исполняемым и выполните его в нужной директории:

   
   chmod +x conv_jpg_to_webp.sh
   ./conv_jpg_to_webp.sh
               

Предупреждение

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

Настройки Nginx для автоматической замены JPG на WebP

Для того чтобы сервер автоматически подменял запросы к файлам JPG на WebP, нужно внести изменения в конфигурацию Nginx:

server {
    listen 80;
    server_name example.com;

    root /path/to/your/site;

    location ~* \.(jpg|jpeg)$ {
        add_header Vary Accept;
        if ($http_accept ~* "image/webp") {
            rewrite ^(.*)\.(jpg|jpeg)$ $1.webp break;
        }
    }

    location ~* \.webp$ {
        try_files $uri =404;
    }
}
    

Настройки Apache для автоматической замены JPG на WebP

Для Apache можно использовать файл .htaccess с таким содержимым:

    RewriteEngine On
    RewriteCond %{HTTP_ACCEPT} image/webp
    RewriteCond %{REQUEST_FILENAME}.webp -f
    RewriteRule ^(.*)\.(jpg|jpeg)$ $1.webp [T=image/webp,E=accept:1,L]

    

Убедитесь, что модуль mod_rewrite включен в Apache.

Заключение

Скрипт conv_jpg_to_webp.sh — это удобный инструмент для конверсии изображений в формат WebP,
который помогает улучшить скорость загрузки сайта и его SEO. Однако будьте внимательны при его использовании,
обязательно создавайте резервные копии файлов. Кроме того, настройка веб-сервера для автоматической подмены
JPG на WebP обеспечит еще большую совместимость и удобство для пользователей.