HTML & XHTML - Overview of Frames

Internet Basics
   About the Internet
   About Web Browsers
   Why Domain Names

Getting Started
   HTML vs XHTML
   Making Webpage Files
   Naming Webpage Files

HTML Basics
   About HTML Tags
   Basic HTML Page
   DTDs and Doctype Tags
   Spaces and New Lines
   Special Characters
   Bold, Italics, More
   Writing Headlines
   Adding Links
   Making Lists
   Comments in HTML

Images and Colors
   How to Add Images
   Sources of Images
   Image File Formats
   Optimizing Images
   Color in HTML & CSS
   "Web-safe" Color Chart

More Advanced HTML
   Making Tables
   Formatting with Tables
   Making Forms
   Using Imagemaps
   Using Frames
   Meta Tags

Cascading Style Sheets
   Intro to CSS
   Ways to include CSS
   Some Useful CSS
   CSS Hover for Links

More
   Promoting Your Site
   How-To's Homepage
   Links

Frames

I'll be upfront about this and say that I think that the use of frames is rarely a good idea. Many sites have used them pretty badly and they can still be annoying and confusing for your visitors even when better used.

A frames page isn't a normal page. Check out the frames demo and view the source of the various frames.

Frameset page

<html>
<head>
<title>This title shows :) </title>
<head>
<!-- note No Body in this page! Frameset instead -->
<frameset cols="150,*" border=0, framespacing="0", 
    frameborder="0", scrolling="auto" >
 <frame src="menu.htm" name="menu" marginwidth="10"  >
 <frame src="notthere.htm" name="main" >
</frameset>
<noframes>
 Do something useful here like:
 I notice that you aren't using frames. Here is
 <a href="menu.htm">the table of contents</a>
 for the site, so you can still use it.
</noframes>
</html>

Frameset pages have a normal head section including title.

The <frameset> replaces the <body>. The frameset section tells the browser how to lay out the frames. How many rows and/or columns to make and how big to make them.

Each frame in the frameset needs a <frame> tag to define it. The <frame> needs to declare the name of the frame, this is essential for links to work properly. The <frame> tag also tells the browser which file to load as the starting contents for each frame. Each frame should contain a complete HTML page, with head and body.

Finally the <noframes> section determines what browsers and devices that don't understand frames display.

Linking and Frames

Linking is a little different when you use frames. You need to specify a target attribute, so that the browser will know which frame to load the linked page into.

If you don't specify a target, the new page will load into the same frame that held the link. In the example the menu link titled "Uh-oh" does this.

If you specify the name of one of your frames as the target, (eg: target="main" assuming you named one of your frames "main") then the linked page will open in the specified frame. This is what you will most often need if you are making a framed website.

If you specify the name of a frame that does not exist in your frameset, then the link will open a new window. Other links calling the same name will use the window opened by the first one.

If you use the special name "_blank" as the target attribute, then each link with that target will open its own new window. I use this on my resource page.

To get rid of the frames completely, use target="_top". Use target="_top" on all links to other sites if you are using frames.

If you have nested framesets, target="_parent" will replace that frameset. If you only have one frameset, then target="_parent" will act like target="_top".