The PNG File

What is a .png file … and what can I do with it? Ah, well that’s a question that quite a few people wonder. A PNG file is a graphic file format that has similarities to both the popular .jpg format and the older .gif format. It can be the same as a .jpg and you can use the same way as you use a .jpg file. It has has the ability to save a file with transparency, like the .gif file, but PNG (or .png) handles photographs very well and allows a wider colour gamut than .gif does. That’s the basic and simple explanation, but if you want to know more about the .png format you can find the technical stuff here.

Tree branch with berries in photoshop.I don’t save straight forward photographs as .png files, because for web use, the .jpg is perfectly fine. But, if you do collages or image compilations (creating one image using many elements from others) then the PNG file can be very useful if saved on a transparent background. Here’s one example. We’ve got this picture of a tree branch with leaves and green berries on it, but we want to add something to it. Like maybe a garden snail – a giant snail.

In photoshop we open the image of the branch as our background. Now we open the snail picture which is a .png file, saved with a transparent background.

Snail as a png image file on transparent background.With the snail as your active image choose “select all” from your menu. Then choose “edit”, then “copy”. Now minimize the snail picture and click on the background image (in our case the branches). Now select “edit” again, and then “paste”. This will paste the snail onto a new layer in your background. Once it’s there you’ll see it’s just the snail – no backgrounds to remove. Move the snail around until it’s in a spot you like, or make it smaller if you want a more realistic representation. Once you’re satisfied with it’s placement, flatten your image and it’s ready to go.

Snail added to branch in photoshop.No fiddling, no erasing or isolating necessary.

The .png file format using transparency is particularly useful for saving things like photo frames. The transparency then makes it easy to place this frame over any photo, the same way as we inserted the snail above. But where does the .png come from? There are a few places on the internet where you can find free files in the .png format with transparency, but not too many.  There are several pages on our own site where you can download .png files on transparent backgrounds. Right now, it doesn’t seem to be a popular file format, but in my books, it should be much more popular than it is. Large numbers of people use the photoshop native file format (.psd) for saving isolated objects with transparency, and while this is an excellent thing to do if you are using your own saved files, not all versions of photoshop may be able to use .psd files from newer versions, and of course, not everyone uses photoshop.

Small spotted deer isolated on transparent background.

There are other graphic and photo editing programs out there that support layers and transparency, but may not support the .psd format. However, many of these other programs will be able to use the .png files, making them useful for a wider range of people. PNG files can also be used in some 3D-modelling programs, while they can’t use the photoshop files.

Because of that, some of my files that are isolated objects or individual elements are saved in both the .psd format (for my own use) and the .png format for others to use. The PNG format is not as large in terms of file size (the image size can be the same in both a .psd file or a .png file, but the .png file size will be smaller), making it easier to upload and host on a web server, and faster to download for those using them.

You can make your own .png files if you know how to isolate something from a photograph or graphic (see the tutorials on how to do that). Open the file you want that has an object you want to isolate. Using the pen tool, create a new path, isolate the object, load the path as a selection and copy it to a new layer. Delete the background and you’ll see the object on a new layer with a transparent background. Save this file as a .png and you’re ready to roll anytime you need this object in another image it’s ready to go.

All in all, this is a relatively versatile file format which is currently under used.

Share on FacebookShare on Google+Tweet about this on Twitter

Leave a Reply

Your email will not be published. Name and Email fields are required.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>