Page Building Tutorial Section 6

Text/Note Pad Page Building Tutorial

We are now going to discuss and demonstrate the uses of navigation systems below, and how to properly install some basic JavaScript codes. There are several different types of codes, so we will use most common for our demonstration purpose.

Lots of people get very overwhelmed when you start discussing JavaScripts. There is really nothing to be overwhelmed about. JavaScript is just a simple language instructing the browser how to display and function certain codes. Placing codes already generated is a breeze, writing JavaScript language is a totally different subject all together, and can be very challenging.

Navigation Structuring Styles

This is an area of self choice. You should consider how large your Web Site is going to be, and how to best present layout of links.

We will provide you with 4 different options in this lesson for your own use.

1. Download our Banner/Button/Logo Maker Software.
( Create Logo's, Banners, and Buttons for navigation linking the images. )

2. Use our Drop Down Navigation Menu Generator.
( We will use this during this tutorial lesson. )

3. Use our online affiliate JavaScript Navigation software.
( Has a help file and easy to use operation software. )

4. Use text as hyperlinks to pages as discussed in section 4.

We will use our Drop Down Navigation Menu Generator for our navigation, and text links demonstrations during this tutorial lesson. We want you to fully understand how easy it is to install JavaScripts and installing them for an interactive Web Site.

Let's Begin A JavaScript Installation

Let's use an example of your Web Site having 3 pages (or more).

We will have already made 3 pages prior (not required, but useful, you can make pages blank for now.) from lessons already discussed.

Let's call our pages like this below:
1. Home
2. About Us
3. Favorites

Now let's give URL address for each page:

1. Home="http://www.yourdomain.com/index.html"
2. About Us="http://www.yourdomain.com/about.html"
3. Favorites="http://www.yourdomain.com/favorites.html"

Note: It is not necessary to make all URL end tags HTML, the attribute .HTM will work as well as this is earlier HTML language recognition.
Summary: .HTML or .HTM will work properly.

We have 3 URL's to proceed to our Drop Down Menu Generator to get the codes for our navigation. When you have completed getting codes for your navigation we will proceed. Get codes now.

Now you have the codes to install your first JavaScript code effect.

You where given a <JavaScript> <JavaScript> code to install in the <HEAD> area. This code should go right under the meta tags you installed on your pad, and before your closing </HEAD> tag.

You where also given a <Form> <Form> code to install in your <BODY> section. This code will be placed where ever you would like for viewers to see your navigation. You will align this navigation using the <p> align tag as you learned in lesson 4.
Your code should look something like this now:

The Java Script Code To Insert In Head Below:
<SCRIPT>  </script>

The Form Code To Install In Body Below:
<center><FORM NAME="dropdownnav"> <SELECT NAME="drop"> <OPTION SELECTED>Your Navigation <OPTION value="http://www.designerwiz.com/>Home <OPTION value="http://www.designerwiz.com/about.htm">About <OPTION value="http://www.snapbuilder.com/">Community Host Builder </SELECT> <input type="button" onClick="change()" value="Go"></FORM></center>

Your Pad Editor should look something like this now depending on colors you choose to use.

Now you have successfully installed a JavaScript code. Was there anything to be overwhelmed about? We hope you have said no. If not, just go back and slowly read over this tutorial lesson.

We will move onto installation of different JavaScripts and page effects and various tools on next tutorial page.