Image file formats: An overview of

10 image file types

Most users know common picture formats such as JPG and PNG. However, their exact
differences and advantages of the different formats aren’t well known. It’s often difficult or
impossible to tell the difference between a JPG file and a PNG or GIF file. But a closer look at
the different image formats is worthwhile. Each format has advantages and disadvantages and
is designed for different areas of application. We’ll show the most common image file formats
(pixel and vector graphics) and explain when you should choose which format.

Contents
1. Which image file formats exist?
2. Choosing the right image file format
3. An overview of the most important pixel formats
4. An overview of the most important vector formats

Which image file formats exist?

Before we go into detail on which image file formats exist, it’s worth understanding the
basic differences between pixel, raster, and vector graphics.

As the name already suggests, pixel graphics consist of pixels. What exactly does this mean?
Pixels are individual dots that make up a picture or graphic. The larger the number of pixels in an
image, the higher the resolution and file size. The disadvantage of pixel graphics is that scaling
the image is associated with a loss of quality. Each pixel has a defined size. If you enlarge a
file, the pixels are also stretched and the quality decreases.

Tip
Always save pixel graphics in the exact size to fit the platform you’re going to need it for. In this
way, you’ll avoid any loss of quality when you increase the image size later on.
Vector-based graphics don’t have this disadvantage. These image file formats have an image
composed of two-dimensional objects that define the position, dimensions, and colors of the
image. This allows vector graphics to be scaled flexibly while maintaining constant quality.
Picture formats in this category are suitable for graphics that are used in different sizes, typically
logos or other marketing materials.

Tip
Make sure you always receive the master file of an image before passing it on to an external
source as a graphic design task. This way, you’ll be able to protect your images properly while
being able to save the file in any given size.

Choosing the right image file format

Choosing the right image file type largely depends on how you’re going to use the image. The
following factors influence the file format choice:

 Do you need the image in different sizes?

 Are you using image formats for web or print?
 What file size do you need the image in and how important is a high image quality?
  Does the image require many different shades of color?

For web purposes, quality comes in second place. What’s more important is a small file size and
a short loading time. Accordingly, lossy compression is often acceptable. In this case, the
process leads to a loss of quality because data is removed from the image or reduced to one
pixel. With lossless compression, on the other hand, the quality is maintained even with a
reduced file size. When compressing images, pixels of the same color category are grouped
together and metadata is removed.

Tip
More information on Google’s WebP-Format – which is characterized among other things by a
particularly efficient compression – is also available in the Digital Guide.

An overview of the most important pixel formats

JPG, PNG, or GIF: Some of the best-known image file formats are pixel formats. The reason:
Raster graphics are suitable for almost all areas of application and can be opened and edited
independently of which program you use. In addition, the usually detailed color gradations and
complex color gradients are ideal for presenting photographs in the best light. The lossless
compression also lends itself perfectly to the presentation of detailed graphics on the web.
Below, we’ll introduce you to the most common pixel formats as well as their advantages and
disadvantages:

GIF: Graphics Interchange Format

Have you ever noticed animated advertising banners on a website or moving pictures in your
Facebook feed? These were probably GIFs. GIFs are characterized by their animated nature. A
single GIF file contains all frames and time information needed for an animation.

This image file format consists of up to 256 colors in the RGB color space and is therefore not
suitable for colorful and complex photos that normally cover several thousand colors. At the
same time, the limited choice of colors is an advantage if you’re using image formats for web,
because the reduced file size means shorter loading times – even with animated files. Sharp
edges of shapes or fonts are even better represented in the GIF format than as a JPG image.
This image file type is therefore ideal for small graphic elements and for web graphics.

Advantages Disadvantages

Lossless compression Limited choice of colors

Animations are possible Not well suited for photography with a broad range of colors

Small file size Flat image format

Short loading time

Supports transparency

PNG: Portable Network Graphics

The PNG image file format was developed as an advanced alternative to GIFs. Unlike a GIF, a
PNG can be saved with a transparent or semi-transparent background and supports the
alpha channel. In addition, the PNG format adapts to optimized computers, meaning that it
adjusts itself to a growing range of colors. The color spectrum covers up to 16 million colors,
which is significantly more than a GIF. However, this image format is not suitable for printing
because PNGs do not support the CMYK color model. This is where the name “Portable
Network Graphics” comes from, which implies the primarily digital use.

