Google Pagespeed недвусмысленно намекает нам на то, что пора бы заняться оптимизацией скорости загрузки страниц сайта. В первую очередь, нужно позаботиться о том, чтобы изображения были хорошо сжаты. И если вы используете в своей работе CMS WordPress, то можете использовать для этого замечательный плагин, который сделает всё на автомате, нужно лишь раз настроить его — EWWW Image Optimizer — отличная бесплатная альтернатива WP Smush, TinyPNG / TinyJPG, Resize Image After Upload и другим плагинам сжатия изображений.
- Обзор плагина EWWW Image Optimizer
- Насколько хорошо плагин сжимает изображения
- Установка EWWW Image Optimizer
- Где скачать EWWW Image Optimizer
- Настройка EWWW Image Optimizer
- Почему EWWW Image Optimizer не работает
- EWWW Image Optimizer requires exec()
- Отсутствует: jpegtran, optipng, gifsicle, pngout
- В заключение
Обзор плагина EWWW Image Optimizer
Сжатие происходит при помощи jpegtran, TinyJPG, JPEGmini, optipng, pngout, pngquant, TinyPNG и gifsicle. Этого набора утилит хватит за глаза, чтобы качественно сжать ваши PNG и JPG изображения без потери качества, а gifsicle, входящий в состав EWWW Image Optimizer, даже сможет позаботиться о gif анимациях.
По умолчанию, плагин настроен на сжатие изображений без потерь, поэтому не бойтесь неожиданного появления артефактов на картинках, их не будет. Разве что информация EXIF и прочие комментарии могут быть потёрты, что может быть важным для фотографий, но этот момент настраивается в опциях.
Сам автор перечисляет преимущества своего детища
- Ваши страницы будут загружаться быстрее. Отсюда меньше отказов и более лояльное отношение поисковых систем
- Бекапы сайта создаются быстрее. Это означает меньшую нагрузку на хостинг, а на дешёвых хостингах этот момент немаловажен
- Ускоряется работа с сайтом. Вам не придётся ждать, пока изображения пережмутся, можно настроить так, что всё будет происходить на лету либо позже
- Оптимизация всех изображений сайта. Плагин имеет возможность сканировать систему и находить неоптимизированные изображения, включая элементы дизайна, и исправлять этот недочёт
Насколько хорошо плагин сжимает изображения
Берём любое изображение и добавляем его в Медиафайлы

win.png
Загрузка длится немного дольше обычного, так как утилиты сжимают изображение.
На выходе получается

Тестируем EWWW Image Optimizer
У меня из маленького PNG файла в оригинале 236 Кб вышло 219 Кб. Таким образом, получилось сжать 7,2%. Представляете, что будет с большими файлами?
Установка EWWW Image Optimizer
Установить плагин можно двумя способами, через админ-панель WordPress или скачать архив с плагином отдельно.
В первом случае, вы переходите в раздел админки Плагины
— Добавить новый
(http://example.com/wp-admin/plugin-install.php
) — EWWW Image Optimizer
Во втором случае, вам нужно скачать его.
Где скачать EWWW Image Optimizer
Скачать плагин EWWW Image Optimizer из официального репозитория WordPress.org
Архив распаковываем в /wp-content/plugins/
, потом находим его среди плагинов в админке и активируем.

Активация EWWW Image Optimizer
Настройка EWWW Image Optimizer
Чтобы попасть в настройки, переходим в Настройки
— EWWW Image Optimizer
Вы можете ничего не менять, по умолчанию всё работает как надо.

Основные настройки EWWW Image Optimizer
На скрине всё видно и достаточно ясно описано, что за что отвечает. Вы можете изменить настройки под свои нужды.
Если вы развернёте вкладку Статус плагина
, то увидите, что установлено в системе, и чего не хватает для нормального функционирования, а также статистику проделанной работы. Список возможных проблем в Статусе плагина и их решений смотрите ниже в специальном разделе.

Параметры установки необходимых утилит
Вот как выглядит вкладка Дополнительные
. Здесь, пожалуй, прокомментирую непереведённую часть

