The Computer Gal Logo - Laptop with coffee and plants
What Are Website Frames?
The Computer Gal on Facebook
Ask to receive tips and handouts to your email.

Frames are a way to create the structure of a web page. The structure of a web page is what holds the content where you want it. Frame structure is very different from Table or CSS structure. However, you can use tables and/or CSS inside your frmaes. Here are some of the basic facts about frames. I will be referring to an example.

  1. A framed page divides the browser window into areas. Each area functions as a new browser window and loads a different file. These browser windows are held together by a called the frameset that tells the browser which frames to load and where. The example has a frameset and three frame files. The index is the frameset.
  2. Frames use many *HTML files to structure a web page, instead of one HTML file. However, the viewer sees them as one web page. You can often tell where the frames are because each frame my have another scrollbar. The example page, linked above, is has 4 files: index.html, MainFrame.html, SideBar.html and TopFrame.html.

    Example of a web page constructed with framesThe example image below has many frames; some can be noted by the scrollbars. Note the scrollbar on the left side and several on the right. The top banner area is actually a frame, too, but it does not have a scrollbar because either 1) the content is sized not to need a scrollbar, 2) the properties have been set for this frame not to have a scrollbar.

  3. Each of the files displayed in a frame is a regular HTML file. In a framed page, the browser will show each file in part of the window. The frameset file defines how much space each page gets in the window.

    In the example site, there are three links in the bottom of the left navigation that illustrate how a framed site works. Each of the links opens a whole different website: 1) Google, 2) Yahoo, 3) Webopedia. What you see if you click all three links is that t a different web page is showing in each of the three frames. The Google page only shows a bit at the top. Clicking the Back button will go back to the original page(s).

    Yahoo framed into the example page

  4. Benefits of using frames:
    - One part of the page can scroll while the rest stays put. This was important in the days when browsers didn't target="_blank" because when you linked off your site, there was no other way to be sure visitors could get back to your site.

  5. Beginning file structure for a group of framed pages.Downside of using frames:
    - New file management system to learn and keep track of.
    - If you aren't careful, your page sprouts scrollbars all over the place.
    - If you aren't careful, you get ugly borders all over the place.
    - Frames aren't ADA compliant because many "readers" can't jump frames. This happens because each "frame" is actually opening a different file. For information on making frames accessible: http://www.doit.wisc.edu/accessibility/online-course/standards/frames.htm (copyrighted 2003; so, it's a little dated.)
    - Framed sites can only have one title tag and one address showing in the browser.
    - Framed sites have traditionally been difficult for the search engines to catalog, although has changed somewhat.
    - When a viewer prints a framed page, they often only get the frame they clicked last, or the first frame. In many printers, the viewer can choose a setting that will print the whole page, but they have to know that it is available and how to do it.

Related Articles

  1. What is a Framed Site
  2. Building a Website with Frames in Dreamweaver 8 and Dreamweaver CS4
Nora McDougall | Missoula, Montana 59801 | 406.253.4045 | Contact Nora
© 2010, Nora McDougall-Collins