new to HTML, need help (fwd)

Once upon a time Kim Carberry shaped the electrons to say...
>I hope someone can help. I am trying to create a homepage for a class
>project, REALLY important!!
>
>Struggling with the image maps and forms.
>Does anyone have any suggestions for understanding the more advanced
>features of html.  I am trying to make my page a table with 0 border.  So it
>is organized an looks good.  I would like to add some javascript. Anyone
>have any suggestions>?

If this is your first homepage - forget JavaScript, period.  You want to
get the page working first and make it solid.  THEN worry about glitzy junk
like JavaScript.  Remember ONLY NetScape 2.0 and up support it anyway.
Get the page working before you even think about this.

What is your audience?  I have rarely seen a page that was done as one big
table that couldn't have been done another way.  Remember that many browsers
still in use do NOT support tables.  Also many that do do not support setting
the border weight, so you will get a border like it or not.

Personally I do not think pages that are all tables look good.  If you know
your audience is small and only uses Netscape, then maybe you can do it.  If
this page is meant to be viewed by the nets then you need to consider Lynx,
Mosaic, and - worst of them all - the AOL browser.

Creative a form itself is fairly simple - the CGI programs to handle the
input is where the work goes.

For example:

<HTML><HEAD>
<TITLE>Support Email Form</TITLE>
</HEAD>
<BODY bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#b245b0" alink="#2cbfe5">
<CENTER><div align=center>
<IMG ALIGN=top SRC="../../Images/banner.emailsupp.gif" ALT="Email Support">
</div></CENTER>
<HR>
<FORM METHOD="POST" ACTION="../../../cgi-bin/formmail.pl">

<Input type=hidden name="formname"  value="Support">
<Input TYPE=HIDDEN NAME="nexturl" VALUE="../Tech/Support/suppthanks.html">

<PRE>
<STRONG>Subject for email:</STRONG>
<INPUT NAME="subject" TYPE="text" SIZE=40 MAXLENGTH=100>
<STRONG>Your Email Address:</STRONG>
<INPUT NAME="Email" TYPE="text" SIZE=40 MAXLENGTH=100>
<STRONG>Your First Name:</STRONG>
<INPUT NAME="First_Name" TYPE="text" SIZE=40 MAXLENGTH=50>
<STRONG>Your Last Name:</STRONG>
<INPUT NAME="Last_Name" TYPE="text" SIZE=40 MAXLENGTH=50>
<STRONG>Company Name:</STRONG>
<INPUT NAME="Company_Name" TYPE="text" SIZE=40 MAXLENGTH=50>
<STRONG>Phone Number:</STRONG>
<INPUT NAME="Phone" TYPE="text" SIZE=40 MAXLENGTH=50>
<STRONG>ComOS:   </STRONG><SELECT NAME="ComOS">
<OPTION value="Unknown" Selected>Unknown
<OPTION value="3.3.1">3.3.1
<OPTION value="3.3">3.3
<OPTION value="3.1.4">3.1.4
<OPTION value="3.1.3">3.1.3
<OPTION value="3.1.2">3.1.2
<OPTION value="3.1.1">3.1.1
<OPTION value="3.1">3.1
<OPTION value="3.0.4">3.0.4
<OPTION value="3.0.1">3.0.1
<OPTION value="3.0">3.0
<OPTION value="2.4">2.4
<OPTION value="2.3">2.3
<OPTION value="3.2.1R">3.2.1R
<OPTION value="3.2R">3.2R
<OPTION value="3.0.1R">3.0.1R
<OPTION value="3.0R">3.0R
<OPTION value="1.8R">1.8R
<OPTION value="1.7R">1.7R
<OPTION value="3.4.1L">3.4.1L
<OPTION value="3.4L">3.4L
<OPTION value="3.2L">3.2L
<OPTION value="Other">Other
</SELECT>
<STRONG>Hardware:</STRONG><SELECT NAME="Hardware">
<OPTION value="Unknown" Selected>Unknown
<OPTION value="PM-2">PM-2
<OPTION value="PM-2E-10">PM-2E-10
<OPTION value="PM-2E-20">PM-2E-20
<OPTION value="PM-2E-30">PM-2E-30
<OPTION value="PM-2R">PM-2R
<OPTION value="PM-2ER-10">PM-2ER10
<OPTION value="PM-2ER-20">PM-2ER-20
<OPTION value="PM-2ER-30">PM-2ER-30
<OPTION value="PM-25">PM-25
<OPTION value="IRX-111">IRX-111
<OPTION value="IRX-112">IRX-112
<OPTION value="IRX-114">IRX-114
<OPTION value="IRX-211">IRX-211
<OPTION value="OR-M">OR-M
<OPTION value="OR-U">OR-U
<OPTION value="OR-LS">OR-LS
<OPTION value="OR-HS">OR-HS
<OPTION value="MOD-2E-10A">MOD-2E-10A
<OPTION value="MOD-2E-10B">MOD-2E-10B
<OPTION value="MOD-IRX-1">MOD-IRX-1
<OPTION value="MOD-IRX-3">MOD-IRX-3
<OPTION value="MOD-10I-U">MOD-10I-U
<OPTION value="Other">Other
</SELECT>
<STRONG>Host OS: </STRONG><SELECT NAME="Host-OS">
<OPTION value="Unknown" Selected>Unknown
<OPTION value="SunOS">SunOS
<OPTION value="Solaris">Solaris
<OPTION value="Solaris/X86">Solaris/X86
<OPTION value="HP/UX">HP/UX
<OPTION value="AIX">AIX
<OPTION value="Alpha">Alpha
<OPTION value="OSF/1">OSF/1
<OPTION value="BSD/OS">BSD/OS
<OPTION value="Linux">Linux
<OPTION value="Ultrix">Ultrix
<OPTION value="IRIX">SGI IRIX
<OPTION value="Other">Other
<OPTION value="N/A">N/A
</SELECT>
</PRE>
<STRONG>What is the nature of the problem?</STRONG><BR>
<TEXTAREA NAME="Support_Problem" cols=60 ROWS=10></TEXTAREA>
<BR>
<STRONG>Submit the Support Form</STRONG><BR>
<INPUT TYPE="submit" VALUE="Send Email">     <INPUT TYPE="reset" VALUE="Trash it and start over.">
</FORM>
<HR>
<CENTER><div align=center>
<A HREF="../../index.html"><IMG SRC="../../Images/button.home.gif"></A><A HREF="index.html"><IMG SRC="../../Images/button.bottomcustsupp.gif"></A><A HREF="contsupp.html"><IMG SRC="../../Images/button.bottomcontsupp.gif"></A><A HREF="../Docs/index.html"><IMG SRC="../../Images/button.bottomdocs.gif"></A><A HREF="supp-req-form.html"><IMG SRC="../../Images/button.bottomemail.gif"></A><BR><BR>
<STRONG>
<A HREF="../../index.html"> Home</A>
<A HREF="index.html">// Customer Support</A>
<A HREF="contsupp.html">// Contacting Support</A>
<A HREF="../Docs/index.html">// Documentation</A>
<A HREF="supp-req-form.html">// Email Support</A>
</STRONG>
<BR><BR>
<H5>&#169; Copyright 1996, Livingston Enterprises, Inc.  Revised
March 27, 1996</H5>
</div></CENTER>
<CENTER><div align=center><ADDRESS>Error reports, comments, and criticism to: (<A HREF="mailto:spider@livingston.com">spider@livingston.com</A>) Please do not send support or sales issues to this address.
</ADDRESS></div></CENTER>
</BODY></HTML>


