When optimizing your site for the best performance the file weight of images can be crucial in creating a better web experience. From the perspective of being a designer you don’t want to see your beautiful photography or graphics turn to crap because it has been compressed to hell and back, in order to create a better web experience.
With the importance of showing sharp images on retina displays, you don’t really have the option to over compress your images anymore. Because you do not have the luxury of only hiding behind a 72 or 96dpi monitor. Having to accommodate for retina displays makes image quality probably more important than it has ever had to be online.JPEGmini has been a great service that helps to compress a photo’s file weight with out sacrificing much quality. I have even found that it has decent success in compressing photos further even after using Photoshop’s save for web feature. This tool is a great asset especially if you are saving images in a “2x workflow” for your retina displays.
Let’s take this 2x photo I have:
In this photo I used the ‘Retenize-it’ Photoshop Action to get a 2x size. Then I used Photoshops ‘Save For Web Feature’ to get this image compressed to 216kb. Sure this could have been compressed some more in Photoshop, but for the sake of demo purposes this is what we are working with.
Here is the 2x photo after dropping it into JPEGmini:
My image is now 166kb, which is a much more manageable file weight for a photo this size (2000px x 512px). As I said earlier, I could have compressed this more in Photoshop. That approach is fine for when you have a handful of images that you are concerned with. But, this comes in handy when you have a lot more photography to work with. Because you don’t have to play that game in Photoshop of trying to find that sweet spot of quality and compression per image. You can now export out your images at a higher quality 2x process and then drop them all into JPEGmini and let it run the compression all at once.
Of course this isn’t a magic bullet and you are going to run into cases where you need to compress an image further, or the quality might not be at the level that you are looking for. But, then you can figure that out on a case-by-case basis when you are running QA on a project. This will work for the majority of the photos in your project and can help you get them optimized for the web much more efficiently.
What’s awesome about this software is that it has a free version and multiple other pro versions. I have used the free version and the $20 version and have had good success with both. I highly recommend this product if you find yourself in the world of having to compress a lot of photos for the web.