Graphic Wars

There are many different graphics formats used on the internet. Sometimes different tools that nominally use the same format do not create images that are compatible - hence my title Graphics Wars. This page explores different image formats. There's also a section on safe colors and a list of links for more information and free graphics to use on your website. Do not copy images without permission.

JPEG (Joint Photographic Experts Group) files are one example of multiple formats for the same file extension. The ICO committee could not agree on the format standard. C-cube Microsystems used the JFIF (JPEG File Interchange Format) standard for jpg and jpeg files. Later SPIFF (Still Pictures Image File Format) added enhancements and used the Jpeg and spf file extensions.

There are hundreds of different graphic file formats. The table below describes a few.

Table of Image Formats

Format	File Extension	Description	Color Depth	Compression
Bitmap	BMP	Map of bits indicating color of image. Used by Microsoft Windows	1,4, 8 or 24 bits	RLE or none
Fax	FXG3	Format used by FAXes	-	-
Flash	SWF, FLA for source	Used for animated graphics and computer games. Images are stored in vector graphics. See my separate Flashpage.	-	-
FLC	FLC	Used in many animations, 64 x 64 resolution	256 colors	-
FLI	FLI	Used in many animations, 320 x 320 resolution	64 colors	-
Graphics Interchange Format	GIF	Image and animation format trademarked by CompuServe. Software written after 1994 must have license to read/write gif files.	8 bit indexed color with transparency, 256 colors	LZW compression patented by UNISYS
Indeo Video File	IVF	Video	-	-
Joint Photographic Experts Group	JPEG, JPG, JPE, JFIF, SPF	Good format for photographs.	24 bits	Adjustable
Motion Picture Experts Group	MPEG	Format for animated movies	-	-
Kodak Flashpix Image	PCX	Kodak's answer to graphic file format needs. Origianlly developed by ZSOFT.	-	Yes
Portable Document Format	PDF	Developed by Adobe Systems for formatting documents from a variety of desktop publishing applications. Adobe Acrobat Reader is required to display files with pdf format.	-	-
Portable Network Graphics	PNG	Alternative to GIF to solve trademark and patent problems. Supports indexed color, grayscale, truecolor images and optional alpha channel.	1 - 48 bits	RLE
Postscript	PS	Used by printers. Use this if plan to have images professionally printed.	-	-
Quick Time Movie	QT	Movie	-	-
SUN Raster File	RAS	Bitmap format of Sun Microsystem Unix systems	up to 32 bits	Yes
Still Picture Image File Format (SPIFF)	JPEG, SPF	'Official' JPEG file format.	24 bits	Multiple options
Scalable Vector Graphics	SVG	Images stored as vector rather than raster format. Standard is being adopted by W3C and will be incorporated into browsers. For now, must use plug-ins to display it.	-	-
Tagged Image File Format	TIF, TIFF	Bitmap format maintained by Adobe. Programs require Unisys license after 1994 to read/write. Can be any resolution and black and white, grey scale or color.	24-bit	Multiple options
ThingMaker Scene	TMS	Animation	-	-
TrueVision (Targa) File Format	TGA	Bitmap file format which supports colormaps, alpha channel and other options.	1 - 32 bits	RLE or none
Web Object Oriented Graphics Library	OOGL	3D graphics with incorporated URL links	-	-

Safe Colors

Colors displayed on a computer for text and graphics are expressed in terms of red, green and blue (RGB). The RBG number may be expressed in hex or decimal. Old monitors and browsers support only 256 different colors. To be sure that everyone sees the same colors on your webpages, use only colors from the 'browser safe' palette. This are colors with hex values of 00, 33, 66, 99, CC or FF for each of the RGB values. In decimal these values are 00, 51, 102, 153, 204, 255. (e.g. hex: 00 33 66, decimal: 00 51 102) If you use a color that is not in this palette and the user's browser only supports this palette, it will display the closest color in the browser safe palette. See the Visibone Color popups, for the 216 browser safe colors. HTML Goodies: Hex and Word Color Codes is a helpful chart of color names and codes but it includes named colors that are not in the safe palette.

Links

Color Schemes Generator - Amazing tool to create a myriad of color schemes.

GIMP - GIMP is a very powerful free graphic tool for creating and editing graphics. It is very similiar to PhotoShop, but free. Gimp is very complex and challenging to learn, but stick with it and you'll be amazed at what you can create! There's lots of documentation available but not much for the beginner. GIMP was originally written in UNIX but is also available for Windows, although most of the documentation assumes UNIX.

Grokking the Gimp has instructions for using Gimp.
Cooltext.com has great online tools that use GIMP but make it real easy to create logos, buttons and bullets.
Weisbek's Gimp tips has some great tips for Gimp users with some experience with Gimp.
Gimp Wiki has a section on Getting Started (on the home page) and a list of Gimp tutorial websites.

GraphicCat's Lair - Some great free graphic sets are available here for personal use and Pat will create custom graphics for a fee.

myImager - A free online image editor. This is a very powerful tool that can change the size, color, rotation, format and compression of your images without any other graphic tools. Other features are also available.

PhotoPlus - Image creation and editing software. Versions 6 is free and versions 8 and 9 of PhotoPlus and other graphics products are available for purchase. Tutorials are also available on the site.

VisiBone - Spectacular reference cards for color, html, javascript and more. Purchase reference cards or use their free online services.

WizHat - Free graphics, quick Html reference, glossary and more