Web page creation help

Web Page creation help

This page is mainly for intermediate webmasters. Advanced users should proceed to the bottom of this page.

Backgrounds

Animgifs

Document

Html <html>...</html>
Inserts the html tags into the current document.

Head <head>...</head>
Inserts the HTML head tags into the current document.

Title <title>...</title>
Inserts the HTML title tags into the current document.

Body <body>...</body>
Inserts the HTML body tags into the current document.

Is Index <isindex>
Inserts the HTML isindex tag into the current document.

Style

Header <hx>...</hx>
Selecting this menu item will display another sub-menu that lists the 6 heading levels available in HTML. Level 1 is the highest (largest and boldest font), while level 6 is the lowest (smallest and lightest font). The "x" in the above heading indicates the number that is used to indicate the heading level (i.e. <h1>...</h1> is a level 1 heading).

Bold <b>...</b>
Inserts the HTML bold tags into the active document.

Italic <i>...</i>
Inserts the HTML italic tags into the active document.

Underline <u>...</i>
Inserts the HTML underline tags into the active document.

Typewriter <tt>...</tt>
Inserts the HTML typewriter tags into the active document.

Emphasis <em>...</em>
Inserts the HTML emphasis tags into the active document.

Strong <strong>...</strong>
Inserts the HTML strong tags into the active document.

Sample <samp>...</samp>
Inserts the HTML sample tags into the active document.

Code <code>...</code>
Inserts the HTML code tags into the active document.

Keyboard <kbd>...</kbd>
Inserts the HTML keyboard tags into the active document.

Variable <var>...</var>
Inserts the HTML variable tags into the active document.

Definition <dfn>...</dfn>
Inserts the HTML definition tags into the active document.

Citation <cite>...</cite>
Inserts the HTML citation tags into the active document.

Address <address>...</address>
Inserts the HTML address tags into the active document.

Forms

Form <form>...</form>
The form tags specify a section of a HTML document that will contain an interactive form which the end user can "fill out". All of the forms tags presented below must be contained within a form tag.

Input <input [options]>
Selecting this menu item brings up a dialog box which allows you to define an HTML input method. The various input method options are: text, password, hidden, checkbox, radio, submit and reset. The input dialog box dynamically displays the parameters (some optional, some required) available for each input method.

The parameters that are common to many of the input methods are name and value. The name parameter is required by all input methods except submit and reset. The name parameter is analogous to a variable name. This "variable name" identifies the data input by the particular input method to the host server which must process the data. The value parameter is required by all input methods except the text and password methods. For the text and password methods, value represents the default text that will be presented. For the checkbox and radio methods, the value parameter represents the data that will be returned if the particular checkbox or radio "button" is selected. For the submit and reset methods, the value parameter will be the label that appears on these "push buttons".

The text input method displays a text box in the resulting interactive form. Password is similar to text except that the characters that are typed into this text box are either covered or not shown so that the text entry can be made securely. Both the text and password input methods support these options: Size (measured in the number of rows by the number of coulmns which should be visible) and Max Length (determines the maximum number of characters that can be entered in the text or password box).

The hidden input method is used to pass data to the HTTP server which the user doesn't need to see or change.

The checkbox input method displays a box, which can be selected (checked) and deselected. It also usually has some text next to it to identify the function of the checkbox. Checkboxes are independant of each other. The radio input method displays a circle and usually has some text next to it to identify its function. It can be selected like the checkbox, but contigous groups of radio buttons are dependant upon each other. When one radio "button" is selected, any other radio button that was selected is deselected. In this way only one radio button in a group can be selected at one time. Both the checkbox and radio input methods support the checked option. When checked is selected, the displayed checkbox or radio button will be selected (checked).

The two special input methods are submit and reset. Both submit and reset cause a "push button" to be presented on the resulting interactive form. Selecting submit causes the data the user has input to the form to be submitted to the host system (usually a HTTP server). Selecting reset causes all input methods to be reset to their original values and cleared of any user entered data.

Select <select [options]>...</select>
Produces a selection list from the highlighted lines of text in the active document. The items in a selection list can be picked (selected) by the person viewing the form. When the Select... menu item is chosen, a dialog box is displayed which allows you to enter the parameters (some optional, some required) available for a selection list.

The name field allows you to give the selection list a name (much like giving a variable a name). The name parameter is required. Size is an optional parameter that sets the number of selection list items that will be allowed. The lines of selected text from the document will appear in the Selected text box so you can choose those lines you wish to show as selected (highlighted) to your user. Selected is an optional parameter. When checked, the Multiple check box specifies that you will allow the user to select more than one item from the selection list. This also affects the number of lines of text you can select (highlight) in the Selected text box.

