Creating graphic text to create fancy buttons, use fancy fonts & avoid email spam

We recommend that you avoid using graphic text on your website, because:

1. Every image adds to your website load time
2. Text in an image is not available to the search engine spiders
3. Text in an image is difficult to create and update in the future

But on occasion it can be a good idea to use graphic text, for example:

1. If you require a fancy font that is not a standard web font, IE. users do not have the font installed on their computers <link to web safe fonts>
2. if you are creating a highlight or promotional tile with coloured, textured backgounds and complex layouts that just cant be achieved with tables and standard HTML text
3. To create an eye catching button, that looks like an obvious button. IE bright coloured, and 3D
4. To display an email address link that is difficult for spam spiders to access

To create graphic text, you may use your favourite image edit software or use a free, online, button generating tool such as cooltext.com

Online button generation tools

Online, button generating tools such as cooltext.com are free specialist tools that make it easy  to create your own buttons or graphic email links
When using tools such as this, please take care to ensure that you create a button or graphic text that fits your design and does not look "silly" or unprofessional, as in the example below

Graphic email address

Spam spiders trawl the net in search of "email addresses" to harvest and sell as email lists for commercial spam.

These spiders recognise an email address in the HTML code of a page by the "@" symbol and the ".co.nz" or ".com" from the domain name.

A simple method for publishing an email address on a web page and remaining undetected by the spam spiders is to present the email address as an image.

Creating a graphic email link using cooltext.com

It can be difficult and time consuming trawling through and testing the hundreds of font, colour and size options on cooltext.com, so we have provided some presets, that are simple, & professional for you to use as a base.

Font. Eras, Category: Type 1
Text Size. 12
Text Colour. 38689D (blue)
Text Shadow. None
Button Shape. Square
Effect. Flat
Button Colour. FFFFFF (White)
Shadow. None
Mouse Over. None
Width & Height. Auto


Font. Eras, Category: Type 1
Text Size. 12
Text Colour. FFFFFF (White)
Text Shadow. None
Button Shape. Square
Effect. Flat
Button Colour. 38689D (blue)
Shadow. None
Mouse Over. None
Width & Height. Auto


Font. Eras, Category: Type 1
Text Size. 14
Text Colour. FFFFFF (White)
Text Shadow. None
Button Shape. Square
Effect. Rounded
Button Colour. 38689D (blue)
Shadow. None
Mouse Over. None
Width & Height. Auto

Launch cooltext.com