Build Better Buttons
As soon as your site has more than one page, navigation becomes an important consideration. Many sites use graphics to control site navigation, but it's sometimes hard for visitors to know which link they are considering--unless, of course, they look at their cursor.
To help clarify the choices, many Web builders use buttons that pop up or change colors when users hover the mouse over them. This is done by adding JavaScript in the <A> tag to sense when the cursor is over an image and swap in a different version of the image until the cursor moves away.

Creating this JavaScript can be a hassle, but thanks to Builder.com's own SuperScripter columnist, Charity Kahn, all you need to come up with are the images. Her Mouseover machine will generate the code you need.

Step One
Create two sets of each image in your navigation scheme. You will need an on version and an off version. Keeping these images the same size is helpful, but otherwise you are free to indicate the on state by any means you choose. Typical designs of the on state include a different color or using a bevel to create a raised appearance.

To help keep the files straight, name them filename.on.gif, filename.off.gif, and so forth.

Step Two
Use the Mouseover machine to generate the code. Enter the filenames, paths, dimensions, and alt text, and the machine will generate the code you need to add to your document. Choose from vertical or horizontal navigation, or take the output as unstructured HTML and lay it out however you want.