Email Addresses in Web Pages

You want to give your site's visitors a way to contact you by email but don't want your emali address to be abused. Here are a few ways to protect your email address when building your website.

1. Use defined users and filters

Don't use the catch all email facility. Instead define users such as enquiry@ or sales@. It's better if you can avoid the most obvious ones like info@ as some people might speculatively try these. It's best to use a person's name which does not appear elsewhere on the site.

Most email providers or email software offer you filters to use on incoming email. You define a parameter in the email and then filter out any incoming mail which does not contain it. For example, you could set your email link as mailto:[email protected]?body=security%20code%20123%20 (please%20leave%20intact%20in%20message%20body) then filter out any mail which does not contain the text "security code 123". Please note that a space is replaced by "%20" ni the mailto parameter.

This will prevent email from automated systems but you could miss out on genuine mail if the sender fails to understand this measure. Be sure to explain it well on your contact page.

It is important when using filters on an address that you don't use this address to send other mail as your replies could be filtered out. Keep one address purely for email from your website.

2. Use a form

Use a form for your site's visitors to contact you. This hides the email address in the browser but it may still appear in the HTML coding. If it does yuo can get around this by defining a subject line, e.g. [email protected]?subject=enquiry and filtering out all incoming mail which does not have this subject line.

3. Use JavaScript for links

It is possible to write the text link in JavaScript instead of HTML. The script breaks the email address down into its elements and then puts it back together. It appears just as a normal HTML link in the browser even down to the way it appears in the browser's status bar. This method keeps everything looking as the visitor would expect but protects your address from Spam harvesters, programs designed to crawl sites and find mailto links in the code.

Copy this code replacing the 4 variables user, domain, extension and link with your own information. This example uses the made up email address [email protected]. It should be obvious which parts to change and to what.

[script language="JavaScript" type="text/javascript"][!--

var user = "info";
var domain = "companyname";
var extension = "com";
var link = "Email Us";

document.write('[a href="mailto:' + domain + '.' + extension + '"]'); document.write(link + '[/' + 'a]');
// --][/script]

Please note that the square brackets must be replaced with angled brackets for the script to work. The square brackets are merely to enable me to display the coding here.

Chris Smith is a full time web developer building websites for small businesses and individuals.

Please visit his site to see live examples of these techniques in action and for further information on web design and development.

Web Development | Email Links