Note that I used Netscapisms in conjuntion with the align attributes.  There
should be no problem in using Netscape tags - as long as the underlying code
is solid so that other browsers will fall back and still display it ok.

This form itself (which is a support problem submission form) is really
simple, it took a lot longer to write the CGI handler that sends this to
the support mail alias.  But there are simple formail.cgi programs that
you could use, the one I use has been modified and handles mulitple forms
from a config file.

Imagemaps are another medium level thing you might want to avoid.  Is it
*really* needed?  If it is a button bar, you can do as I've done and just 
gifs the same size butted against each other.  I did this because the
button bar is different as you traverse the web, but the same gifs are
used in many places.  So the user can use the cached gifs and not have to
dl the bar from the server on each new page, just any new gifs.  It also
makes it easier on me - not having to make button bars for every page when
we add something.

If you absolutely must do an image map, you need to find out what kind
of server you are on.  The NCSA and CERN servers use different formats for
their map files so you need to know what you are on before you start work.

You might pick up a book like "HTML for Dummies" to use as a reference. It
does a fair job of listing attributes and of explaining how to make map
files for your images.  I keep it around to help explain HTML to other
people internally.

If I were you, I would make a preliminary page with no tables and no 
imagemaps - use text links.  Make sure the functionality works first, and
since it is good to have text backup to imagemaps you can keep this and
just add the image map.  You can even put the image in the first page 
without the ISMAP attribute.

If you decide for some reason it absolutely must have tables, you can
add that markup.  And then you can add the imagemap links when you have the
map table done.  At this stage you would also test the CGI with your forms.

As a last step you can add bells and whistles like Netscape tweaks and
JavaScript.

-MZ
--
Although I work for Livingston Enterprises Technical Support, I alone am
responsible for everything contained herein.  So don't waste my managers'
time bitching to them if you don't like something I've said.  Flame me.
Phone: 800-458-9966  support@livingston.com  <http://www.livingston.com/> 
FAX: 510-426-8951    6920 Koll Center Parkway #220, Pleasanton, CA 94566

Received on Tuesday, 16 April 1996 13:54:09 UTC