• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Lesson 10. Creating Frames

Lesson 10. Creating Frames

Frames are created by splitting the browser window into rectangular areas that contain independent HTML content. Frames are commonly used to define navigation and content areas for a page. Typically, the navigation area remains constant and the content area changes each time a navigation link is clicked. This use of frames can be extremely helpful to a user for navigation through a site. This can also make a site easier to modify since there is only one navigation page to update. On the other hand, frames can degrade a Web site if they are poorly implemented: They may be confusing and disorienting to users if they do not provide a clear site structure, they may make it difficult for users to bookmark or find their way back to a previous page, or they may make the content difficult to view if they are not properly sized and formatted.

In this lesson, you will create and change the properties of framesets and frames, resize frames, and use links to control their contents.

When a user views a Web page that has been created with two frames, the browser is actually using three separate files to display the page: the frameset file and the two files containing the content that appears inside each of the two frames. A frameset is an HTML file that is invisible to the user and defines the structure of a Web page with frames. A frameset stores information about the size and location of each frame, along with the names of the files that supply the content for each of the frames. Each frame is a separate HTML file. Frames have borders that can be turned off so the frames are not readily apparent to the user, or they can be turned on to clearly split the window into different panes. Other options include scroll bars and the possibility of allowing the user to resize the frames by dragging the borders.

In this lesson, you will work with frames to create a Web page with a navigation area and a content area. You will develop a set of pages that will all appear in the content frame when the user selects a link from the navigation frame, and you'll learn how to target links to different frames. You will also learn how to include content for browsers that do not support frames.

To see an example of the finished page for this chapter, open locations.html from the Lesson_10_Frames/Completed folder.


In this lesson, you will:

  • Create a frameset

  • Save a frameset

  • Create frames and nested frames

  • Resize frames

  • Change frameset and frame properties

  • Create documents within frames

  • Create a navigation bar

  • Target frame content

  • Create NoFrames content


This lesson should take about one hour to complete.


Media Files:

Lesson_10_Frames/Images/…(all files)

Starting Files:

Lesson_10_Frames/Text/…(all files)


Completed Project:











Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint