I’m running a WordPress site with WordPress version 3.4 (hence using the now deprecated “image_resize” functionality) and I’ve found that the image resizing abilities of WordPress are extremely lacking in regards to quality. There doesn’t seem to be anything online regarding this issue (correct me if I’m wrong).
The images that my client uploads can be quite big, so I wanted to use the image resizing functionality with a cache technique such that images that need to be smaller won’t take quite as long to download by the visitors. But when I use image resize I’m finding that the quality is significantly reduced, even with the $jpeg_quality argument set to 100.
Here is an example of the quality difference:
Aside from the blurriness that StackOverflow may add due to its handling of the image, the major difference is in the colour vibrancy. The image on the left is the original uploaded image to the WordPress site which has a native width of about 800 pixels. It has been resized manually within the HTML to 200 pixels wide. The image to the right is the image having been resized by WordPress’s resizing method to 200 pixels at 100 percent jpeg quality, using the following code:
image_resize( "/path/to/image", 200, 0, false, null, null, 100 );
Can anyone explain why this is looking so bad, and what I can do to solve it?
Based on our discussions so far, I’d say you’re experiencing a similar effect to that noted in this earlier question, though I don’t know if your WordPress 3.4 installation will be using GD underneath.
Basically, what’s happening is that your images have an embedded Adobe RGB colour profile, which is (arguably, I suppose) a perfectly reasonable thing for them to have, even if they’re headed out onto the web. You may want to bear in mind that if the images are viewed in a browser that doesn’t respect that kind of colour management, you may see some surprising results, and that generally it seems the advice would still be to prefer sRGB for the web.
I’m guessing that the resizing process used by your WordPress 3.4 installation isn’t respecting the colour profile — is, in fact, probably ignoring it — which is why the colours are being mangled during the resize. Effectively it’s outputting an image that should still be in Adobe RGB space, but dropping the colour profile, so the image is reinterpreted in sRGB, which is what’s making things look muted.
There are two options, I’d say:
Look into some kind of resizing process that respects the colour profile of the images (as discussed in that earlier question, upgrading the GD library, if that’s what’s being used, or switching to an ImageMagick-based solution, say.) I’ve not tried it, but if you can install ImageMagick on your sever, it looks like this WordPress plugin will allow you to use it for the image resizing fairly painlessly. It specifically mentions respecting colour profiles on resize.
See if exporting your images in the sRGB colour space solves the resizing problem. That’s probably the easiest solution, and is likely to work if what I think is going on is what’s actually going on. Though the images are likely to end up without an embedded colour profile once they’ve gone through your resizer, virtually everything that sees them will assume they’re sRGB anyway.