Banner Image Map

FRAMES

Quick Reference 

 Setting Up a Webpage with Frames

A webpage using frames actually uses several different webpages at once. (example) A HTML file called a "frame set" defines the sizes of the frames and what page will be initially displayed in each. If you want a link in one frame (like a sidebar) to open in an adjacent frame (like the large main one), you have to define the "default target frame" for the sidebar page.

1. Create pages to be included

The first thing you need to do is create the webpages which will be put together. I suggest creating:

A navigation page that list links, which will be displayed in a narrow frame on the left side of the screen (Save this page as nav.html)

An information page, which will be displayed in the large main window to the right of the navigation page. (Save this page as main.html)

2. Create a "Frame Set"
Claris Homepage
Netscape Composer
MS Frontpage 2000
  1. First, open both your navigation page and your information page in Claris HomePage.
  2. From the FILE menu, choose NEW and then FRAME PAGE. Then click OK.
  3. Click in the boxes next to the pages you want to include in the frame-set: your navigation page and your information page. Leave the frame orientation set to "Vertical."
  4. The two pages should now be displayed in the left and right half of the screen.

  1. On the FILE menu, point to NEW, click Page, and then click the FRAMES PAGES tab.
  2. Click a frames page template (VERTICAL SPLIT).
    • When you click a template, FrontPage displays a thumbnail showing that template's frames layout in the Preview area.
    • It also displays a summary and suggested use of the template in the Description area.
  3. Click the SET INITIAL PAGE button in the left frame.
  4. Locate and select nav.html
  5. Click the SET INITIAL PAGE button in the right frame.
  6. Locate and select main.html

3. Resize frames
Claris Homepage
Netscape Composer
MS Frontpage 2000
  1. Double click on the left frame.
    • Enter a name like "nav" beside "Frame Name."
    • Click on the "Appearance" tab. Set the SIZE to 20 percent.
  2. Click on the right frame.
    • Enter a name like "info" beside "Frame Name."
  3. Click on the "Appearance" tab. Set the SIZE to 80 percent.

  1. Right click the left frame and choose FRAME PROPERITES.
  2. Beside WIDTH, change the popup menu from RELATIVE to PERCENT.
  3. Change the number beside WIDTH to 20

 

4. Set "Default Target Frame"
Claris Homepage
Netscape Composer
MS Frontpage 2000
  1. From the WINDOW menu at the top of your screen, select your navigation page (nav.html).
  2. Click on the document options button () and then click on the PARAMETERS tab.
  3. Enter the name you gave the right frame ("info" in my example) below DEFAULT TARGET FRAME.
    1. Save the navigation page again.

  1. Right click the left frame and choose PAGE PROPERITES.
  3. Click the right frame in the previewed version:
  4. Click OK twice.

View the Finished Webpage Using Frames

Targets/Anchors | Tables | Images | Multimedia | Javascript Rollover Images | Frames | PDFs | HyperStudio: | Guestbook | Uploading

http://www.wtvi.com/html

  Back - Forward

Home - Basic Course - Intermediate Course - Tools for the TEKS

Made on a Mac!Built by Claris HomePageCourse and Website by Wesley A. Fryer of Lubbock, Texas.
Site sponsored by WesTech Vision Inc.