Here's the before and after and how these tags are generally rendered:

selection item one
selection item two

<select name=select1>
<option>selection item one
<option>selection item two
</select>

selection item one
selection item two

Option <option>
Inserts the HTML option tag into the active document at the beginning of the selected text or at the position of the text cursor. The option tag is only useful in conjunction with the Select tags (see above).

Text Area <textarea [options]>...</textarea>
Selecting this menu item displays the Text Area dialog box where you can specify the parameters that will define an area in your form where the user can enter some text.

The name field allows you to give the text area a name (much like giving a variable a name). The name parameter is required. The Rows and Columns parameters determine the size of the text area. The Rows specify the height of the text area in terms of the number of lines of text that will fit inside the text area. The Columns parameter spcifies the width of the text area in terms of the number of text characters that will fit inside the text area. Both the Rows and Columns parameters are optional.

Paragraph

Paragraph (Ctrl-P) <p>
Inserts the HTML paragraph tag into the active document.

Line Break (Ctrl-L) <br>
Inserts the HTML line break tag into the active document.

Horizontal Rule (Ctrl-H) <hr>
Inserts the HTML horizontal rule tag into the active document.

Preformated <pre>...</pre>
Inserts the HTML preformated tags into the active document.

Quoted <blockquote>...</blockquote>
Inserts the HTML quoted tags into the active document.

Listing <listing>...</listing>
Inserts the HTML listing tags into the active document.

Plain Text <plaintext>
Inserts the HTML plain text tag into the active document. All text following this tag (to the end of the document) will be rendered in a fixed-space font.

Links

Inline Image... <img [options] src="URL">
Brings up a dialog box for entering the URL and other attributes used in defining an inline image.

The URL field lets you enter the URL (Uniform Resource Locator) for the image you wish to include (inline) into your document. The graphics file format is usually either GIF (Grafic Interchange Format), XBM (Xwindows BitMap), or JPEG . The last 20 URLs that have been entered are available in the drop-down list of the URL field. URLs may also be built by clicking on the Build... button (see the section below on building URLs).
HINT: An easy way to import URLs into HTML Writer is to use the Clipboard to copy URLs from other Windows programs - like Mosaic - and paste them into the URL field.

The Alternate field allows you to enter some text that will apear when the program reading/displaying the HTML file is either not capable of displaying inline images or is setup to not display them.

The Alignment buttons determine where the text following the inline image will be placed. Selecting the Middle or Top alignment options inserts a align=Middle or align=top option code. Bottom alignment is the default so no align option code is inserted when Bottom is selected.

Selecting the Is Image Map check box indicates that the inline image is "mapped". A mapped image is one that is divided into a number of regions which when selected (i.e. clicked on) cause some action to be taken (i.e. jumping to another HTML document). The handling of mapped images is done by the HTTP server, so merely selecting the Is Image Map option will not automatically cause the image to be actively mapped.

Target... <a name="anchor_name">...</a>
Brings up a dialog box for defining a hyperlink target (named anchor) for Local and Remote hyperlinks to jump to. Simply enter a name for the target in the Target Name field. This name will be put in place of anchor_name in the above example. All Target Names entered in this dailog will appear in the drop-down list of the Local hyperlink dialog box (see Local below).

Local... <a href="#anchor_name">...</a>
Brings up a dialog box for entering the URL and other attributes used in defining a local hyperlink. You can either enter a Target Name or select one from the drop-down list accessed by clicking on the button with a down arrow on it.

Remote... <a href="URL#anchor_name">...</a>
Brings up a dialog box for entering the URL and other attributes used in defining a remote (full) hyperlink. Remote links are those which point to other HTML documents (files) or any of the many Internet resources available through the WWW. Any text that was highlighted before selecting this funtion will appear in place of the ... argument in the above example and will be used as the "trigger" which initiates the hypertext jump.

The URL field is used to specify the URL (Uniform Resource Locator) of the resource you wish to create a "link" to. The last 20 URLs that have been entered are available in the drop-down list of the URL field. URLs may also be built by clicking on the Build... button (see the section below on building URLs).
HINT: An easy way to import URLs into HTML Writer is to use the Clipboard to copy URLs from other Windows programs - like Mosaic - and paste them into the URL field.

The Target field allows you to enter (by typing or selection from the drop-down list) a target name (named anchor) which is found in the destination HTML file you wish to jump to (see Target above). So not only can you jump to another HTML document, you can also jump to a specific location in that document.

