forms - layout    
intro
text
textarea
buttons
image
form
e-mail form
checkbox
radio
select
password
hidden
< layout >
cgi
tags
epilogue
      Take great care in laying out your forms. Think about what data you really need. Don't ask for data you can live without. Do ask for data you need to make your program work. Think about the sequence of the input fields. Put the most important first. Group fields logically. Name and address data should be put together, for example.
    Lable the fields properly with a short but unambiguous caption. Make sure it is clear which caption belongs to what field. Lable fiels that are obligatory. A bold red asterisk is very common for this purpose, or the text "(required)".

Preformatted
    If you are sure about all of this, you can start creating the form. A popular way to make a form is using the <PRE> tag. I don't use it, but it can be quite handy. Also you won't need extra formatting code, you can suffice with the labels and input fields. 

<PRE><FORM ACTION="mailto:[email protected]" METHOD="POST">
Name:           <INPUT NAME="name">
e-mail address: <INPUT NAME="email">
Subject:        <INPUT NAME="subject">
Your message:
<TEXTAREA NAME="text" COLS="40" ROWS="5">
<INPUT TYPE="submit" VALUE="Send">
<INPUT TYPE="reset" VALUE="Reset">
</FORM></PRE>
    What you will get is this. Your browser will use a monospaced font, possibly a bit smaller. Your input fields will be lined out just as you type them in the code.
 

Name           
E-mail address 
Subject        
Message
Tables
    Another method of laying out complex forms is the use of html tables. This will give you more control. Also you will be free to use any font you like. A drawback may be that you will need a lot more code. Forms are sensitive to typos, tables even more. I would prefer tables myself. But if you're not comfortable using them, you'd probably better use the PRE tag.