Live data from Hacker News

Using ImageMagick to make sharp web-sized photographs

even.li

31–40 of 64 posts

Re: Using ImageMagick to make sharp web-sized photographs

#32
post #23
post #12

Tangential to the point being made, 98 as quality seems way too high for an image to be shown on the web. 85 seems to be a decent tradeoff. Doing so might actually increase the image size.

I agree: that jumped out at me enough that I came here to make the same comment. I can hardly think of a case where I'd want to use a 98 quality setting on a JPEG. Maybe it would be a good choice if I wanted to preserve an almost-pristine copy of an original, but I'd compare the resulting file size to a lossless PNG first. Every quality step from 100 down to 95 gives a huge benefit in file size, and going from 95 to…

This also jumped out at me. My company (http://www.firebox.com) is built on having amazing looking images for products. No one could see any difference between the quality of images between 87 and 95, but it saved us roughly 50% in file size. Also for what it's worth, we spent a lot of time a/b testing 87 vs 95 with our users, but there was no conclusive difference

Re: Using ImageMagick to make sharp web-sized photographs

#33

mod_pagespeed (and ngx_pagespeed) can automate this for all your images. If you have inline width/height or inline style dimensions, it will do the resampling on your behalf: https://developers.google.com/speed/pagespeed/module/filter-... The advantages of having correctly sized imagery are immense, but in short.. something like 70% smaller total byte payload for mobile, huge reduction in image decode & resize cost,…

I think you missed the point: image the filters should be applied before pictures are distributed rather than letting the browser do it. The reason to resize it and sharpen it is because browsers do a poor job resizing, where doing it yourself will result in a better looking photograph.

This shouldn't be automated by a plugin AT ALL, and should be done based on the type of image it is. (icons, clipart, logos, etc. would make poor subjects).

Re: Using ImageMagick to make sharp web-sized photographs

#34
IMHO, unsharp mask can quickly look aggressive (as in the OPs example, but I expect that is to show the effect). A speedier one-shot solution is to simply use adaptive reduction, which works effectively on all types of image with minimal artifacts. There's a helpful down-sampling guide here: http://bvdwolf.home.xs4all.nl/main/foto/down_sample/example1...

Re: Using ImageMagick to make sharp web-sized photographs

#37
post #32
post #23

Earlier quoted context omitted.

I agree: that jumped out at me enough that I came here to make the same comment. I can hardly think of a case where I'd want to use a 98 quality setting on a JPEG. Maybe it would be a good choice if I wanted to preserve an almost-pristine copy of an original, but I'd compare the resulting file size to a lossless PNG first. Every quality step from 100 down to 95 gives a huge benefit in file size, and going from 95 to…

This also jumped out at me. My company ( http://www.firebox.com ) is built on having amazing looking images for products. No one could see any difference between the quality of images between 87 and 95, but it saved us roughly 50% in file size. Also for what it's worth, we spent a lot of time a/b testing 87 vs 95 with our users, but there was no conclusive difference

You used ImageMagick? The results are impressive.

(Awesome stuff! That looks like a fun company to work for or found.)

Re: Using ImageMagick to make sharp web-sized photographs

#38
post #29
post #17

Earlier quoted context omitted.

This is fine if you have a limited set of images that you handpick and optimize. Do you have any suggestions when there are thousands of images and all this needs to be automated?

He has an example at his github link where he uses a simple bash for loop to do many images at once.

but it does seem inefficient if you often have lots of images to process

Re: Using ImageMagick to make sharp web-sized photographs

#40

ImageOptim has been my best buddy, been getting very agreeable results with it. It's just for compression but end results don't seem to have the need for sharpening. Using ImageMagick this way might be best for special cases... http://imageoptim.com/

ImageOptim is not just for compression, it is for stripping away useless metadata, color palettes and other tricks.

For optimal images, you could do something like this:

1) Resize the image (And apply the trick from this article) use the proper quality marker (anywhere between 85-95)

2) Run it through Imageoptim

If you want a commandline version of ImageOptim, I have had good results with https://github.com/toy/image_optim

Post reply on HN