Note
Although their choice of colors is limited, the GIF image format is still being used a lot, since
animations aren’t possible with the PNG alternative.
PNG is a typical image format for the web that is characterized by lossless compression.
Even small files are able to retain their high quality and resolution and show fine nuances.
Accordingly, PNGs are suitable for logos or other small images with many shades, making them
ideal for further processing and for saving in different sizes. However, this also means that
they require more memory space. A PNG file is up to ten times larger than a comparable JPG.

Advantages Disadvantages

Lossless compressions Not suitable for print

Supports (semi)-transparency and the alpha channel Requires more memory space

Full color spectrum Not universally supported

Animations are not possible

JPG/JPEG: Joint Photographic Experts Group

The JPG format is the most commonly used image file format. The files are characterized by
high compatibility and universal application possibilities. This format can be opened and
converted with almost any application. In addition, JPGs offer the full color spectrum with up to
16 million colors. The disadvantage is that compression of an image file leads to the loss of
image data due to the combination of similar pixels, which in turn leads to a loss of quality. This
is also the main difference between JPG files and the PNG format.

Tip
JPG vs. PNG: Both image file types are very common for web images, but are actually quite
different. Choosing the right image format will depend on its intended use.
For web use, the quality of a JPG file is sufficient in many cases, and lets you benefit from a fast
loading time thanks to the small file size. So-called progressive JPEGs offer an additional
advantage in terms of the user experience, as images are loaded pixel by pixel, so that
unwanted white areas are avoided on websites. A JPG can also be sent quickly and easily by
email as a preview. Without compression, high-quality JPG files are also suitable for printing.

Tip
Always choose the best possible combination of quality and file size when working with image
formats for web.

Advantages Disadvantages

High compatibility Lossy compression

Widespread use Doesn’t support transparencies and animations

Quick loading time No layers

Full color spectrum

TIFF: Tagged Image File Format

The TIFF format differs significantly from other image file formats presented so far. Most web
browsers do not support this format, which makes it unsuitable for images displayed on the
web. However, TIFF offers significant advantages when it comes to editing images. The format
supports both RGB and CMYK color models and has a high color depth of up to 32 bits per color
component. In addition, layers, masks, and transparencies can be saved.

Lossless compression allows you to store or copy files without any loss of quality. The TIFF
format is therefore ideal for printing high quality images. Image information is either not
compressed at all or compressed without any loss of data. However, the high-quality means that
images require more storage space. This property also virtually rules out the use of image
formats for web.

Advantages Disadvantages

Lossless compression Not compatible with many browsers

High image quality Requires more storage space

Ideal for photograph printouts

Transparencies and layers

BMP: Windows bitmap

Since 1990, the BMP image file format has been an integral part of the Microsoft operating
system and Windows 3.0. Accordingly, BMPs can be opened without additional plug-ins or
third-party programs. Although this image format has now been largely replaced by other
formats, it is still in use.

BMP is a simply structured image format that is characterized by fast processing times. Even
after lossless compression, image data is still relatively large because all pixels are stored with
their respective color values. Today, there are other image file formats with which an equally
loss-free compression is achieved alongside by a smaller file size. In the age of communication
via email and web platforms, this image format is therefore becoming increasingly uninteresting
and unsuitable for modern applications.

Advantages Disadvantages

An integral part of Windows Big file outputs even after compression

Large color spectrum

Simply structured

PSD: Photoshop Document

PSD is the format of the leading image editing program Adobe Photoshop and a format
frequently used by graphic designers. However, editing requires the appropriate software.
Therefore, the PSD format is often unsuitable for individuals and for collaborative work. You can
work around this problem by using Adobe Photoshop and converting the file to another image file
type. Conversion is also necessary before printing.

With the PSD format, each image consists of several layers that can be easily edited. In
principle, these files are raster graphics, but they can also contain vector graphics. This image
file format is therefore ideal for extensive image editing.

Tip
Adobe Photoshop is available as part of the Adobe Creative Cloud at a cost. Free Photoshop
alternatives are gaining in popularity these days, as many of them boast a similar spectrum of
features.

Advantages Disadvantages

Extensive editing of image layers Photoshop is a prerequisite

