Forms are used all over the web.

Whether you're signing up for a Treehouse account, filling in a personal profile, or

ordering something from your favorite store,

you're constantly filling in forms online.

Let's learn more about forms so you can use them in your next website.

A [SOUND] form could look like empty boxes, [SOUND] choice boxes,

radio [SOUND] buttons, drop-down [SOUND] menus and text [SOUND] areas.

No matter what kind of form you're making,

you're going to want to wrap your questions in form tags.

Looking at a preview of the code in the browser,

you can see that we have these blank text areas to fill in.

Switching over to our HTML document,

you can see it's a form element we're using to make our Web page.

The form starts up here at the top of the body and

ends down here at the end of the inputs.

Inside our opening form tag is the action attribute.

This is used to specify the location that the form data should be sent to.

The action attribute tells the web browser where to send the form information so

that the web server can perform some action such as saving data.

For this, you would have to know some server-side programming like PHP,

Ruby, or Python.

And in this course, we don't need to send or receive data for a program to work.

So that's why we're gonna leave it blank.

Method goes with the action and is used to tell the web browser whether the form is

sending data to put into a database or get information from a server.

You use post when ordering a product and

get when searching a database for information.

Well, post and get are more complicated than this.

You can think about post as posting data to a database, and

get as fetching existing data from a web server.

If you're interested in learning more about post and

get, I'll put some information about this in the teacher's notes.

The next element is called a div.

Div is short for document divisions, and has historically been the most

commonly used element for defining the structure of an HTML document.

Divs are a great way to group a number of other elements together.

By creating div elements in your HTML and giving them ids or classes,

it will enable you to target these specific elements using CSS.

Down here, we call all of the divs for each column in our game choice_bucket.

This will make sure when we're writing our CSS, we can identify these and

style them the same way.

The main form control element that we use in our web form is the input element.

This element is a jack of all trades kind of element because it's used to

collect all sorts of data from your users.

You can specify what sort of data you want to collect using the type attribute.

By default, all input elements have the type text.

However, it's always good to be explicit when writing code and

it's good to specify the type.

Now, we didn't do that here, but

it would be good practice to go through each input and add a type attribute.

It would also be interesting to look at what each of

these different types look like in the browser.

That was a lot of new information about HTML, but not nearly all of it.

For more examples of form elements,

I've linked the Mozilla Developer Network page on forms in the teacher's notes.