Choosing a Graphics Format

For the Internet

There are a choice of three formats that can be used for graphics images for use on the internet. None of these formats is suitable to be used for work in progress so you are best off using a different format for the file while you are working on it and then convert to one of these internet formats once you have the image ready to publish on the internet.

Keeping file sizes to an absolute minimum is essential for files that are to be loaded to the internet.

JPEG or JPG (Joint Photographic Equipment Group)

This is the format to use for photographs (and other images having more than 256 different colours) that you want to load up to the internet. This format stores the maximum in image information into the smallest possible file and you even get to select the compression ratio yourself so that you can exchange a small (but acceptable) loss in picture quality for a dramatic reduction in file size. For internet use, a compression factor between 50 and 70% should be acceptable.

Indicative file sizes:

GIF (Compuserve - Graphics Interchange Format)

This format allows a maximum of 256 colours and so is only suitable for images where lots of colours are not required. You might ask therefore why you would use it instead of jpeg. Well there are three advantages that this file format has over jpeg. These are that it supports transparency and animation, and that in some circumstances it can produce much smaller file sizes.

Setting the background of the image to be transparent allows images to be placed into your page that are not just plain squares but can be whatever shape that you want. The colour that you select to be transparent will be transparent across the whole image so this format is also useful for line drawings etc. The images on this page are examples of gif files with transparent backgrounds.

It is also possible to store multiple images within the one gif file and set them up to display in sequence with varying length delays. This allows the creation of animated banner images without any special coding required as the animation is built into the actual image. Special software is required in order to create animated gifs. Animated images are slightly larger than the combined size of the images contained within them and so will take longer to download than normal images - you should try to avoid using them wherever possible.

Where your gif does not need to use 256 colours, the image can be reduced in size by reducing the number of colours in the colour palette built into the gif. One example of this is the single pixel transparent image that is used on these pages to help control spacing, by only supporting a single colour in the palette the file size is a mere 42 bytes. The file would be even smaller if the image was not defined as being transparent.

PNG (Portable Network Graphic)

This format was introduced with the intention that it replace the gif format. As well as supporting more than 256 colours, this format not only allows you to define one colour as being transparent but (by using what it calls an alpha channel) it also allows you to define levels of transparency so that the colours in your image can appear with the background showing through as well. This can be particularly useful when you use style sheet positioning to control the location of the images on your page and are overlaying images over one another or over the page text.

The main disadvantage of this format is that support is restricted to the more recent browser versions as this format was only recently introduced as a valid internet format. For this reason, it should be avoided where you are looking to create pages that are supported by the widest possible range of browser versions.

go to top


Exchanging with Others

If you are sending someone a graphics image that they will look at but not want to edit themselves then one of the formats mentioned above for use with the internet will best suit your purpose. If on the other hand the person that you send the file to is going to want to edit the file then you will need to select a file format that is supported by both your and their graphics programs and which does not lose data each time you save the file. Assuming that you are not both running the exact same version of the same graphics program on the same operating system, the native file format of your graphics program may not be suitable. The following file formats provide the greatest support across different graphics programs and/or operating systems.

BMP (Windows Bitmap)

This is the standard format used by Windows for storing graphics images. This format does not use any compression whatever so files in this format are HUGE compared to other formats. All versions of windows come with a program called paint which can be used to edit files of this type so even if you don't know what graphics program the other person might have, you can use this format to send graphics files to anyone running a version of windows and know that they will have a way to view and edit the image.

This format is not supported on all non-windows platforms. Additionally, the huge size of files stored in this format makes it difficult to find media that can be used to transfer the file between computers not on the same local area network.

Pict or PCT (Macintosh Picture)

This is the standard image format for the Apple Macintosh. While this format produces files that are smaller than BMPs, the format is not supported by all graphics programs on other platforms.

TIFF or TIF (Tagged Image File Format)

This is the format that was designed to be used for trading graphics files between graphics programs and operating systems. This is therefore the best format to use for exchanging files where the other person is using a different operating system or a different graphics program. All decent graphics programs support this format.

This format supports optional compression so that you have the opportunity to choose whether to make the file smaller and perhaps lose some cross platform compatibility. If you do find that your compressed file is incompatible with the other system try again without compressing the file.

go to top


Software Specific Formats

The best file format to use to save your original copy of the graphic to allow yourself to work on it later is the native file format of whatever graphics program that you are using. Each decent graphics program has a native format that stores all of the information about your graphic so that if you save the image and then reopen it later you will find yourself in exactly the same position as if you had never closed it in the first place. For information on some of the graphic formats used by particular software see the list of graphic formats below.

Software specific formats are also ideally suited to exchanging files with someone who is running exactly the same version of the same graphics program on the same operating system as yourself but may not be compatible between different operating systems, different graphics programs, or even different versions of the same graphics program. Many of the best graphics programs do support reading and saving files in the native formats of other graphics programs although they may not support all of the features that the other graphics program does and so the graphic may not appear exactly as expected.

go to top


List of Graphics Formats

The following are some of the many graphics formats that exist. Many of the formats listed are supported by the more popular graphics programs. (Note that this is by no means a complete list of all of the different graphics formats that exist).

Adobe Illustrator.
Windows Bitmap - see Exchanging with Others above.
Compressed Bit Map
This is the native file format used by Corel Chart.
This is the native file format used by Corel Draw for Drawings.
This is the native file format used by Corel Draw for Templates.
Computer Graphics MetaFile
Although the Windows Clipboard is not strictly speaking a graphics format, some graphics programs can read and write in the format that the clipboard uses.
This is the native file format used by Corel Clipart and Corel Presentation Exchange.
This is the native format used by Corel Photo Paint.
Scitex CT Bitmap.
This is the native file format used by Micrografx Draw.
This is the file format used by Autodesk for Drawing Interchange.
Enhanced Windows Metafile.
Although Encapsulated Post Script is not strictly speaking a graphics format, some graphics programs can read and write postscript files as if they are images. The file contains instructions for postscript printers on how to print the page.
This is the native file format used by Ventura / GEM for Drawings.
Compuserve - Graphics Interchange Format - see For The Internet above.
Although HP Graphics Language is not strictly speaking a graphics format, some graphics can read and write files in this format. The file contains instructions for HP printers on how to print the page.
This is the native file format used for graphic images by Amiga Computers.
This is the native file format used by GEM Paint.
Joint Photographic Equipment Group - see For The Internet above.
This is the native file format used by Deluxe Paint.
This is the native file format used by the MacPaint program on the Macintosh.
Microsoft Paint.
Portable Bit Map.
This is the native file format used by Kodak when they create ICC Photo CDs.
This is the native file format used by Zsoft PC Paintbrush.
This is the native file format used by Adobe Photo Deluxe.
Although the Adobe Acrobat Portable Document Format is not strictly speaking a graphics format, some graphics programs can treat it as such.
Portable Grey Map.
This is the native file format used by Lotus for Graphics.
Pict, PCT
Macintosh Picture - see Exchanging with Others above.
Portable Network Graphic - see For The Internet above.
Portable Pixel Map.
This is the native format used by Adobe Photoshop. This format supports alpha channels, layers and loss less compression.
Sun Raster Images.
Raw File Format.
Truevision Targa.
Tagged Image File Format - see Exchanging with Others above.
This is the format that Ulead iPhoto uses to store image templates.
Wavelet Compressed Bit Map
Windows Meta File.
This is the native format used by WordPerfect for storing graphics.


This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow