sergius-lg
@sergius-lg

Некорректное сжатие одной миниатюры при загрузке изображения. Как быть?

Натягиваю верстку мини-магазина на Wordpress + Woocommerce. Все картинки сжимал gulp-imagemin при сборке верстки. Все идеально. Wordpress требует только одно изображение (оригинальное), с которого генерирует миниатюры согласно настройкам в functions.php

Настройки изображения:

Большое изображение для страницы товара: 1080 х 1340 px (без обрезки)
Изображение товара для каталога: 700 x 869 px (без обрезки)
Миниатюра для галереи : 320 х 397 px (без обрезки)
Миниатюра для мини-корзины: 130 x 161 px (без обрезки)

Все изображения в 2x размере от номинала, для ретины. Правильный ли это путь, это уже другой вопрос.

В Wordpress я загружаю уже оптимизированное изображение 1080 х 1340 px (больше для макета я не делал), например image.jpg. На выходе в папке uploads я получаю:

image.jpg - 79.4K (1080 х 1340 px) - оригинал

image-1080х1340.jpg не был создан, видимо, потом что оригинал , такого же размера
image-720х869.jpg - 159K (720 х 869 px)
image-320х397.jpg - 34K (320 х 397 px)
image-130х161.jpg - 9K (130 х 161 px)

Для оптимизации стоит плагин Smush, до него был Imsanity.

Вопрос:
1. Файл image-720х869.jpg, который в 1,5 раза меньше, чем оригинал - весит в 2 раза больше (чем оригинал). Что я мог сделать не так?

2. Сталкивался кто-нибудь с плагинами, которые позволяют вручную заливать уже оптимизированные изображения для каждой миниатюры?

3. Может я зря парюсь? Но как бы 159К это размер фона на весь экран, а тут каталог (карточка товара).
  • Вопрос задан
  • 59 просмотров
Решения вопроса 1
sergius-lg
@sergius-lg Автор вопроса
Проблема решена, мой косяк.

При верстке и сборке gulp'ом изображение сжимал image-min. Я его не настраивал, он работал из "коробки" и давал превосходный результат, как по качеству, так и по сжатию.

Перепробовал все, что можно, решил проверить степень сжатия изображения.

Оригинальное изображение 1080 х 1340 (после gulp.image-min) - степень сжатия 75%

Все сгенерированные WordPress' ом миниатюры были со степенью сжатия - 100% (без сжатия).

В шаблоне php-файлов для WP был раскомментирован код, отменяющий сжатия изображений.

add_filter( 'jpeg_quality', 'cody_remove_image_compression' );
function cody_remove_image_compression( $quality ) {
return 100;
}

А внешний плагин, настроен не был. И поскольку WP имеет свои алгоритмы сжатия, то на выходе мы получаем новый размер с не оптимизированным кодом.

Эхх, все проблемы в мелочах!! ))) По факту проверяйте информацию о изображении, которое подсовывайте в WordPress. В идеале, оно должно быть без сжатия. Или грамотно настройте сам WP и плагин на компрессию, что бы нивелировать размер и качество относительно оригинала.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы