Introducing “CNB ImageGuide”
ImageGuide is a program which helps you choose a format (PNG or JPG) in which to save an image file for the web.
Web images are usually saved in either .JPG or .PNG format, but unfortunately most people have no idea which is best for their picture.
Top: Photos should be saved as JPG. Bottom: Simple images should be saved as PNG. Both: Notice the lost detail and corruption when the wrong format is used.
The very simplest rule of thumb is:
- If it’s a photograph, use .JPG
- Otherwise use .PNG
Graphs, charts, and screenshots are often (incorrectly) saved as .JPG even though as PNG they would look better and be smaller. An extreme example is this image of every color. Saved as .PNG, it’s only 58KB. As .JPG, it is 1.1MB — 19 times larger and even at that size it looks blocky compared to the PNG version.
Unfortunately, even many supposedly technical websites have authors which seem to lack this knowledge.
In order to help people make the most of their pictures and bandwidth, I’ve written ImageGuide — a program which aims to make it absolutely as easy as possible to pick the best image format, or even choose for you. You can download it exclusively on ForMortals.com.
This is a “beta” release, so leave any bug reports, feature requests, or questions as comments to this blog post. If there is a lot of interest, I may improve the software, release it with an installer, or even release the source code.
ImageGuide has some limitations. For example, no PNG24 or transparency support, so the “all 16 million colors” image linked above would not be suited for use with this program, as it would try to save it with far fewer colors than necessary. For most images though, CNB ImageGuide can show you which format looks best, and can usually pick the right format for you.
CNB ImageGuide showing an image. Left: The original image. Center: The image, converted to JPG. Right: The image converted to PNG. Notice that, in this case, JPG shows better picture detail.
Note that, in order to emphasize the strengths and weaknesses of each format, PNG images are processed with limited colors. This is intentional. This demonstrates that graphs and charts (which look fine with limited colors) should be saved in .PNG format, while photographs (which look poor with limited colors) should be saved in .JPG format. The idea is to show that, given an image, which format will look good with the smallest file size. If file size is not a concern, then of course .PNG 24-bit should always be used because it will perfectly represent the original photo. For images displayed online, however, file size is always an issue.
Feel free to share ImageGuide with others who might find it useful, and check back here every so often for updated versions, at least until “1.0″ is released. Let me know how it works for you and if it helps answer the age-old question: To PNG, or not to PNG?
ImageGuide may be downloaded here. This preview release is for Windows only. Later releases will include the Linux and Mac platforms.