Building a Web Page
 Seems as though everyone wants a Web presence. ; -) 
No Homepage Cartoon

We're going to create our Web pages using Netscape Page Composer, which comes free with Netscape. 

|| Getting Started || Inserting Links || Saving || Inserting Links: Easier Methods || Adding Images || Adding Alt Tags || 
|| Indexing Using Targets || Creating a "Home" Page with Links to Others || Working on Your Page ||

To begin: In Netscape, click and hold down Communicator on the toolbar at the top of the screen 

    Communicator link
Pressing on the lefthand side of the mouse, move the arrow down to Page Composer and release. 
This gives you a blank page.  Page Composer allows you to create Web pages with text.  It is much like a word processor.  You can highlight text and then bold it, underline it, etc.   Best to learn by just doing some experimentation. 

To get started -- On your blank Page Composer page, somewhere near the top, type your name and then type in some text (or just put in nonsense letters, e.g., sldkfjg jsowie uryutysod if sldkfjs;ldkjf ) 

Try highlighting the text and changing fonts, formats, etc. 

Inserting hypertext links into your page 

    Position your cursor approximately where you want your link to go. 

    Click on link image on the toolbar at the top of the screen (about 2/3rds of the way across), 
    and you get this dialog box: 
     

      link dialog box
We are going to put in a link to topsy.org (surprise, surprise!). 
    You put the text for the link in the first box. 
    You put its URL (the Internet address) in the Link box 
    Then you click OK

I am still in Page Composer -- look for this symbol (top left of screen) 
The links I put in won't work until I have saved the page and view it through Navigator  

Here's the sequence you follow: 

  1. Compose your Web page using Page Composer
  2. Save your file to disk (or wherever)
  3. View the Web page through Navigator (hyperlinks then work)
Save file to disk 
     1.  Insert your disk in drive A  
     2.  Under File (top left of the screen), select Save as 
     3.  Make sure you are saving it to the A: drive; switch to A: drive, if necessary 
     4.  Name your file and add .html as the extension, e.g., practice.html  
     5. Click on Save 

To see your file in Netscape, click on Preview (yellow sun at the top of the screen) 
To get back to your page in Composer, click on the bottom of the screen, where you see  
After you work on your page, be sure to Save it  
To toggle back to the Navigator screen, click on bottom of screen, where you see  
Hit Reload  (at top of screen) so you can look at the latest changes! 



ADDING LINKS TO YOUR WEB PAGE --- easier methods 
Suppose you are out on the Internet looking at interesting sites.  You want to put links to them on your Web page in Page Composer.  For the method just demonstrated, you have to have the URL written down.  This can be a   #!&%$#@!   bother (especially with complex, lengthy URLs). 

There are two other methods you can use that make all this easier. 

Here's the first:  

  1. Highlight the URL for the site; do a Ctrl+c to copy [Hold down Ctrl key and tap the letter c]
  2. Go to your Web page in Page Composer.  Click on the word Link on the Toolbar (as you did above).  Type in the name of the site.  Click on the box for the URL; do a Ctrl+v to paste the URL in. [Hold down Ctrl and tap the letter v]
Here's the second:  
  1. On your own Web page in Composer, position your cursor sort of where you want the new link to go
  2. On the Internet page you want to link to, put your pointer on the green symbol next to the 

  3. Location box (where the URL is). 
  4. With your mouse, left click on that green symbol and hold the click.  A small link symbol appears. 
  5. Drag down to where your Web page in Composer is referenced at the bottom on your screen. 

  6. Don't let up on the left mouse click!!  
  7. Wait a moment and your Web page will pop up.  Still holding down the mouse click, drag the pointer to where you want the link to be.  (It doesn't have to be positioned perfectly; you can easily move it later.)
Note: Sometimes this method, though fun and slick, refuses to work (for reasons that leave us gasping in amazement).  Don't get too frustrated if you have troubles.  It's probably easier to demonstrate than describe -- so ask one of us to show you! 


Adding Images  
    You should only use images and art that is clearly marked as freely available.  
    Otherwise, email and ask permission!!  A good resources for reviewing some of 
    the issues involved is Fair Use Harbor -- a tutorial on fair use in educational settings
There are a number of sites on the Internet that make images freely available for others to use. Here are some 
(others are listed at:  Making Web Pages Important:  To add an image to your Web page, you have to first save it (either on the desktop or on your disk) 

How to Transfer an Image to Your Disk 
When you get to your image, click on it and press on the right side of the mouse.  Go down to 
Save image as    Save it.  Use .gif or .jpg as the extension. 

How to Put the Image on Your Web Page 

  1. Be on your Web page in Composer 
  2. Click on Image on the Composition Toolbar  to get this dialog box:

  3. link dialog box 
  4. Click on Choose File 
  5. Find the the .gif or .jpg file on your disk that you want and click on it
  6. Click on Open 
  7. Click on OK 
To change how your image is positioned, click on it, go to Image on the Composition Toolbar (as you did above) and experiment with how to arrange text around your image, or how many pixels to have to the left 
and right of the image, etc.   But, please be forewarned.  Composer is a nifty little editor, but not very good 
at handling images.   "You get what you pay for;"  it's free. ; -) 

Adding Alt Tags 
To make your Web pages accessible to everyone, it is important to put in alternative tags to identify any images that you add to your Web pages.  Select Alt.Text from the link dialog page and type in a name or description of the image. Then, click on OK

Indexing your Web page: putting targets on your page and linking to them 

  1. Highlight the word or phrase to be used as the target
  2. Click on Target (along the toolbar at the top of the screen) and click OK

  3. That word or phrase is now a target on your page (the little target symbol that appears on your page in Page Composer will not be visible when you look at the page in Navigator) 
  4. Type in the word or phrase you want to use as an index to one of the targets
  5. Click on Link (along the toolbar at the top of the screen) and select the target word or phrase in the box labelled "Select a named target..."
  6. Click on OK
Creating a "home" page with links to other pages 
  1. Create your "home" page.  Convention is to save it as an index.  Suppose you called it

  2. chem4index.html 
  3. Creat the other pages.  Save them each with distinctive names.  For example, chem4syllabus.html, chem4class1.html, chem4class2.html
  4. Save all the Web pages to the same disk (in the same folder, if you have more than one) -- or, if you are saving on a server, save them all to the same directory
  5. Put in links back and forth between the pages
 
WORKING ON YOUR PAGE
  • Let's say you start a Web page and save it to disk.  At a later time, you  want to work on it again.   

  • To open a Web page on your disk 
    1. Put your disk in Drive A: 
    2. Click on File
    2. Select Open Page
    3. Go to your A: drive, click on your file name.  Open it in Page Composer if you are going to be working on it. 
  • If you have your Web page open in Netscape and you want to transfer it over to Page Composer

  • 1. Click on File
    2. Then on Edit Page
 
Return to VETI II Page for January Workshop
 

Topsy N. Smalley 1/00