Learning to write a web page

 _________ 
|name:~~~~|
|tel:~~~~~|
|  ~~~    |
|~~~      |
|~~~~~    |
|_________|

Forms

 _________ 
|name:~~~~|
|tel:~~~~~|
|  ~~~    |
|~~~      |
|~~~~~    |
|_________|

Forms are a way of communicating with your readers, 'the interactive part of HTML'. If you want to run scripts with information from your reader, you will have to use forms.

Tags

The form itself is enclosed with the <form> and </form> tags. Then there are the various ways of getting <input>, through <input type="...">. Possible input types are: text, button, checkbox, radio, submit, reset, and probably more.

Larger text areas can be made with <textarea> (and its closing tag), where you can decide on the size of the box through attributes rows and cols.

Menus where your reader can choose from options you provide, can be made with <select> (and </select>), and then the list of <option>s (each with a closing </option> tag).

If the form is to reach you by email, you add 'method="post"' and 'action="mailto:your-email-address"' as attributes in the <form> tag.

Because you will want to do something with the information your reader provides, you will have to give all the tags (and your forms!) a 'name="..."' which your scripts can pick up.

Examples

Check the HTML for the examples with the View Source option from your browser.

Simple form which does not do anything

What is your name:

What is your address:

Post code: City/Town:

Menus and feedback

What is your name and address:

What is your email address:

Here is a list of items about which we can send you information; please choose one only:

Checkboxes and radios

We can send you information about the following (tick as many as you like):

KKweb
Kids' Kabin
Kids' Kabin 2
Our School

Are you interested in helping out with KKweb?

Yes, please
No, thanks

Back to contents


What do we need? HTML and the .html file Tags Formatting Head and body
Size and shape Colour Colour table Colour wheels Pictures
Special characters Special characters table Hyperlinks Combining and nesting tags Lists
Tables Frames Style sheets Maps Forms Scripts Publicising (meta tags) Bits and pieces

Course created by Maria Turkenburg
TurkenburkiePower!!!©2001-2005