Building Your Own Webpage:
An Introductory Tutorial Using Netscape Composer
by Chuck Ziehr
This tutorial is designed to help a novice build a simple webpage using Netscape
Composer (a limited, but functional, WWW authoring program). Netscape®
Navigator must be loaded on your computer in order to build webpages using
Netscape Composer. This tutorial will include the use of
headings, normal text, links, and images (graphics). Although Netscape
Composer is capable of much more than these four functions, these will suffice
to get a new web author up-and-running. By mastering these four fundamental
capabilities, it will give the user confidence to explore more advanced capabilities
of Netscape Composer and maybe even to explore writing directly in HTML (Hyper
Text Markup Language).
Starting a new webpage (html file)
- Start Netscape Communicator.
- Click on the File -- New -- Blank Page. This provides a blank
white page like beginning a document using wordprocessing software.
Note on the title bar at the top of the screen that you are now in Netscape
Composer and that you have started a file that is currently "Untitled."
Anything that you type onto this page will be saved in HTML format (Hyper
Text Markup Language) by Composer, but it will be displayed on the screen
in "normal" format (with only a few exceptions). Composer is primarily
a WYSIWYG ("what you see is what you get) authoring program.
- When finished (or periodically when constructing a long page) Save
the file clicking the Save button or by clicking the File -- Save commands.
This will display a dialog box that will allow you to give the file a filename
and to select a destination for your file (a floppy disk or your hard drive).
This is the same process as saving a document using wordprocessing software.
- Once you've saved your file you can see what it will look like when
viewed on the WWW via the Netscape browser by clicking on the "Preview" button
or by clicking the commands: File -- Browse Page.
Using headings
- Key in the words that you want in your heading (for the title of your
page or a subtitle or a heading or subheading).
- Highlight (select) the words of your heading by holding down the left
mouse button and dragging it across the words.
- With the heading highlighted (selected) click on the "Paragraph style"
drop down box (usually on the left of the lowest bar at the top of the page)
or click on the Format -- Heading commands and select the level that you
desire for the heading (1 is the highest or largest heading).
- HTML automatically adds a blank line following a heading.
- For example the heading at the top of this section "Using headings"
was created as a "Heading 4."
Entering normal text
- Make sure the "Paragraph style" is set on "Normal" and simply key in
your text as you would in a wordprocessing.
- You can use tabs, capital letters, bold face, italics, and underlines
just like you would in a wordprocessor.
- You can insert line spacing by hitting the Enter key to go to the
next line.
Creating a link to another page on the WWW
- Key in the words that you want to link (hyperlink) from. For
example, suppose you wanted to link to my homepage by clicking on the words
Ziehr's Homepage.
- Highlight (select) those words (by holding down the left mouse button
and dragging across the words).
- Click the Link button or click the Insert -- Link commands.
- A "Character Properties" dialog box pops up in which you will need
to type in the "Link to" box the URL or filename of the page to which you
want to link. For example my homepage's URL is http://arapaho.nsuok.edu/~ziehr/.
- The finished link would look like this:
Ziehr's Homepage
- If the link is to a file (rather than to a URL) then in the "Link
to" box type in the path and filename for the file. If it's a file
that is stored in the same folder (subdirectory) where your webpage is stored,
then all you need is the filename.
Inserting an image (graphic)
- If you want to include a picture or map (any image graphic) in your
page, put the cursor at the place you want the image.
- Press the "Image" button or click the Insert -- Image commands.
- An "Image Properties" dialog box will pop up. Enter the URL
or local filename in the "Image location" box.
- For example if you wanted to insert the picture of the NET building
off the Netnotes website you would enter this URL in the "Image location"
box: http://netnotes.nsuok.edu/Documents/campusfall02/images/net.jpg.
It would insert the image that follows.
- If you want to continue to access the image from a remote location
(as in the NET building example above), be sure to check the "Leave image
at the original location" box in the "Image location" box. Otherwise
Composer will make a copy of the image file and store it at the same location
as your webpage.
- You can experiment with the other options in the "Image Properties"
dialog box to set such features as text alignment relative to the image,
image dimensions, and spacing around the image. You can even make the
image to be the button to reach another link.
- The "image location" can be a complete URL or simply a filename (if
the image is stored in the same location as your webpage file), just like
with a "Link" (see above).
Accessing your webpage
You have now mastered the essential commands for creating
a fully functional, although simple, webpage. It can be viewed with
a WWW browser directly off a floppy disk or your hard drive or it can be placed
on a WWW fileserver and accessed from anywhere in the world via the WWW.
- To view the webpage directly from a floppy disk or hard drive start
Netscape Communicator (or Microsoft Internet Explorer) and press the Open
button or click on File -- Open Page or simple type in the path and filename
in the "Netsite" or "Location" box.
- To publish the webpage on the WWW you will need access to a WWW fileserver
provided by a commercial ISP (Internet Service Provider) or by NSU (here at
NSU students may get a free account on the Arapaho fileserver).
- At NSU go to Personal Web Page Guidelines at the following URL http://arapaho.nsuok.edu/NSU_Policies/perspol.html
to find out how to apply for your own space on the Arapaho fileserver.
Adding more features
If you're ready to try to get a bit more sophisticated with your webpage,
a great site to help build more complex pages is reallybig.com ("the complete
resource for all web builders"). It can be found at http://reallybig.com/reallybig.php3.
This site says this about itself:
"
Welcome to the largest independent directory of Web building
resources on the Internet!
If you're looking for Web building
resources, you've come to the right place! Just follow the
subject guides below to find thousands of the best Web building
resources for Webmasters available on the Internet, including
clipart, scripts, backgrounds and more!
"
Created by Chuck Ziehr, Northeastern State
University, September 28, 1999. Last revised February 26, 2004.