Firefox 3.5 came out recently, and along with a number of much anticipated improvements, the web design community was given the gift of PNG color profile support. I'm not an expert on the subject, but in my experience, PNG images have always been picky about the color profiles you select when working in Photoshop. Until now, Safari was the only browser that would correctly display the images - though it has been more of a headache than a feature, since there doesn't seem to be a "correct" color profile to use in Photoshop that would enable identical rendering across all browsers.

Now that Firefox 3.5 renders PNG images similarly to Safari, it is much more important that we produce PNG images that render correctly in these two popular browsers. I spent a few minutes taking a look at which images were being distorted, and the pattern is very clear. Any PNGs that I had run through a "crushing" (see below) utility rendered accurately, and had a noticeably smaller file size - any PNGs I had not "crushed" looked different in these browsers.

So the solution is simple. When you use a PNG compression utility, you are removing the color profile data that is causing Firefox and Safari to render the images differently from how you saw them in Photoshop.

Since we all love free web apps, I give you miniPNG:



Here are some screen captures of miniPNG in action. Can you find the secret?



The secret is that this is already a native amoebaOS app.