|
|
|
|
Using Netscape Composer for Web Development
|
|
|
Netscape Composer is a component of the Netscape Communicator program, version 4.x and higher. Composer is easy to use and allows new users to create simple web pages without learning any HTML codes. If you do not have Netscape Communicator, version 4.x or higher, you can download it from the Netscape home page. |
When you develop web pages, you will want to stay well organized. It is very easy for your page to grow well beyond your expectations. Listed below are hints on how to stay organized and protect yourself from future headaches!
Keep all your files in one folder! Create a directory
or folder called "www" on your disk. This is where you will
place your HTML files (web pages). Images:
Inside that "www" folder, create another folder called
"images". Put all image files in this folder before you insert
them into your page (see Images). You
must keep your files organized so you can easily upload them to you
internet host site.
1.) Easiest way is to start Composer by opening Netscape
Communicator. From the menu bar click on Communicator, slide
down and select Composer. This will start the program and open
to a blank page.
Create New Pages:
Option A: Goto File/New menu. Select Blank
Page. A new blank page will open up and you are ready to
roll!
Option B and C: Other options under File/New menu
- Page from Template opens any text document to use as the basis of the page. Click the Netscape Templates button to look at samples at the Netscape site.
- Page from Wizard connects to the Netscape home page and provides a fill in form that walks through creating a page.
OR
Open Pages in Progress:
1. Start the Composer Program (see #1 above).
2. Use File/Open Page in Composer to re-open a page you wish
to continue working on it from your disk.
3. Choose File/Save As to locate where you are saving the
work. (disk) Continue to Save.
At first the directions for saving files and images will sound very complex. You will really get the hang of it after only 2 or 3 times. There are not as many steps as it feels like. Remember, save all files and pages into the www folder and images into the images folder within the www folder.
Choose Save As from the File menu. Your lead document, the page
that will link to all the other web pages, should be named
index.html Web page names should be lower case, no
symbols or spaces and 8 characters or less.
Any linked documents, or other pages you create later can be named
anything with a .html extension. For example, lesson.html
index.html is customary for the lead page.
* Remember: file names should by lower case, no symbols or spaces and 8 characters or less!
Save often and frequently to avoid losing work. Look at
where you are saving your work.
Is it always on your disk in your www directory? If not you will have
multiple copies
of your page and lose work you do. Images should be saved in
the "images" folder that is within your www folder.
When you visit a site on the Internet, you can see the title of that site on the top bar of your browser. For example, look at this page. The title should appear as Using Netscape Composer. You will need to add information to change the title on your page to what you want it to read. You can also add your name as author and a brief description.
Select Format > Page Properties
Type in a Title of your page in the general setting.
In the color settings, select and image file to tile as a background or click on the boxes next to background color, text color, link colors to select colors for each.
Option A: Just Type...: Click your cursor in the Netscape composer window and begin typing the text of your page. Adding text is very similar to using a word processor. VERY IMPORTANT: HTML code hates blank spaces. You can add one or two spaces between words, but no more. Use alignment and tables to arrange pictures and text across your web pages.
OR
Option B: Copy and Paste:
Quit the word processing or text editor program.
1.) Roll your cursor over each item in the format tool bar that
appears at the top of the Netscape composer window. Pause a
moment until the description appears of what it does.
2.) Selecting text and clicking these buttons will apply each
characteristic.
|
Colored Text and Font Size Example |
Paragraph styles allow you to choose heading sizes as you can see in the example. Heading 1 or Heading 2 are used as the opening heading. Heading 3 or 4 is usually used for sub-headings. Normal will appear as whatever Font and Size you choose. Font color can be changed by selecting text and picking a
color from the palette that appears. The current selection
is black. List Items appear as bulletted items. |
Highlight text on your web page and select the following buttons
for the given effect.
|
|
Bold text |
|
|
Italic text |
|
|
Underlined text |
|
|
No style: Use to remove an unwanted style or link. |
|
|
|
|
|
|
Indent examples
Decrease Indent of a line
or paragraph
Alignment Examples
Choose
any of the three: left, center or right for the following effect.
Left aligned text
If you wish to move text on your Composer page to another area of your page, you can select the text and click the Copy or Cut button. Click your cursor to the spot you wish to relocate the item and you can click the Paste button
Spelling can be checked through Composer. Click Spelling and the open page will be checked for spelling. Ignore or Replace based on your knowledge. The dictionary will not know proper names. However, it does recognize many Internet terms that word processors do not recognize.
Find will allow you to find text on the open page.
External links: To add connections to other web pages,
Type the text that you want to be clickable (hot button), such as
Yahoo . Then highlight the word. Click on the "Link"
button 
from the Composition tool bar and type the URL (web address) to
connect to: such as http://www.yahoo.com in the link dialog
box (where it says link to:).
Local Documents: For example, if you want to add a separate web page that list the objectives for your lesson. In
the link dialog box: type the text you want to be clickable (hot
button), such as the word objective, if you are linking to
your objective.html document. Then highlight the word.
click on the "Link" button from
the composition tool bar and type the file name you want to link
to, in this case objective.html, in the link dialog
box.
Hint: For hot buttons, DO NOT Type: Click here to go to my
lessons objectives (too long)
Be sure to put your local documents such as objective.html in your
www folder before you add them to your web page.
Mailto:
At the bottom of your page you can add a clickable mailto address to
allow
people on the web to write to you.
Click the Link button: and put your name and email address in the
text to click
In the location type: mailto:youremailaddress
For example: My email link, Randy
Hansen, would look like this in the "link to" portion of the link
dialogue box:
mailto:rhansen@pgcps.org
At first adding images is a little complex, but it gets a lot easier. Copy the images into your images folder before inserting them into your web page.
Images that appear in a web page are links to an image
file. If you move the image to a different directory or folder it
will no longer appear in the web page. You have broken the link.
Avoid future Image problems!!!
Place all images into your images folder before you insert them into
your web page!!
You can copy and paste images onto the screen or click the image
button and browse to the image
folder in and select your image in .GIF or .JPG image format.
Remember to check the "Leave Image in Original Location" box. The
original location being your images folder!
Click OK to place the image. Remember even if you cut and paste
and image onto
the screen, in reality it is still a separate file in your images
folder that is linked to the page.
To begin keep it simple. Insert one or two
images. Practice. Then you can move into some advanced
features such as changing the image size.
Image size problems can become a problem when you begin inserting and
editing. Composer may resize your images incorrectly. To fix
this, double click on the image to bring up the Image Dialog. Click
the Original Size button in the Dimension section to fix this.
Change Page
To remove an image, simply select the image by clicking once on it,
then press delete. You may or may not want to delete the image
from your images folder depending on if you might use it again.
Horizontal lines are quick and easy ways to break up a relatively
long web page. For example, look how it is used in this page to
identify different sections.
To insert: place the curser where you want the horizontal line, and
click on the horizontal line button 
on the composition toolbar. Double click on the line to change
it's dimensions and features.
Tables can be very useful in designing a web page. In each cell
you can type text, place links or images, or both.
Click the table button to create a table. You will get the
table properties dialogue box.
|
|
Here is where you can direct the number of rows and columns. The Border line width determines how wide the lines will be. If you don't want to see the lines, de-select this option. You can pre-select the alignment of the table, or you can change it later as you would change text alignment. Equal column widths will automatically make all the columns equal. If you want to change the size for the columns, de-select this option. Table background will add color or an image to the table. Click on the color box to select the solid color background you want or check the image box and choose a background file from your images folder. Apply will insert the table into your page without closing the properties box. This is an easy way to determine if the table looks the way you intended without additional steps to change the table. |
You will want to practice these commands to see exactaly what
each will do. Don't worry, if you make a mistake you can easily
change it!
You may need to make changes to your table, such as adding or
deleting rows and columns.
Steps:
1. Select the table by clicking once on it.2. On the menu bar, click on Edit slide down to
- Select the Table: if you wish to cut, copy, or paste
- Delete Table: if you wish to delete a cell, row, column or the entire table
* If you go to Edit and the choices for Select the Table and
Delete Table are grayed out, the table was not selected. go
back to step 1. above.
Preview will open a view of what your page will look like if it
where on the Internet. It will look very similar to the composer
window. Save your work. Click on the preview
button 
from the toolbar.
To publish your page, you can use the publish
button 
and try to move files through Netscape. This will work for
publishing. You will need the URL of the host site, your user name,
and password. However, Composer does not let you see a list of
files that you have already put in your account. For this reason, to
manage your account over time, you may want to switch editors or use a FTP program for PC or Fetch for Macintosh, to get a better idea of
what is in your account.
Questions contact Randy Hansen.
Updated from a page created by Marion French.
Last Updated 10/7/1999
|
| HOME
| Seminar
1 | Seminar
2 | Seminar
3 | Seminar
4 | Seminar
5 | |
