How do I add a button to my web page?

The pushbutton effect from moving the mouse pointer over the button is called "rollover".

There are two different ways of generating rollover effects in your web pages. One uses JavaScript and the other uses CSS. Either way works in almost all browsers and doesn't need anything special on your web server. The basic idea is to use the events that are generated by the mouse movement to load one button image or the other. This is the (slightly modified) HTML/Javascript that is used on the glassy button web page:

*** this first part can appear anywhere in the html body preceding the button:

<script type="text/javascript"> <!--
var cacheonimg = new Image ();
var cacheoffimg = new Image ();
cacheonimg.src = 'defaultglassy_1.png';
cacheoffimg.src = 'defaultglassy_0.png';
// --></script>

*** and here is where the button is created with <a> and <img> tags:

<a href="the http://stuff/goes/here"
 onMouseover="document.buttonimg.src=eval('cacheonimg.src')"
 onMouseout="document.buttonimg.src=eval('cacheoffimg.src')">
<img src="defaultglassy_0.png" name="buttonimg" width="260" height="30"
alt="Classy Glassy Buttons!">
</a>

That's all there is to it! Most browsers will work fine with this. Be sure to change the width and height to match the size of your button images and use the appropriate image names.

You could also find *tons* of examples by googling for the following keywords:

rollover javascript