A GRAPHICS PRIMER

By Ruth McIntyre-Williams
Posted Friday, December 3, 2004

You’ve downloaded buttons and horizontal lines and other good stuff from the web — but — it’s not all exactly what you want. Besides, you have some photos that would spruce up the site, and you want to feel as if some part of the graphics were your own. You can do it. Gather your photos. Draw a palm tree in your paint program. Put them on the web.

This is not a comprehensive graphics course. We’re talking basic, simple — words you want to hear. Two of these words are acronyms: jpg and gif. What they mean, you don’t care. Just remember them.

a. Use jpg when your graphic is a photograph or like a photograph. b. Use gif for everything else.

Easy, huh? Onward!

First, check out your scanner software. Read the manual or open up your scanner software and start pushing buttons. Somewhere, you should be able to choose the gif or jpg file format to save your scan in. It could be under “Save As” or “Export,” or it could be in the box where you set up the parameters before you scan. Experiment. Learn how to create the file format you want before you go on.

We’re going to start with jpg and photos. Computer monitors only show at a resolution of 72. So find out where you set the scanning resolution, and put it at 72. If you print out your 72 scan, it will be terrible, so don’t print it. On the web, it will be beautiful. Trust me.

Then, check your photo size. A two inch by three inch photo on a web page is big! Shrink your photo either when or after you scan it. You’ll have to experiment with what size you’ll want on your page.

You’ve scanned your photo at 72, and got it to the size you want. You must now “Save As” or “Export” it as a jpg. You will probably have the option of choosing “high,” “medium,” or “low” quality for your jpg. If at all possible, save it as “low.” If numbers are given, try “3.” . Use the lowest quality or lowest number that you can and still have an acceptable photo. Which brings us to an axiom of web graphics design:

All graphics should be created in the smallest possible file size!

Smaller graphics files mean faster loading when a viewer opens your page. If the loading takes too long, the viewer will not stay, much less buy something. Smaller graphics files means a smaller storage needs for your page, important when you are allotted limited server space. Sometimes web browsers balk at loading huge graphics. Keep it small. Avoid headaches.

Moving on to gif files. Gif is used for graphics that have areas of flat color, like the palm tree you made in your paint program. Read the manual, and check out your paint program. You might have a paint program from which you can save or export gif files.

If your paint program won’t export the art work as gif, no problem. Print your art work out at a high resolution on good paper and scan it at 72, size it, and save or export it as gif 89a. If your software just says “gif,” I think you can safely assume it is gif89a unless your software is very old.

There is one important distinction between gif and jpg. In jpg, you must be sure that your photo fills the picture window after you scan. If there is white space around or on any side of the photo, crop it off, or it will show up on the web. But in gif89a, the background of your picture will be transparent. So, if you scan your palm tree on its white background and save it as gif, what will appear on the web is just the palm tree. jpg would show a palm tree on a white rectangle.

While saving or exporting in jpg, you had a choice of quality for your finished product. In gif, you have no quality choice, but you may have a choice of the number of colors to be used. The fewer the colors, the smaller the file. So again, experiment with saving or exporting your artwork with different numbers of colors until your arrive at a satisfactory graphic with as few colors as possible.

There are really just three things you need to know:

1. jpg is for graphics that are photographs or like photographs. 2. gif is for everything else.
3. All graphics should be created in the smallest possible file size.

Got it? Go create!

About the Author
Ruth McIntyre-Williams
clovenstone@aol.com
Clovenstone Adventure
Novel