Содержимое вкладки Дополнительные
- Deferred Optimization — сжатие будет происходить позже, по расписанию WP Cron
- Disable Automatic Optimization — Изображения не будут оптимизированы в момент их загрузки на сайт. Их оптимизацию можно провести позже вручную либо настроить расписание оптимизации. Опция будет полезна, если вы загружаете много изображений и не хотите ждать, пока они будут сжиматься
- Include Media Library Folders — Если вы отключили автоматическую оптимизацию изображений, отметьте этот пункт для включения сжатия по расписанию для последних двух директорий из библиотеки медиафайлов

Продолжение содержимого вкладки Дополнительные
Сверху также есть ссылка на Медиафайлы
— Оптимизировать
В этом разделе вы можете сжать старые неоптимизированные изображения. Пригодится в том случае, если у вас старый сайт, и вы хотите привести его в порядок.

Сжатие неоптимизированных изображений
Почему EWWW Image Optimizer не работает
EWWW Image Optimizer — довольно требовательный к установленным утилитам плагин, без которых он не сможет работать, поэтому вполне вероятно, что вам придётся столкнуться с одной из нижеперечисленных проблем. Если вы не найдёте решения ниже, пишите в комментариях, будем разбираться.
EWWW Image Optimizer requires exec()
После установки плагин может дать предупреждение

EWWW Image Optimizer requires exec() or an API key. Your system administrator has disabled the exec() function, ask them to enable it.
Это значит, что у вас на хостинге отключено исполнение exec. Делается это, как правило, для безопасности, но порой эта забота о нас выливается в подобные проблемы.
Если у вас простой хостинг, напишите в службу поддержки с просьбой включить
exec
. Если они ответят отказом, к сожалению, бесплатной версией плагина вам воспользоваться не получится. В таком случае, вы можете выкачать все изображения и пережать их с помощью File Optimizer. Также, есть возможность воспользоваться плагином WP Smush — Image Optimization, но у него есть ограничение: в бесплатной версии можно сжимать максимум 50 файлов за один подход
Если у вас свой сервер, тогда отправляемся в настройки php, а именно в php.ini
.
Чтобы определить, где находится php.ini, можно воспользоваться функцией phpinfo(). Создаём файл phpinfo.php
в корне сайта, потом записываем туда
<?= phpinfo();?>
Сохраняем, потом открываем в браузере http://example.com/phpinfo.php
Ищем строчку Loaded Configuration File

Где расположен php.ini
Итак, у нас php.ini расположен в /etc/php5/apache2/php.ini
Редактируем его, для чего можно воспользоваться Far Manager или putty.
В самом файле ищем строку disable_functions
. Это список отключенных функций php. Изымаем оттуда exec
, и потом сохраняем.
Я, как правило, копирую оригинальную строку, затем закрываю её в комментарии, тем самым сохраняя резервную копию на всякий случай.

Включаем exec
Теперь, чтобы изменения вступили в силу, нужно перезагрузить php (Apache или php-fpm).
service apache2 restart
или
service php5-fpm restart
Всё, теперь функция exec
работает.
Отсутствует: jpegtran, optipng, gifsicle, pngout

EWWW Image Optimizer использует jpegtran, optipng, pngout, pngquant, gifsicle и cwebp. Отсутствует: jpegtran, optipng, gifsicle, pngout. Установите отсутствующие через Настройки или Инструкции по установке.
В этом случае, Вам придётся либо написать в службу поддержки, чтобы они помогли с установкой требуемых утилит, либо, при возможности, установить их вручную.
Нижеследующие команды прописываются в консоли SSH
Установка jpegtran
в Debian, Ubuntu
apt-get install libjpeg-progs
Установка optipng
в Debian, Ubuntu
apt-get install optipng
Установка gifsicle
в Debian, Ubuntu
apt-get install gifsicle
Если команды не сработали, попробуйте обновить порты. Например, в Debian это делается командой
apt-get update && apt-get upgrade
В заключение
Это был обзор плагина для оптимизации и сжатия png, jpeg, gif анимаций в WordPress. Если вам интересно, есть статья, как можно подготовить изображения заранее
Свежие комментарии