I want to optimize images for web. I have a tool for resizing images (Photoshop) and a tool for optimizing images (ImageOptim).
What would be the best order that results in a minimal image file size with minimal quality loss?
Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It only takes a minute to sign up.Sign up to join this community
I optimise images for web almost everyday.
Optimisation should always be the last step. Why?
For minimal quality loss don't enable lossy minification in ImageOptim so the image doesn't lose too much quality. Keep the JPEG/PNG/GIF quality slider on 100% so the images don't receive any compression (which would affect quality). Personally I keep JPEG quality to 97%, the quality drop is not noticeable (for my purposes).
Enable Strip PNG metadata and Strip JPEG metadata, that reduces file size and doesn't affect the quality.
Move the Optimisation level slider towards the Insane direction. That will slow down the optimisation process considerably, so you might have to compromise.
My two cents.
I must say that I was a little obsessed with the topic, but not that much anymore.
I do not use "third-party" tools for optimizing file weight, I do not feel it is really necessary because you already have Ps.
Let me spam you with an old test I did several years ago. It is in Spanish, please use google translate for now. https://otake.com.mx/Apuntes/PruebasDeCompresion/
What I want you to see is a way to actually analyze data loss.
Take your original, and paste it on top of the compressed version and choose difference as blending mode.
Those tests are done with ancient versions of Ps and PhotoPaint. And still, I got a decent result compressing at 10% compared to an uncompressed file.
Jpg has several ways to compress files. One is called chroma subsampling. Take a look here. https://en.wikipedia.org/wiki/Chroma_subsampling
The point is that according to my tests Ps uses the best quality one which is 4:4:4.
Some tests should be done to these third-party compression tools, but most likely they are using a 4:2:2 subsampling or even smaller ones. Besides dropping the color profile and some other data, possibly including some copyright metadata you could have.
Some day I will complete and modernize that paper, including a graph compression vs filesize and data loss. (Yes, I am still a little obsessed with the topic)
Make your own test and decide.
There is no such thing as the "best option", only the best option for you.
If you are ok with the file size, and if you actually can see the compression artifacts and you are ok with them, then that is the best option for you.
Make a series of compressed files:
Open an uncompressed image and export it with some settings. Put a proper file name, for example, Test-100Quality.jpg
Repeat with the parameters you want, 90, 80, 70...
Compare them and decide.
a. Resize with different methods and test them. Ps have one that is a good one, Bicubic Sharper.
b. If you want you could add some sharpening.
c. Then save with the compression level you already decided.
The compression needs to actually analyze the specific arrangement of pixels. So it needs to be done after any editing, andy resampling, any sharpening, any adjustment.
If you still want to optimize with a third-party tool, then save the resampled and sharpened image with a "maximum quality" setting in the program that you use for resampling and then let the other app decide.