Often times when I’m teaching clients how to best utilize their websites they’re confused by the various types of images they can save and upload to their site. Anyone who has ever been taught by me knows I’m a huge advocate of the PNG 🙂 Not so much a fan of the JPG and here’s why… When you design web graphics you want them to appear as clearly as possible and you want the colors to remain intact. A JPG is fine for a photograph, but when you start adding colors and text to that photograph things get a bit fuzzy. Literally. There are, of course, quite a few other file types out there but these are the two main types bloggers and website owners will use. Here’s an example of what a graphic I created looks like when saved as both types, side by side for you to see the difference.
The JPG below has been saved at the maximum quality allowed of a JPG in Photoshop.
Here’s the same side by side comparison saved at medium JPG quality. As some image editing software doesn’t allow for you to choose what quality, this is most commonly seen on the web.
Perhaps one of the most obvious examples of PNG vs JPG is when you see text on a photograph. Notice the clarity of the text on the PNG and the blur on the JPG text, as well as the pixelation of the sky in the images below.
The clarity in your graphics is what can set you apart from other websites. Some may argue that JPG files load faster, and they do, but when using graphics like above I’d say the extra few seconds are well worth the wait.
For details on each file type and more, visit this link: http://en.wikipedia.org/wiki/Image_file_formats