There are many different types of image files. Are you overwhelmed when selecting the right one for a job or do you just disregard the file extension (.jpg, .gif, .bmp etc) and hope for the best? What is the different and when is each one appropriate. Understanding different types of image is especially useful when it comes to your logo files. Whether you are working with a designer sending artwork to print or uploading a picture to a blog post, keep our list of definitions handy so you can be confident when discussing, requesting or selecting your images.
Image files can be broken down into two groups – bitmaps and vectors.
Bitmap
A bitmap image, also known as raster graphics, is resolution dependant. It is a map of dots, a collection of pixels in a grid. Each of the pixels contains information about one colour. When saving a bitmap image, the file can be quite large due to this information that has to be stored for each pixel. It is also important to know that increasing the size of a bitmap image reduces its quality.
Resolution
Resolution refers to the number of pixels in an image and is usually referred to as dpi (dots per inch) or ppi (pixels per inch). It is a measurement of the output quality of an image.
A pixel by itself is just a square of colour, but when connected to other pixels the possibilities are infinite.
Vector
A vector image consist of one or many scaleable shapes called objects that can be edited to change their shape, size, position and colour. Even if an object is quite large, the file size can be quite small. Vector graphics are created in drawing programs. Because they’re scalable, vector-based images are resolution independent. You can increase and decrease the size of vector images to any degree and your lines will remain crisp and sharp, both on screen and in print. When you zoom in to a vector image, you see sharp lines and curves as they are based on mathematical equations that set out instructions to connect points, lines, curves and to fill in shapes.
What should I use?
When deciding whether an image should be a bitmap or vector graphic, you should ask yourself the following questions:
- Does the image need to be resized?
- Does the image need to be drawn to scale?
- Do you need the image to look real?
- Do you have any restrictions on the file size?
Some common file extensions
To help clarify the difference between file extensions you may come across when working with image files, here are a few of the most commonly used:
.jpg
(Joint Photographic Experts Group) JPG files are commonly referred to as JPEG images. These are the most common file types for raster images taken with digital cameras. The key advantage of the JPG format is that it produces small files because of compression of image data. This making it a good choice for image transfer or downloading the files and using them on the Web. The only downside is that its file compression method does reduce the colour and detail of the image. A word of advice, don’t edit and re-edit a jpg as re-saving will compress the image each time. Instead, save a copy as another format such as a tiff to use for edits.
.tiff
(Tagged Image File Format) TIFF produces large bitmap files with no loss of quality. A tiff file also preserves features such as layers and transparencies when saved from Photoshop. A TIFF can handle device-specific colour spaces, such as the CMYK defined by a particular set of printing press inks. TIFF is a good choice when scanning images as they are high quality.
.png
Portable Network Graphics
This is an image format specifically designed for the web. They are high quality bitmap images with lossless data compression making them a good choice for placed images in programs such as Word, Powerpoint and Excel due to their crisp edges and the benefit of transparency. PNG was designed for transferring images on the internet but not for professional quality print graphics. It don’t support CMYK colour space. Another important point to note is that some older browsers such as IE6 do not support PNG files.
.gif
Graphics Interchange Format
A GIF is a low resolution file format most commonly used for web and email purposes. GIF files may contains up to 256 colours which means that the file is small in size. GIF bitmap images can be used for animation and it supports a transparent background.
.eps
Encapsulated Postscript
EPS language file format can contain both vector and bitmap graphics and is supported by virtually all graphic, illustration, and page layout programs. The EPS format is used to transfer PostScript–language artwork between applications.
Portable Document Format
PDF is an open source, universal file format developed by Adobe Systems that preserves and embeds fonts, images, layouts and both vector and bitmap graphics of any source document. PDF files can be shared, viewed and printed by anyone with the free Adobe Reader software. Some PDF files can be used for commercial, digital, and/or desktop printing. A PDF is output file that can be compressed to several resolutions suitable for both web and print and can have multiple pages with editable text, vector and raster data. They can even incorporate forms, mark-up, comments and links. But there most important feature is that they can be read and seen by, easily, by most users.
.ai
Adobe Illustrator
AI is the source file format for Adobe Illustrator, a vector drawing program used by designers and commercial printers to generate files of different file formats and sizes. Since Illustrator image files are saved in a vector format, they can be enlarged without losing any image quality.
.psd
Adobe Photoshop Document
PSD is the source file format for Adobe Photoshop, a bitmap graphics program. It stores your document in multiple layers. These layers can include text, masks, opacity, blend modes, clipping paths. When an image is complete, Photoshop allows the user to flatten the layers and convert the flat image into a .JPG, .GIF, .TIFF or other non-proprietary file format so it can be shared. The only real disadvantage to PSD files is that the file size can get very large, especially if you’re working on an image with many layers.
Native file format
The native file format is the default file format used by a specific software application. Usually special software-specific image properties can only be retained when an image is saved in the software’s native format. For example, layer styles and text in Photoshop will only remain editable when it the image is saved in the native Photoshop (PSD) format. Below are a few of the major graphics applications and their native file formats:
- CDR – CorelDRAW
- CPP – Corel Photo-Paint
- PSD – Adobe Photoshop
- PDD – Adobe PhotoDeluxe
- AI – Adobe Illustrator
- UFO – Ulead PhotoImpact
- PSP – Paint Shop Pro
- MIX – Microsoft PictureIt and PhotoDraw
Standard image format
A standard image format is one that is cross-platform compatible and supported by the majority of graphics applications. The most common standard bitmap-based formats are TIFF, JPG, GIF, and PNG. The most common standard vector-based formats are EPS and AI.
So in conclusion:
For web:
- Low resolution – 72 ppi
- RGB colour mode
- Use JPEGs for photos and other images with millions of colours, use PNG for everything else including transparency
For print:
- Needs to be high resolution – 300ppi,
- CMYK colour mode and/or spot colour
- File types – TIFF or PDF (without compression)
