These explanations of file types will help you understand what kinds of files to use for your documents, print books, ebooks or websites.

 

This is an enhanced excerpt from my book, The Etsy Image Guide.*

I’m asked about image file types so often that I decided to publish this part of the book independently. Since I wrote the book in 2018, this post includes more recent information.

In this post, I go over file types: jpg, png and tif files; and compression types: lossless and lossy files.

Hang with me as I point out the basic differences of each file type, because the quality of your post, publication, book, or website depends on your knowing what file type to use, when, and where.

If you consider yourself ‘not tech savvy,’ please just pause a second, take a breath, relax a little, and pretend to enjoy reading these little definitions — I guarantee you that once you know the differences in file types, your experience using images both online and off will improve dramatically.

TIFF/TIF, PNG or JPG?

The following are the most-often-used image file types. Of course there are other types — like GIFs and PSDs — but I won’t go into those here.

These three are the ones you will encounter most often.

PNG: PNG stands for Portable Network Graphics.

It is a file format for lossless (see next part for what lossless means) image compression. Some say it like ‘Pee eN Gee’, but “it is properly pronounced ‘ping,’ as in ping-pong.

According to techtarget.com: “The PNG is the most frequently used uncompressed raster image (pixel-based) format on the internet. This lossless data compression format was created to replace the Graphics Interchange Format (GIF).”

It’s the only file type that can be saved with a transparent background.

More info:
LabNol.org/software/tutorials/jpeg-vs-png-image-quality-or-bandwidth/5385

“The main difference between JPG files and PNG files is the compression algorithms that they use: JPG uses a lossy compression algorithm that discards some of the image information in order to reduce the size of the file. With PNG, the quality of the image will not change, but the size of the file will usually be larger than a JPG.”

More info:
DifferenceBetween.net/technology/protocols-formats/difference-between-jpg-and-png

JPEG or JPG: JAY-peg, short for Joint Photographic Experts Group.

A jpg is a commonly used method of lossy compression for digital images, particularly for those images produced by digital photography.

This is important: the degree of compression can be adjusted, allowing a selectable tradeoff between storage size and image quality.

In other words, when you go to save the image file for the first time, you will see different options for file quality and size. Saving from then on will default to that setting as long as you use that file, and future copies of it, without changing the options.

JPGs: mostly used for low-resolution images posted online. Most jpgs are 72 PPI: pixels per inch — or DPI: dots per inch, thus, low-resolution. Meaning they will show up on your electronic device faster, but not be good enough quality to snag off a website and print out, as it will be pixelated.

TIFF/TIF: Stands for Tag Image File Format.

Tif is an image file format for raster graphics images (pixel-based images).

It is popular among graphic and fine artists, the publishing industry, and photographers. The format was created by Aldus Corporation for use in desktop publishing.

TIFS: are mostly used for high-resolution, high-quality printing.

Example: when I produce an ebook, I use jpgs at 144 dpi, but for a print book, I use tifs at 300 dpi.

More info:
Blog.Hubspot.com/insiders/different-types-of-image-files

Not for use online, as they take forever to upload or show up as you scroll through a page. Because tifs are often saved for printing, usually at 300 dpi, using a tif image online is also an invitation for rip-offs — they are high enough resolution someone could pull it off the page and print it. So only use them in your documents and print books.

What is a lossless file type?

A lossless file type is one that, when you open it and/or modify it, it doesn’t lose pixels or other electronic information in the image.

An example of a lossless file type would be a png or a tiff file.

According to wikipedia: Lossless compression is a class of data compression that allows the original data to be perfectly reconstructed from the compressed data with no loss of information.

What is a lossy file type?

A lossy file type is one that, when you open it, it loses pixels, whether you modify it or not.

An example of a lossy file type is a jpg.

According to Merriam-Webster: Lossy compression is a way of making files smaller by ‘squeezing’ files. This technology strips out data it was programmed to regard as either unnecessary or redundant….”

It’s as if you bumped up against a table that had a mosaic design on it where the mosaic tiles haven’t been glued in yet. When you bump the table, the tiles can move, or even jump off the table.

When you open and modify your jpg image, pixels will disappear or even glom onto their neighbors, making a bigger area of one color.

Often the changes are so slight you don’t notice them, but if you keep doing it — open, modify, close, repeat — you will start to notice distortion of the image. I’ll show you how to avoid that in a bit.

As a personal choice, I always change PNG files to JPG files. The size of a file (in MB or KB, not inches or pixels) is most times significantly smaller once converted. This saves upload time, and the loading speed for the online viewer.

Bonus info: What is a PSD file?

A PSD (Photo Shop Document) file is a pixel-based file created and saved in Adobe Photoshop.

This type of file can range from a simple image, to an extremely complex one using multiple “layers” that make modifying the image easier.

Don’t use a PSD file online. Most times you can’t upload them anyway, because of the internal layers.

More info:
Blog.Hubspot.com/insiders/different-types-of-image-files

How to modify your images without losing pixels

This is a critical issue! If you are needing to continually modify an image, here’s how to do it.

1. Save the original image this way

It can be a tif, png, psd, or jpg file — it doesn’t matter, because you never, ever modify it.

Save it using this configuration: image-name-date-ORIG.jpg

Like this: horse-082723-ORIG.jpg.

Horse is obvious, 082723 is August 27, 2023, and ORIG is obviously saying it’s the original image, and is not ever to be opened or modified.

2. To modify the image

1. click once on the original without opening it,
2. go up to to edit >
3. make a copy >
4. paste the copy right on your desktop (or other device).

If you cannot make a copy by using edit, copy, paste: open the file, save a copy, and close the original immediately without saving any changes.

3. Now change the copy’s file name

For instance, you will change horse-082723-ORIG-copy.jpg
to horse-082823.jpg — leaving off the ORIG-copy.

Now you can open the saved copied file and make your mods.

Each time you need to modify that image, copy the last one without opening it, save as a new name, and modify from there. Save as a new date: for instance, horse-082823.jpg becomes horse-082923.jpg.

Make sure you add the correct date, since this is how you will know which version is the latest.

If you make several changes on one day, you can save them by adding a letter behind each one, like this: horse-082823a.jpg, horse-082823b.jpg, horse-082823c.jpg and so on.

NOTE: Never use ‘final’ or ‘finalfinal’ — LOL! — in the file name, since it doesn’t indicate specifically when that so-called final day was.

If you follow this protocol, you will retain the details of your original image all the way through each modification.

Well, depending on the mods you make, that is!

I suggest you bookmark this post so you can refer to it later when someone asks you what file types to use, because now you’re an expert on it and you’ve learned how to make such great images!

NOTE: I have not included information about ‘vector’ images, as they are a critter of another breed. I’ll do that soon.

-=-=-=-=-=-=-=-

Thanks for reading — I hope you have found this to be helpful!

You can get the full guide now in print —
8×10, 156 pages, full color: The Etsy Image Guide (32$).

Or you can get this as a downloadable ebook—
156 pages, full color: HERE ($17.99).

-=-=-=-=-=-=-=-

Image: The Etsy Image Guide cover
© Angela Treat Lyon 2018