Contact Form

Name:
Email:
Message:

A contact form like the one shown here is a safe, versatile way to allow visitors to contact you.

You don't have to reveal your email address — not even the person sending the message needs to know it.

It is also a very user-friendly method. The visitor simply enters their details and message then clicks the button. Unlike email hyperlinks, the user's email client does not have to be used at all.

If you want to get fancy, forms also allow you to add extra fields such as drop-menus, checkboxes, etc. This is great for feedback forms, order forms, etc.

The downside is that a contact form is a lot more difficult to set up than an email link or JavaScript solution. If you are new to forms, you'll have a bit to learn. This page only provides a quick overview and pointers to get you started.

Notes:


How Forms Work

A web form consists of two elements:

The HTML form

This is the part which appears on the web page and contains the fields the user fills out, as per the example above. The HTML for a simple form looks like this:

<form action="mailscript.cgi" method="post">
<input type="text" name="message">
<input type="submit" name="Submit" value="Send Message">
</form>

The form handler

This is the tricky part. A form handler is a script or program which runs on the server. When a user clicks the Submit button on a form, the information is sent to the form handler which decides what to do with it. Most contact forms use a type of script called a form-to-email script which packages the information into an email and sends it to the website owner. This way, whenever someone fills out your form, you get an email containing the message.

A form handling script is relatively simple compared to other scripts, but still beyond the scope of this tutorial. There are many variations and options, as well as different languages and platforms. A good start would be to search for "form-to-email script". Have a look at some of the available scripts and see how they work.


Things to Look Out For

Some form-to-email scripts are very basic with no configuration options, others allow you to change settings and include additional security. Any good script will include the ability to screen out certain characters and prevent the form being hijacked (i.e. limit it to your domain).

You must make sure that your web hosting package supports the script language (Perl, PHP, etc). Commercial hosting packages usually support all common scripting languages but cheap or free services may not.

Important: Many form-to-email scripts have their configuration options on the web page in the form of hidden fields, for example:

<input type="hidden" name="recipient_email" value="nospam@mediacollege.com">

This completely defeats the purpose of hiding your email address, as it will still be visible to email harvesters (and anyone who cares to look at the page's source code). To safeguard your email address you need a script which puts your email address in the script itself rather than on the web page.


Summary

Forms are certainly the best all-round performing contact method, but they do require some learning. Feel free to ask in our web design forum for more advice, but try to make the effort to learn as much as you can first.

Subscribe to us on YouTube