Building URLs
Selecting the Build... button next to any of the URL fields in HTML Writer will bring up a dialog box which helps you "build" a URL (Uniform Resource Locator). In the URL Builder dialog box, you can enter (or select from a drop down list) the Resource, Host, Port
, Path and Filename for a URL.

The Resource drop-down list contains all of the Internet resources available through the World Wide Web (WWW). The Host field is where you enter the IP address of the computer which has the resource you wish to access. The Port field allows you to specify the port number you wish to use for the specified Host. (NOTE: You will usually not have to supply a port number unless the resource you are accessing requires the use of a specific port.) The Path field is where you enter the directory path to the file you wish to access on the specified Host. (NOTE: The last 20 Host and Path entries are available in the drop-down lists of the Host and Path fields.) The Filename field is where you enter the name of the file you wish to access.

If a Resource is not specified, HTML Writer will assume you wish to construct a relative URL, otherwise an absolute URL will be constructed. Here's an example of each:

Absolute: Resource - http
Host - my.host.edu
Path - my/home/dir
Filename - my_page.html
Resulting URL - http://my.host.edu/my/home/dir/my_page.html

Relative: Path - my/home/dir
Filename - page_two.html
Resulting URL - my/home/dir/page_two.html

Once the user has jumped to the first HTML document (usually with an absolute URL), subsequent jumps need only specify the URL information that is new by using a relative URL. For example, if all your HTML documents are in the same directory and a user jumps to your "home page", subsequent jumps from your home page to other documents in that directory need only supply the filename.

Lists

List Item (Ctrl-K) <li>
Inserts the HTML list item tag into the active document at the position of the text cursor or in front of the highlighted text.

Bulleted <ul><li>...</ul>
Produces an unordered (usually bulleted) list from the highlighted lines of text. Here's the before and after and how these tags are generally rendered:

list item one
list item two

· list item one
· list item two

Numbered <ol><li>...</ol>
Produces an ordered (usually numbered) list from the highlighted lines of text. Here's the before and after and how these tags are generally rendered:

list item one
list item two

1 list item one
2 list item two

Menu <menu><li>...</menu>
Produces an unordered (usually bulleted) list from the highlighted lines of text. Here's the before and after:

menu item one
menu item two

(I'm not exactly sure how this tag is rendered since NCSA's Mosaic for Windows doesn't recognize this tag.)

Directory <dir><li>...</dir>
Produces an unordered (usually bulleted) list from the highlighted lines of text. Here's the before and after:

directory item one
directory item two

(I'm not exactly sure how this tag is rendered since NCSA's Mosaic for Windows doesn't recognize this tag.)

Definition <dl><dt>...<dd>...</dl>
Produces a definition list from the highlighted lines of text. Since a definition list consists of a term and its definition, you should select an even number of lines (term and definition pairs). If you tag an odd number of lines, HTML Writer will warn you that a definition is missing. Here's the before and after and how these tags are generally rendered:

first term
first definition
second term
second definition

<dl>
<dt>first term
<dd>first definition

<dt>second term
<dd>second definition
</dl>

first term
first definition
second term
second definition

Term Item <dt>
Inserts a HTML term item code into the active document. Only useful within a definition list.

Def. Item <dd>
Inserts a HTML definition item code into the active document. Only useful within a definition list.

Others

This section discusses functions available under the HTML | Other menu.

Special Character < > &

Since the greater than (>), less than (<), and ampersand (&) characters are used to denote HTML tags in a document, this menu (and sub-menus) will insert the HTML codes which represent these special characters into the active document at the position of the text cursor. Here's how it works:

Sub-menu	HTML Code	How it will be interpreted
<	< <	<
>	>	>
&	&	&
"	"	"
No Break Space		adds a space between words that should not be seperated. (i.e. no word wrap)

Extended Characters... &...;

Inserts the HTML codes for displaying extended characters (ISO Latin 1). For example, selecting Á from the dialog box will insert Á into the active document at the position of the text cursor. The program reading the HTML code Á should output it as Á.

ASCII Character... &#xxx

Inserts the HTML code for displaying an ASCII character. The "xxx" above is the decimal number for the ASCII character one wishes to display (i.e. &#136 will cause the carret symbol "^" to be displayed).

Comment <!-- ...>

Inserts the HTML comment tags into the active document. Any text enclosed by this tag (put in place of the "..." above) will not be shown when interpreted by an HTML document viewing program. Obviously this is so you can put comments into a document for your use that will not be seen by the end reader.

All this info is from HTML writer's help file. I highly recommend this programm!! Download

For more experienced users, a very useful site that allows you to get resources, such as mailing lists etc... is available completeley free at:

Home	Free Programs	Cool Links	Web Page creation help
Great literary figures	Value.com	Search	Email