Don’t you just hate those default form submit buttons? No hover effect, no match with your site design. Yuck.
This article at www.digital-web.com explains the solution - use the <button> tag and add a little javascript to cover Internet Explorer’s lack of support for the :hover pseudo class.

This virtual Christmas card demonstrates the power of this technique.

Many websites seem to make it hard for you to contact them, sometimes in an effort to fight spam and sometimes through bad design or lack of thought.

They make you use a really complicated form that asks for the information they want, rather than what you want to give. Forms have required fields that a casual browser doesn’t need to fill in or confusing anti-spam captcha’s. Email addresses are hidden or obscured in an effort to confuse email scrappers. You can’t find the phone number or address of the company.

Many web designers, both professional and amateur, forget that everyone else doesn’t spend 10 hours a day using the internet. A lot of internet users don’t understand why you might want to protect yourself from spam and may not be great at typing. Some people don’t have the patience for forms or have a unique enquiry that a form can’t handle and want an email address, or they may just want to pick up the phone and speak to someone.

Web designers and internet marketers should make the most of the hard work involved in getting visitors to a site and make it easy to convert them. This is obviously very important if they are selling a product or service that requires potential customers to get in contact. Nothing should hinder them in any way.

So here are a few ideas.

Provide a phone number, email address and enquiry form(s). Anti spam measures should be hidden and take place in the background.

Link to a privacy policy wherever contact information is shown. Make it very clear that a user’s information will not be shared.

Don’t write email addresses in a none-email format. If you must do something, make the email address an image and encrypt the mailto: link. (And beef up your server side spam protection and the filters in your email client).

Provide multiple forms, one for casual enquiries (e.g. with only name, email and message fields) and a more detailed form for more serious enquirers (it could be linked from a product detail page) - call it an order form. Protect these forms from spam bots with server side scripting, or dummy form fields.

Try providing a form with only one field where users can submit their email or phone number so you can contact them.

There are a number of free PHP (and ASP) contact forms and captchas for preventing spam submissions through your contact forms, but what if you don’t have PHP? Or, you just want to stop the spam and not make your human visitors jump through hoops?

The solution I found is to use this anti-spam solution using fake form fields and combined it with the FormMail CGI script from Matt’s Script Archive. (CGI is available on even the most basic hosting package).

In the HTML contact form, add a fake textarea field with an obvious name such as ‘comments’ or ‘message’. Rename the genuine field to something less obvious or completely irrelevant, for example ‘wibble’.

Create a CSS class with the rule ‘display: none;’ and apply it to the fake field. This will make it invisible to human users and they won’t be able to enter text into the fake field. However, the spam bots will spider the code, ignore the styles and fill the fake field with the usual links to crappy websites.

All that remains is to test for content in the fake field in the FormMail CGI script to decide if a submitted form is spam and if so, not send it.

To do this, open the FormMail.cgi file in a text editor and find the send_mail function. The whole function needs to be enclosed in an if statement that checks whether the fake ‘comments’ field is empty. The code to accomplish this is:

sub send_mail {

# Only send email if spam trapping field is empty #
if ($Form{'comments'} eq '') {

# ....rest of send_mail function.... #

# closing bracket for spam if statement #
}

}

Taking it further

It needn’t just be the comments textarea field that is faked, you can fake any other field in a form and add additional tests to the CGI script to see if they are spammed.

One potential problem is what happens if the normal human user has disabled stylesheets, is using an old browser that doesn’t support them or is using an alternative stylesheet for accessibility reasons? They could see the fake fields, fill them in and find their mail is not sent. The answer is to put a note next to the field explaining that it is to there detect spam and that it shouldn’t be filled in. (Or you could set the default text in the field to something similar). Give the text the same class as the fake field and it will disappear when viewed using your default stylesheet.

(You can also make the default size of the fake fields as small as possible to discourage users from filling them in).

Another problem is that the spammers may learn to recognise display: none; and realise that they are filling in hidden fields. However, there is no sign of this yet and if it is found out, there are alternative ways of hiding fields such as large negative indents, which could extend the usefulness of the technique.