A Web Graphics Primer, Part 1

What are "Web Graphics"?

In very simplified terms, most webpages consist of a set of instructions and a folder of images. The instructions, or "HTML", tell the browser what text to put where, and how to display the images in the folder.

There are essentially two kinds of elements visible on any web page. Most of the basic text (such as what you are now reading) is simply included in the underlying instructions and rendered by the browser. All of the images and graphic elements are actually graphics files which are displayed by the browser according to instructions in the HTML file. The HTML instructions tell the browser where to find the image and how to display it, giving instructions such as location, size and margins.

These are 3 typical button graphics.	Above is an example of words which are actually a picture. Web searchers, such as Google and Yahoo, see only a picture, and cannot read these words.
This is a "background tile" and has been applied at right as a background to fill the cell.	As you can see, background tiles can be pretty, but they can also make text more difficult to read.
This is an "animated gif". It actually consists of a stack of 8 images cycling rapidly. They can become annoying quickly, so it is best to use them judiciously.	Here are the 8 frames of the animation to the left.
This combination photo and graphic image will be used on the next page to illustrate image file types.

More advanced web sites might include such graphic elements as video, shockwave movies, Flash, and VRML, or 3D files.

Go to our links section for a good collection of web sites with everything you could possibly want to know about HTML and web graphics!