8 Types of Image Files and When to Use Them

Have you ever thought what's the difference between image file formats, such as JPG or GIF, and for what purpose each of them should be used?

If we go deeper into graphic design, we'll find a lot of interesting things, but many of them may be incomprehensible at first. Let's take a look at some points of digital images to better understand the graphic universe.

1. Vector and Raster

Before describing image file formats, we have to figure out what are raster and vector graphics and what's the difference between them.

Raster images consist of hundreds or thousands of lines of pixels. The most popular raster formats are JPG, GIF, and PNG. If you see a picture online, you can be sure that it's a raster image because web technology barely supports vector graphics. The more pixels of an image we see, the better quality the image should be, as you're getting more of the finer details. Consequently, there are high- and low-resolution pictures, and you cannot change the size of the image without changing its quality.

As for vector graphics, it is built on the principle of proportions. Vector images are created with use of geometric shapes, like lines, curves, and polygons, rather than pixels. You should choose this type of graphics if you're going to create a drawing that needs frequent resizing. Vectors are typically used in graphic design. Usually, graphic designers work with vector formats like PDF, AI, and EPS, creating brand graphics and logos. You can find good examples of such visuals on Logo History.

2. JPEG / JPG – Joint Photographic Enhancement  Group

Most image files used on the web are JPEGs. The defining characteristic of this raster file type is lossy compression which allows for reducing data size for handling, storing, and transmitting content. JPEG is most suitable for pictures with smooth changes in brightness. So it is widely used for photographs and other colorful images. When you save a file as JPEG or JPG, it employs a compression algorithm that leads to some loss of quality. That's why it doesn't fit for storing technical blueprints requiring high precision.

3. GIF – Graphics Interchange Format

GIF is a raster format developed by CompuServe. While using lossless compression, it, however, supports only a 256-color palette which significantly limits its application. On the other hand, GIF makes it possible to create animated pictures. The relatively small sizes of GIF files allows them to be used on the web where we can see them as banner ads or expressive comments on social media.

4. PNG – Portable Network Graphics

Developed as a free and open-source alternative to GIF, PNG is perfect for web design as it supports three types of raster images with color depths of 8, 16, 24, and 48 bits: palette-based images, grayscale images, and full-color images. With the widest color palette and the option of saving images on a transparent background, this format becomes more and more popular for web projects, resulting in a clear and sharp design.

5. TIFF – Tagged Image File Format

TIFF is another lossless compression file type. Exceptionally high quality of images makes it usable for printing. You can deal with TIFF files when scanning documents or using digital cameras. Since TIFF images are stored in large sizes, they are not suited for websites.

6. HEIF – High-Efficiency Image File

HEIF allows saving an image or a sequence of images, similar to an HDR sequence or GIF animation, in one file. A HEIF file can be light in size with a rather high compression ratio which is much more efficient than a JPEG file of similar quality. Based on the High-Efficiency Video Coding standard, the format is supported by a range of manufacturers and developers, like Apple, Microsoft, and Canon. HEIF files may have different extensions including .heif, .heic, .avci, and .avcs. Some operative systems automatically convert the HEIC format to the older JPEG format. However, to avoid incompatibility, you can also convert HEIC to JPEG through graphic software or an online converter.

7. SVG – Scalable Vector Graphics

Developed by W3C, SVG is a vector format with the right to fair use. Unlike other file types, an SVG image is defined with the XLM markup language. Certainly, this doesn't mean that you have to know XML. You can draw an image in a graphic editor which translates your actions into an XML code. As XML is a text standard, SVG files are available to be indexed by searching engines. Having small sizes, they are quickly processed, and therefore, are good for web pages.

8. CDR – CorelDraw

CDR was developed by Corel Corporation for the company's software only. As a proprietary format, it is not supported by non-Corel applications, except InkScape and sK1.

9. AI – Adobe Illustrator

AI is a proprietary file format developed by Adobe Systems. It is among the popular vector formats widely used by professional designers, being a perfect graphic file type to create pictures for all kinds of projects, from print to web. In general, you can use Adobe Illustrator to create artwork from scratch as it is a versatile tool for working with most of graphic formats.