Many websites can benefit from a little interactivity. Forms allow users to enter information on everything from feedback to quizzes, and can be particularly useful for business sites – nearly every business website has a contact form, for example.

To build a functional form you’ll need a program running on your server to collect the information. Setting up the code that will do the backend functioning is beyond the scope of this article; fortunately there are a number of free scripts available for download in the programming language of your choice, so even minimal familiarity with a language such as PHP will allow you to post forms to your website.

In order to build the front-end of your form, the part that your visitors will see, you will need to begin and end with the <form></form> tags. You can modify the <form> tag with several different attributes to specify how the form should be processed. The “action” attribute tells the form where the code is located that will drive the actual form processing. The “name” attribute identifies the form for the processing code. The “method” attribute tells the code which method to use when processing the form – typically either POST, which keeps the information provided by visitors hidden after processing, or GET, which displays the information in the final URL once the form is processed.

Once you’ve set up your <form></form> tags, it’s time to fill in the form itself. You have a number of interactive options to provide your visitor, depending on the nature of the information you’re collecting. Here are the most commonly used field options:

Text fields: These provide a place for your visitor to enter a short line of text, such as a name or email address. You can create text fields with the <input type="text"> tag. Notice that the "input" tags do not have a closing tag, so to render them properly in XHTML you will have to close them internally as <input type="text" />.

Text areas: These provide a larger space for your visitors to enter text, and are often used for comments or other narrative data. You can create text areas with the <textarea></textarea> tags.

List or Menu fields: These create a drop-down list so that your visitor can select one or more predefined options. You’ll frequently see these fields in surveys; for example, a user might be asked to select their age from a series of ranges. You can create drop-down lists and menus with the <select></select> tags. Within these tags, you'll put each individual option between <option></option> tags, so a list will look something like:

<select>
<option>Name of first option</option>
<option>Name of second option</option>
</select>

Radio buttons and check boxes: Another way for visitors to choose one or more predefined items, and very common on forms. A list of check box or radio button options will take up more room on the page than a drop-down menu, but it does allow the visitor to see all the options at once. Use radio buttons if you want the visitor to select only one of the possible options (for example, if you ask for the visitor’s favorite color). If you want the visitor to be able to choose more than one option, use check boxes (for example, if you ask the visitor to indicate all of the colors he or she likes). Checkboxes use the <input type="checkbox"> tag and radio buttons use the <input type="radio"> tag.

Finally, you'll need a way for visitors to indicate that they've finished entering their information. This is normally handled through the Submit button, which you can include with the <input type="submit"> tag. Clicking this button will send the form data to your server for processing.