: Google Pagespeed: How to satisfy the new image compression rules? We have several pages with good Pageseed-values - even those with 100/100. Since a few days however, Pagespeed claims across all

@Lee4591628

You may also notice the message: "Download optimized image, JavaScript, and CSS resources for this page." They've done the work for you if you're having trouble getting the optimization Google is expecting. Sometimes various tools can't get down as small as Google wants.

Vote Up Vote Down

@Nimeshi995

I see the same unsightly results for pages without any problem before,
of course using responsive frameworks like ZURB Foundation with responsive images.

In the past I used:

find . -iname "*.jpg" -exec jpegoptim --strip-all -o -p {} ;


and got great results.

Jan 2017 solution: 85% quality should do the trick:

find . -iname "*.jpg" -exec jpegoptim --strip-all -m85 -o -p {} ;


Back to 100/100 on google page speed.

Here is a part of my gulp/npm deploy method for ZURB Foundation 6

// Copy images to the "dist" folder
// In production, the images are compressed
function images() {
return gulp.src('src/assets/img/**/*')
.pipe($.if(PRODUCTION, imagemin(
[
imagemin.gifsicle({interlaced: true}),
imageminJpegoptim({
max: 85,
progressive: true
}),
imagemin.optipng({optimizationLevel: 5}),
imagemin.svgo({plugins: [{cleanupIDs: false, removeEmptyAttrs: false, removeViewBox: false}]})
],
{
},
{
verbose: true
}
)))
.pipe(gulp.dest(PATHS.dist + '/assets/img'));
}


You need to add the npm modules gulp-imagemin imagemin-jpegoptim

var imagemin = require('gulp-imagemin');
const imageminJpegoptim = require('imagemin-jpegoptim');

Vote Up Vote Down