GRC 175 Class Lessons

Lesson 10—HTML Forms

Resourcse

There are a number of free form processors that allow you to add forms to your web site without any CGI programming.

Check out allforms at mailjo.net.
Free signup here.
Form to email with auto-responders and other form handling services which are feature rich and yet easy to use for both novice web users and experienced web designers.

Terminoloy

CGI (Common Gateway Interface)

A set of rules that describe how a Web Server communicates with another piece of software on the same machine, and how the other piece of software (the 'CGI program') talks to the web server.

User Feedback

Email is the easiest to set up of all of the ways to get feedback from site visitors. This is done simply by creating a link in this form: >a href="mailto:accountname@emailserver.com"<

A form is another way to give visitors an easy way to communicate with you and for the site to collect data from its visitors. It provides a very easy and dynamic way to give feedback to the web site and is one of the more important sources of interactivity on the Web. It can provide such site features as:

• surveys & questionaires
• guest books
• tests
• user questions
• order forms
• reservations
• automated responses
• feedback forms
• contact forms
• signup forms
• file upload

Form Processing

As explained in the text, the information which the user inputs into the various form elements must be processed so that they are received in a useable form. A script is required to process the form data, usere done on the server, not on the client machine.

These technologies (server-side scripts based on Perl, VBScript, JavaSciprt, Java, C++; Macromedia ColdFusion, ASP, ASP.NET, PHP and Java Server Pages or JSP) are beyond this course. They require the skills of a programmer usually to set up and manage.

PHP is the technology used in the Web Design & Publishing III course offered at CSN, where the designer learns to set up the back-end of the web site to process forms using a database based on MySQL.

A free form-processing service is referred to in the sidebar which beginners can use without having to set up the server-side scripts or databases.

Form Elements

It can be difficult to get your forms to behave the same in all browsers. It is best to develop your form to the browser that displays them at the largest size. (See the advice the WebMonkey gives.)

In this course, we learn to desire and create the forms (the console used by the client). But after you have designed your form, it will not be functional. For the form to be functional, you'll have to run a CGI (Common Gateway Interface) script on the server side.The HTML just creates the appearance or the interface of a form.

Here are the basic HTML tags used in forms. To see how to set up the various kinds of form elements view the GeekManuals tutorial and read Chapter 15.

Creates a form
<form></form>

Creates a scrolling menu
<select multiple name="NAME" size=?></select>
Size sets the number of menu items visible before you need to scroll.

Sets off each menu item
<option>

Creates a pulldown menu
<select name="NAME"></select>

Sets off each menu item
<option>

Creates a text box area. Columns set the width; rows set the height.
<textarea name="NAME" cols=40 rows=8></textarea>

Creates a checkbox. Text follows tag.
<input type="checkbox" name="NAME">

Creates a radio button. Text follows tag
<input type="radio" name="NAME" value="x">

Creates a one-line text area. Size sets length, in characters.
<input type=text name="foo" size=20>

Creates a Submit button
<input type="submit" value="NAME">

Creates a Submit button using an image
<input type="image" border=0 name="NAME" src="name.gif">

Creates a Reset button
<input type="reset">

Listen to this audio file (WMA, 20Kbps, 2:30)] to learn more about forms.