Потеря качества картинок при Адаптивной верстке, как победить?

Question

[Вадим Ремин]

Добрый день

Делаю сайт на WP. Адаптивная тема.
Возникала проблема некачественных картинок в каталоге товаров:
rosdes.ru/shop. Картинки размыты.
Для сравнения привожу картинку и вырезанную со скриншота сайта:

Тоже самое, только увеличенное:


Очевидно, что потеря качества возникает, когда браузер пытается уменьшить картинку, хотя делать ему это совсем не нужно. Ведь картинка уже имеет разрешение 182х200. И в каталоге она тоже показывается как 182х200. Только качество теряется.
Что делать с версткой?

Answer 1

[Евгений]

Мне помогла всего одна строчка:

add_filter( 'jpeg_quality', create_function( '', 'return 100;' ) );

В function.php темы.

Comments

[Вадим Ремин]

Да, у меня тоже работает, и если сделать правый клик по картинке и выбрать "Открыть картинку в новой вкладке" - открывается картинка того же разрешения, что и в каталоге, но в хорошем качестве. То есть ресайз картинок отрабатывает хорошо. Но потом, когда картинки обрабатывается движком браузера в каталоге товаров - качество теряется, хотя размер картинки остается таким же. Можете сами попробовать rosdes.ru/shop дверь "Валенсия, миланский орех". В каталоге - плохое качество, а открываешь в отдельном окне - хорошее. А размер картинки и там и там - один. Так что подозреваю проблема в верстке, но не ясно как решить.

[Евгений]

Дмитрий Кудрин: У вас привязка к % у меня 396х435
И раньше, когда не использовал код выше, выкручивался достаточно не обычным методом (возможно заплюют).
Заливал все картинки в WP (что-бы в медиафайлах отображались) после чего копировал на комп, и заменял все урезанные на свои уже оптимизированные и отправлял обратно на сервак.
С магазинами не работал, у меня до 100 картинок было, по этому другие способы и не искал.
Просто WP все-равно после обрезки их не обрабатывает, а нормального плагина не нашел :( Вот до сих пор иногда вручную обрабатываю.

[Вадим Ремин]

Евгений: Про проценты - согласен, сейчас покопаю в эту сторону. Метод замены уменьшенных изображений вручную действительно после строчки add_filter уже получается как бы не нужен. Качество действительно нормальное получается сразу после обработки WP. Но спасибо за совет)

Answer 2

[Вадим Ремин]

Подозреваю, что виноваты настроки функции ресайза картинок самого WP. Вот кое-что нашел. Оказывается WP сжимает с качеством 90%.
https://thomasgriffin.io/how-to-change-the-quality...

Только не пойму куда указанный автором статьи код вставлять? В function.php темы или?

Comments

[Вадим Ремин]

Вставил в function.php, сделал Regenerate Thumbnails, эффекта ноль.