Introduction to Forms

A form is simply an area that contains form fields. A form field is an object which the user can add information to – whether it be a text area, a radio button or a dropdown menu. Any web form essentially works the same way – the user fills in some information and submits a button. The form is essential if you want to know anything about your user – e.g. have them send you a mail, store information about them in your database, and so forth.

There are countless ways to set up your form and if you’ve ever spent more than 30 minutes on the web (and I assume have) you have probably used them to sign up for newsletters, do a currency conversion, or anything in between.

In this chapter you will learn the very basics of creating web forms and once you have gotten this down, you can look into all the new features that HTML5 introduces to web forms in a future chapter.

How does an HTML form work?

A web form consists two parts - the HTML ‘front end’ and a back end form processor. The HTML front end part handles the presentation while the back end handles the form submissions.
The back end of the form is usually written in languages like PHP or ASP. But don’t worry you don’t have to know any of these languages to get a working form – you can use a formmail, which is usually accessible through your internet service provider (ISP). If not, there is several free and paid services out there and all you have to do is choose one of your liking.

Here is how a form normally works, step-by-step

• A user visits your web page which contains a form.
• The users’ web browser displays the HTML form.
• The user fills out the form and clicks submits
• The browser sends the submitted form data to the web server
• A form processor script (also known as a formmail) running on the web server processes the form data
• A response page is sent back to the browser.