Creation of videos and animations possible Large storage capacity due to layers

Raster and vector graphics

Conversion to other formats possible

An overview of the most important vector

formats
In contrast to pixel graphics, which are fixed in size, vector graphics are much more flexible and
therefore ideal for displaying geometric shapes and fonts. Lossless scaling also makes it
easier to create responsive web elements. In most cases, special graphics programs are
required for processing these files. Therefore, the following image file formats are usually
exclusively used by graphic designers. But individuals are increasingly also taking a liking to the
easily adaptable vector graphics thanks to free software alternatives.

PDF: Portable Document Format

The PDF image file format is developed by Adobe, but, unlike other Adobe formats, does not
require any company-specific software (although Acrobat Reader is the corresponding
standard). The PDF format has established itself as a reliable exchange format and can be
viewed without paid editing software – on any device, any operating system, and any web
browser. The format is particularly popular to showcase print files.

With the Adobe range of programs, which are subject to a fee, PDFs can be processed in
a versatile and flexible way. The foundation of this picture format particularly shows its strength
for vector graphics, but also maps pixel graphics. Even in the free version, PDFs can be
expanded on with additional features such as notes, comments, or file attachments.
Appropriate security settings can be used to prevent editing by third parties.

Advantages Disadvantages

High compatibility, independent of platform Editing only possible with payed version

No chargeable software necessary Text is recognized as images

The standard for print files Often high storage space required

Additional features

AI: Adobe Illustrator format

Like the PDF format, the AI format is a native image format of the Adobe family. However, unlike
PDF, you need the Adobe Illustrator program to display these files. The vector-based format can
be scaled flexibly and offers the possibility to embed or link raster graphics. The image file format
is mostly used to save logos and other marketing materials, which are required in different
sizes.

With Adobe Illustrator, files can also be saved in any other common image file format. This
facilitates the exchange of files between graphic designers and private individuals. Another
advantage is that you can save multiple variations in a single file by hiding and unhiding
layers.

Note
Among professional graphic designers this image file format has established itself as
the industry standard.
 Advantages Disadvantages

Highly scalable Requires plenty of storage space

Multiple layers Adobe Illustrator is a prerequisite

Compatible with other Adobe programs

EPS: Encapsulated PostScript

In 1987, Adobe published the EPS format in the PostScript programming language. Today, the
image format has largely been replaced by the more widely used PDF, which is also based on
PostScript.

EPS was the first format that made it possible to display documents exactly as they appear in
print. EPS files, like PDFs, can be opened with free software across all platforms. The most
common program to open EPS files is Adobe Acrobat Reader, but there is a wide range of
alternatives available. The lossless format integrates pixel and vector graphics and is
characterized by a particularly high degree of adaptability and scalability. One of the
disadvantages is that EPS files are limited to one document page and do not distinguish between
vector and bitmap.

Advantages Disadvantages

High quality images suited for print Replaced by PDF files

Compatible with almost every design software Limited to one page

Doesn’t distinguish between vector and bitma

SVG: Scalable Vector Graphics

The XML-based vector format SVG appeared in 1999 and shows images and their elements in
text format. Since not all users, especially individuals, have access to Adobe Creative Suite, AI
files are sometimes unsuitable for sharing. SVG graphics, on the other hand, are ideal for
sending vector graphics, as they don’t require any specific software. In theory, the vector
format can be created in a simple text editor, but this isn’t common practice.

Note
In the Adobe Creative Cloud, SVG graphics can only be opened with Adobe Illustrator. To edit
them in InDesign or Photoshop, a conversion to the EPS format is necessary.
The SVG image file format has been around for over 20 years. It is experiencing a boom due to
the increasing variety of screen sizes and its responsive design. SVG graphics are rescaled
with every screen layout. Accordingly, the files are always displayed in maximum sharpness and
make it much easier to set up a responsive design. The World Wide Web Consortium (W3C) also
standardized the format in 2001 and recommends SVG for displaying two-dimensional vector
graphics on the web.

Advantages Disadvantages

Supported by most web browsers More complex and detailed graphics increase the file s
considerably

Lossless scaling Not compatible with certain browsers

Responsive design Only editable with Illustrator within Adobe Creative Clou

Small file size

Animation and more possible through

JavaScript