R. Craig Collins >
Intro to Computer Graphics >
jpeg-png
R. Craig Collins >
Intro to Computer Graphics >
jpeg-png
jpeg-png © R. Craig Collins, 2008
In earlier discussions, TIFF and gif were covered. TIFF can be a good choice for saving original images that will later be edited, but there are so many variations and non-standard features of TIFF that many users have been looking for full color alternatives, especially one that can work with web browsers. The gif format can provide animation and transparency, and is supported by web browsers, but it is limited to 256 colors, so again, many users have been looking for an alternative.
Aside from gif, the only file formats that can be used by standard web browsers are jpeg and png. Not only are both jpeg and png are full color formats, both have standard feature sets... meaning most graphics editing software can be used.
The older of the two formats is jpeg, also known as jpg. The format derives its name from the Joint Photographic Experts Group, so the format is obviously well suited to photos, where as gif certainly is not. The downside for jpeg is that it does not support transparency or animation, and that to reduce file size it looses some information when being saved; this can make it harder to re-edit later. Many people will take a TIFF, edit it, then save the result as a jpeg for use on the web, keeping the TIFF in case they want to make changes in the future.
The newer of the two formats is png, which was designed from the very beginning to be an alternative to gif. Probably the biggest driving force was that the gif format at the time was legally protected, and vendors had to pay fees for its use in software they were selling. As with many open source ideas, or software that can be freely distributed without vendors (or users) having to pay money, the actual derivation of the name is subject to debate. Some say it was originally stood for Png, Not Gif, but these days the moniker is Portable Network Graphics.
The png format will not replace either gif or jpeg, though it can be an alternative. The png files, like TIFF, retain all information, meaning the files remain in great shape even after editing, but the resulting file will be larger than a similar jpeg. Larger files are not popular on the Internet as they waste storage space and take longer to download, meaning jpeg will probably remain the favorite option for the time being.
Speaking of file size, when compared to gif, a png will be smaller, normally, than a similar gif. The png format not only supports transparency, but it also provides a unique translucent feature. The one thing the png lacks when compared to gif is a standard method of animation, meaning again gif will probably remain a favorite option.
So, how does one decide on which format to use? It might be a good idea to save your original files as a png file. Like TIFF, it will serve as platform that retains information, but can be used by almost any editing program. Again there should be no loss if you open your camera or scanner's full color, high quality image, and save it as a png. After editing, if the image is to be used on the web, save the new file as both a png and a jpeg; place the smaller of the two files on your web site, as that is the file that will download the fastest.
If the image lends itself to the gif realm of simple line graphics, or you want to use transparency, after editing save the new file as both a png and a gif; place the smaller of the two files on your web site, as that is the file that will download the fastest.
This discussion keeps mentioning the "editing" of files... the bulk of the the next discussions will cover exactly what a good graphics program should be able to do with images. By and large, our output will have two paths... high quality for printing (png), or smaller file size for use on the web (jpeg). There is not difference in the editing, the only difference is what file format we save it as.
Subsequent discussions will not only focus on getting the smallest file for the web, but also balancing file size with the quality of the file... this is called optimization.