How to Make HTML Forms for your Website

Jan 5
13:30

2009

Mircea Ionescu

Mircea Ionescu

  • Share this article on Facebook
  • Share this article on Twitter
  • Share this article on Linkedin

Follow this example to make HTML forms for your website. Each line is explained and can be easily changed to fit your needs.

mediaimage
Your website visitors often want to contact you. For support,How to Make HTML Forms for your Website Articles to inquire about a product, for link requests or even just to say hello. Many website owners just list their email address, so visitors can write to them. This way of posting contact details is very common, but it has a major drawback: spamers harvest websites searching for email addresses. Once your email gets into their list, you start receiving unwanted ads, various shady discount offers and even viruses. The safest way to allow your visitors to contact you is to include a web form on your website. Doing this is not that complicated, but it requires a certain degree of HTML knowledge and access to your website source. Below is a small HTML form that includes only 3 fields: Name, Email and Message. Name: Email: Message: This form uses "mailto" function to send the filled data to the specified email address. Let's break this HTML form into pieces, line by line:1. This line includes the beginning of the tag and the email address that will receive the message. The only thing you should modify is the email. 2. Name: This line contains the first field from your contact form: an edit box, "name", that users will use to write their name and a label describing that field. You might also have noticed some properties of the edit box: size currently 10 and the maximum allowed length that is 40. "" is the HTML tag for new line.3. Email: Similar with the line above, it is an edit box for your visitor's email address. This field is very important because you will use this information to contact your visitor. You can also modify the size and maxlength property of this edit box.4. Message: This field will contain the message body. It's not an edit box anymore, because we needed more space. This HTML field is named . You can modify its height and width by changing the values for "cols" and "rows" properties. 5. This is the button visitors will press to send you the message. You can change the "value" property from "send message" to anything you want. Don't forget to close the form tag by adding at the end of your HTML email form script. This method of building a HTML form for your website has a minor drawback: your email address is still visible. It still can be harvested. To hide it, you would need more programming skills, to include the mailto command into a php function. But don't worry, there is another way. A simpler and faster way to have a HTML form, and it doesn't require any programing skills at all. It works even if your server doesn't support php, and you can benefit from powerful features like receiving attachments, multiple recipients, field validation, message history and anti-spam defence. You just use an online wizard to generate your HTML web form, and then copy-paste the code on your website.