The Basics of Graphics

| GIF File Format | JPEG File Format | PNG File Format | Graphics - Practical Applications |

Graphical images add that certain visual appeal or expression to your Web pages. Whether the image is a background image or inline image, they can certainly spice up a Web page when used properly. Images can be used in place of text or in fact can be an image of text. Pictures, Icons, buttons, lines and logos are some typical uses of graphical images. If you're interested in learning about the different types of image formats, then visit these sites:

			Graphic Formats for the World Wide Web
			The Graphics File Format Page

GIF - Graphics Interchange Format

You will find GIF images all over the Web. The main reason is that all graphical browsers support this format. Contrary to beliefs, GIF images are actually stored in a compressed format, which is a lossless compression and uncompression process. There are two major versions of GIF; GIF87a (non-interlaced) and GIF89a (non-interlaced or interlaced). The loading of non-interlaced or interlaced images takes the same amount of time, however, there are some advantages of using interlaced over non-interlaced. One advantage is that interlaced images will quickly display a low-resolution of the image and then proceed to load three more passes of higher resolution until the full resolution of the image is displayed. This allows your visitors to get an idea of what the image is about and then they can decide whether to wait for the full resolution or move on. Another advantage of GIF89a images is the fact that you can make one of the colors transparent. Did I mention that GIF images are limited to 256 colors? Okay, GIF images are currently limited to 256 colors.

			GIF Compression
			GIF87a Specification
			GIF89a Specification

JPEG - Joint Photographic Experts Group

JPEG or JPG is the second most popular image format found on the Web. There are quite a few graphical browsers that support the display of inline JPEG images. An advantage of JPEG is compression (reduction is stored size), however this type of compression is known as lossy (degradation of quality). The more the image is compressed, the more degradation of quality occurs. Another advantage of JPEG is that it supports 16 million colors.

			JPEG Specification

PNG - Portable Network Graphics

PNG is the new kid on the block, born out of a need for an improved image format and the fact that it is patent free. If you're interested in the technical specifications or an overview of PNG, then visit the following site:

			PNG (Portable Network Graphics) Specification Version 0.96
			PNG (Portable Network Graphics) Specification Latest Version

Graphics - Practical Applications

So now it's time to learn the "how to's" of graphical designs. Whether you create 2D or 3D images, will be up to you; you may even wish to use some of the available public domain images. Here are some sites where you find information and images to use on your Web pages:

			Adobe Tips & Techniques
			Anton's Freehand Page Tips & Tricks Index
			Creating Great Web Graphics by Laurie McCanna
			Creating High-Impact Documents
			Creating "Teeny Photo Icons"
			Creating Transparent GIF Images using LVIEW Pro
			Designing Web Graphics
			Fractal Design: Tips and Tricks
			GIF Animation on the WWW
			GIF89a Tutorial
			Graphics R Us: Tips and Tricks Page
			How I Made my Logo
			HTML Image Tips
			Inline Images FAQ
			JASC Web Developer's Forum
			Kais Power Tips and Tricks for Photoshop
			MetaTools University
			Photoshop Techniques
			Photoshop Tips Page
			Preparing Graphics for the Internet
			Sal's Flaming Text Effect
			Realm FAQ: Transparencies
			The Bandwidth Conservative Society
			Ticks on Trips (Photoshop Tips)
			Tom's Tips for Web Designers
			Transparent Background Images
			3d Graphics for the World Wide Web

[Top] | [Previous]

Send email to jkhart@pstbbs.com if you like.