Interactive Web pages



Q How do you get a home-made Web page to bring up:
1) a fixed e-mail address, and 2) a simple yes/no interactive form (which may also ask for text information) which then e-mails the answers and/or text information straight to an e-mail address in such a simple manner that you don't have to contact your service provider and ask for permission to include it?
The form(s) shouldn't be so large that it exceeds the set MB limits imposed by the service provider and also allow for other information such as the Web page files to be included in the same amount of space provided by the service provider.
- Juanita

A Since the Web is all about communication, it is natural to want to interact with the people who visit your Web pages. With a feedback mechanism operating from your Web page, users can respond to your site, identify problems, provide compliments or suggestions, or simply ask a question. There are, as you've identified, two ways to collect information or feedback via your Web page. The first is to provide a clickable e-mail link directly on your page; the second is to create a form. Neither method will significantly increase the amount of space your files use on your service provider's server.
Creating e-mail links. The advantage of this method is that it is quick and easy to implement. The disadvantage is that communication is one-way, and you have little control over the type of information that you receive from users. Clicking the link starts an e-mail program which visitors can use to e-mail you directly. To create an e-mail link, add a line similar to the following to your Web page:
E-mail: <A HREF="mailto:you@your.e-mail.address">Your E-mail Address</A>
Substitute your e-mail address after mailto: and between the <A HREF></A> tags.
Forms. Many of the forms you encounter on the Web rely on a CGI (Common Gateway Interface) script or program to collect user input, process it into useable information, and send it on to the page's owner. The CGI program is located on a Web server, and -- since it is executable -- can be a security risk. Consequently, service providers often take a number of security precautions with CGI, such as restricting access to the CGI directories and monitoring which CGI programs are installed. Usually you have to ask your service provider for permission to install a CGI program or script on their server.
However, you can avoid the hassle of CGI-based forms altogether by creating a client-side form which collects user input, concatenates it into a long string of text, and then e-mails it to you. There's some work involved in editing the e-mailed information into a useable format with a word processor, but if you want to avoid CGI programs and are only expecting to receive small amounts of feedback from your Web page, it's not too strenuous.
Here's how to set up a simple client-side form.
Create a new Web page and add the following text:

<HTML><HEAD>
<TITLE>Feedback Form</TITLE>
</HEAD>

<BODY>
<H2><I>Have Your Say!</I></H2>
Please tell me what you think about my Web page. I appreciate your feedback.<BR>
<FORM METHOD="POST" ACTION="mailto:you@your.e-mail.address">
<TABLE BORDER=0 WIDTH=100%>
<TR>
<TD WIDTH=30% VALIGN=TOP>Name: </TD>
<TD WIDTH=70% VALIGN=TOP><INPUT NAME="name" TYPE="TEXT" SIZE="50"><P></TD>

<TR><TD VALIGN="TOP">E-mail Address: </TD>
<TD><INPUT NAME="email" TYPE="TEXT" SIZE="50"><P></TD>

<TR><TD VALIGN="TOP">Comments: </TD>
<TD><TEXTAREA NAME="comments" ROWS=10 COLS=50></TEXTAREA><P></TD>

<TR><TD VALIGN=TOP>How did you find this page? </TD>
<TD>
<INPUT TYPE="RADIO" NAME="source" VALUE= "Engine">Search Engine<BR>
<INPUT TYPE="RADIO" NAME="source" VALUE= "OtherPage">Link from another page<BR>
<INPUT TYPE="RADIO" NAME="source" VALUE= "Accident">By Accident<P>
</TD></TR>

<TR><TD VALIGN=TOP>Have you visited this page before?</TD>
<TD>
<INPUT TYPE="RADIO" NAME="visits" VALUE= "Yes">Yes<BR>
<INPUT TYPE="RADIO" NAME="visits" VALUE= "No">No<BR>
</TD></TR>

<TR><TD>&nbsp;</TD>
<TD>
<INPUT TYPE="SUBMIT" VALUE="Submit Form">
<INPUT TYPE="RESET" VALUE="Reset Form">
</TD></TR>
</TABLE>
</FORM>
</BODY>
</HTML>

Edit the ACTION option in the <FORM> tag to include your e-mail address immediately after the "mailto:" without a space. The ACTION attribute tells the browser to post the information from the form to your e-mail address when the Submit button is clicked.


This is how the code looks when viewed in a Web browser


With a little knowledge of HTML form tags you can customise this form to suit your needs. It works with Netscape browsers and Internet Explorer 3.01 and later. The table tags are included to help position the elements of the form in an attractive manner on the page, and are optional.
- Belinda Taylor

Category: Internet
Issue: Mar 1998
Pages: 147-149

These Web pages are produced by Australian PC World © 1997 IDG Communications