Hello,

I'm wanting to replace my images for my navigation (EXAMPLE (http://bestpaintballsites.com/images/paintball_games.gif))
to a "text on image" navigation system. I want to do this to increase search engine optimization.

Can someone show me how I would do this?

Here is the Table section for my navigation that I currently have. I want to use the image in the example's BACKGROUND to place the text on.

I would greatly appreciate any help. Thanks!



<tr>
<td background="images/tdbg.gif" height="30" width="100%" colspan="2">
<a href="/index.htm"><img src="images/home.gif" ALT="BestPaintballSites.com Free Online Paintball Game" border="0"></a>
<a href="/best-paintball-games.htm"><img src="images/paintball_games.gif" ALT="Free Online Paintball Game" border="0"></a>
<a href="/paintball-news.htm"><img src="images/news.gif" ALT="Paintball News" border="0"></a>
<a href="/best-paintball-stores.htm"><img src="images/stores.gif" ALT="Online Paintball Store List" border="0"></a>
<a href="/best-paintball-manufacturers.htm"><img src="images/manufacturers.gif" ALT="Paintball Company" border="0"></a>
<a href="/best-paintball-links.htm"><img src="images/links.gif" ALT="Paintball Web Site Links" border="0"></a>
<a href="/contact.htm"><img src="images/contact.gif" ALT="Contact BestPaintballSites.com" border="0"></a>
</td>
</tr>

You can specify a CSS style for that.


.navigation {
background-image: url(insert url to background image);
font-family: Arial; (or whatever you want)
font-size: 12px; (whatever you want - you can also use ems)
font-color: blue; (or whatever you want)


Then use span tags to use that on the page.

<span class="navigation">Test</span>

first try title attributes in your href's and see what happens