Site Map
Personal Info 02/05/01 9:00 pm
Ultima Online 06/26/01 5:00 pm
Links 02/05/01 9:00 pm
Programing Info 08/08/01 1:00 am
cdf123@qwest.net ICQ #82416165

The Easy Guide To Making Banners With No Artistry Talent At All

(that should spark some attention)

First you have to find a neet backround image. Preferabley in .gif format. Here's my example.

Then we need a template space to work on. Add a blank .htm file to your desktop, or where ever the image is. Change the source of the .htm file to look like this:

Notice the style= part of the image and div tags. Also notice that the height and width of the image have been set. You should see something like this:

You may want to add a background color to it to make sure you can see what the edges of the image are:

This is done by adding "background: black;" to the style= part of the image tag. Next up is Text. Every banner has some text to it. To add text to the banner simply add the following lines of code to your .htm file. Make sure you add these lines between the <div> and </div> tags or it wont show up right.

<div style="position: absolute; z-index: 2; top: 65; left: 200;"> <font face="Garamond" size=22 color="ad8e00"><i><b>Mercurio DeBlack</b></i></font></div>

You can change the face=, size=, color= of the <font> tag and also the top, and left of the <div> tag.

Ok, now that we have a background and some text, how about adding an image. For testing I'll use the ie.gif.

Images are easy to add. Just add the following line to where you put the text line.

Be sure to check the z-index in the style= of each tag. If two items are overlaping, the higher number is the one on top.

Finished? Now comes the hard part. Here is where we make the actual image file. With your completed banner on the screen, and your browser window is active.

Press "Alt+Print Screen" the "Print Screen" key is above your insert key by the number pad. This should put the screen image of your browser into the clipboard. Now open up your imaging software, MS Paint will do nicely. Now "Paste" your image. Paint will ask you to resize the image screen if it's too small, say yes. Now that your image is on screen and selected, drag it to the top left corner of the page. You may want to zoom in to get exact. Once it is in the top left corner, drag the image screen at the bottom right to line up with the edge of your image. In MS Paint this is done by clcking on the pencil tool and draging the blue square at the botom right corner to the edge of your banner. Again, zooming in is helpfull. Now you need to save it. Before you save it as a gif or jpg, you may want to try a bmp. This will ensure that if Paint screws up the save to a jpg or gif, that you dont have to redo the last part.

There, one banner made easy and by you. Enjoy.