Как оптимизировать изображения по PageSpeed Insights?

Question

[Влад]

Уважаемые!
Подскажите, пожалуйста, о чём идёт речь в https://developers.google.com/speed/pagespeed/insi...

Если сжать без потерь изображение http://multmult.ru/…osts/2015-01/1422272240_1364397157_3.jpg, это уменьшит его размер на 17,4 КБ (80 %).

Размер картинки в пикселях сделан максимально маленьким. Так о каком оптимизации без потерь идёт речь? Есть какойто фильтр, который общепринято считать, что сжимает картинки без потери качества?

Answer 1

[Сергей Горячев]

Не надо изобретать велосипед.
Гугл Инсайд после каждого анализа дает скачать архив.
В нем найдете оптимизированную картинку.
Также там стили и скрипты.
Всё заливать не надо. Только нужное.

Comments

[Влад]

у меня на сайте 5000 страниц. мне нужен инструмент для массовой правки изображений

[Роман Ланкин]

Кроме того:
Оптимизацию через google pagespeed не рекомендую, поскольку если вы используете изображения x2 для ретины, а в коде указаны размеры в 2 раза меньше, гугл сделает ресайз и отдаст другой размер изображений.

Answer 2

[Павел Гоголинский]

После панды google page speed не ругается
https://tinypng.com/

Comments

[Влад]

ругается. google оптимизировал изображение до 5 kb, а tinypng до 9

Answer 3

[Дмитрий]

Может это поможет

Comments

[Влад]

нет, мне нужен инструмент, который позволит массово оптимизировать ВСЕ изображения у меня на фтп.

[Дмитрий]

пользуюсь этим инструментом https://tinypng.com/

Answer 4

[brashik]

Все что написано выше на текущий момент не актуально ! Гугл уже хочет чтобы мы меняли формат изображения, вот что пишет...

Используйте современные форматы изображений
Для изображений в форматах JPEG 2000, JPEG XR и WebP используется более эффективное сжатие, поэтому они загружаются быстрее и потребляют меньше трафика, чем изображения PNG и JPEG.

и кстати скачать файлы уже не позволяет...

Answer 5

[Serj-One]

https://tinypng.com/
https://kraken.io/web-interface
https://www.npmjs.com/package/gulp-imagemin

Answer 6

[kn1ght_t]

gulp + gulp -imagemin

Comments

[Валерий Суворов]

А это ещё тут при чём? )

[kn1ght_t]

Валерий Путин: при том, что это сжимает картинки, и гугл радуется

[Валерий Суворов]

kn1ght_t: спасибо! Но я, как начинающий, так и не понял, как этим пользоваться. (((

[kn1ght_t]

Валерий Путин:
как-то так (только надо установить пакет gulp-imagemin сначала):

var gulp = require("gulp"),
imagemin = require('gulp-imagemin');

gulp.task('images', function () {
return gulp.src('./app/img/*')
.pipe(watch('./app/img/*'))
.pipe(imagemin())
.pipe(gulp.dest('./build/img/'));
});