Using Frames
[HOME][PAGE UP][PREV PAGE][NEXT PAGE] Everything has it's place. When frames first came on the scene, every "hip" site on the 'net had to have some. It was like a Hula Hoop or a Pet Rock. Things settled down quickly under heated criticism. I think the novelty has worn off and this element is starting to serve a useful purpose.

The fact that neither Netscape (the original inventor of the idea?) or Microsoft have frames on their home pages should be a clue to the rest of the world. Not that I'm recommending them as the standards. Or should I? After all, between the two of them that's most the browsers in use!

In spite of all the opposition and strong emotions surrounding this feature, I like it in certain instances. In the last chapter I spent a lot of time showing how tables work and I'm implementing some page formatting for this Guide using tables. But, my main page, history and links all use frames. It was the only way I could achieve the effect I desired.

Frame Basics

The  <frameset>, <frame> and <noframes> tags are used to define a frames setup. It's important to note - these tags REPLACE the <body> elements in a document. A frame set is made up of several HTML pages.

The first page defines the display areas and the pages that are initially displayed in them. The subsequent pages don't show any blatant signs that they are part of a frame. In fact, they work equally as well when you load them manually. You may notice one subtle difference - in the <a href... > element you might see a target attribute. This is used to define the frame where the href file is displayed.

Why did I use frames? I wanted a vertical menu to appear at the left and have it remain fixed and in view during the visit. I wanted the viewer to be able to scroll my documents up and down but always have the navigation tools at their fingertips. But I abhor the scrollbars that intrude in the middle of the screen. I was very careful to make sure my navigation aids fit within a small area to minimize the chance that a scroll bar would be generated.

The frame code I used to define my home page is:

<frameset frameborder="0" framespacing="0" border="0" rows="*">
  <frameset frameborder="0" framespacing="0" border="0" cols="135,*">
    <frame name="MainLinks" src="newstyle/21topa.htm" scrolling="auto" marginheight="2"
    marginwidth="2">
    <frame name="RightSide" src="newstyle/21topb.htm" scrolling="auto" marginheight="5"
    marginwidth="5">
  </frameset>
  <noframes size="+1">
  <body bgcolor="#FFFFFF" text="#000000" link="#FF0000" vlink="#0000FF">
  <h1 align="center">No Frames Support</h1>
  <hr>
  <p align="center">I've done it! I moved all the content to frames enabled pages with a few
  extra goodies thrown in. The only problem I can see is that you don't have a &quot;Frames
  Enabled&quot; browser! If you've got the time I would recommend downloading a new browser.
  </p>
  </body>
  </noframes>
</frameset>

The general structure involves defining the areas on the screen. The first frameset line defines the horizontal size of the area. I want to use the whole area so I used rows="*" to define it. Within this first area I wanted to define two additional divisions. The second frameset line does that by specifying cols="135,*". This has the effect of creating a left hand column 135 pixels wide and a right hand column that fills the rest of the display area.

The first frame statement then gives the left column a name and tells the browser what page I want displayed there at start up. I also give the browser permission to put in scrolling bars if the area is too small to display my page without them.

The second frame statement does the same thing.

After these definitions, I end the frameset definition and launch into the noframes specification. Within the noframe definition I finally have the body element and some normal HTML code. Basically, I'm telling the viewer that I'm an elitist pig and they should run out and equip themselves with the latest technology if they want to enjoy my work! Oh well, can't be perfect now can we?

So what happens when this page is loaded? If the browser is "frame enabled" it sets up the frames according to your specifications and completely ignores all the gibberish betweent the noframes tags. The beauty of standards, when they are followed, is that they tell browser makers what to do when they don't understand something. In the case of HTML elements, browser writers are supposed to simply ignore elements they don't deal with. If you'll look closely at the code above you'll notice that all the information is contained as attributes of the elements. If my page is brought into a browser that doesn't do frames then it's supposed to ignore all the lines with frame, frameset and noframes. If you cross out those lines in the example guess what's left - just my rude comments contained in a normal bit of HTML. Pretty tricky, huh?

Frame Manners

If your ever disposed to do frames I would suggest a few things for you to keep in mind:

  • Make liberal use of the target attribute on your <a href...> tags. If you are linking to someone else's site give them the whole display by putting in a target="_top" attribute. It's only fair.
  • When you link back to your original frameset be sure to do the same thing with the target. Otherwise you'll end up with frames in frames, kind of like when you hold a mirror in front of another mirror.
  • Browsers differ in how they deal with the "back" button in a frame. Take charge of the situation and provide navigational aids on your pages to help your viewers navigate easily.
  • Be very careful about turning off the scroll bars. If you develop on a big screen you could create a page that doesn't fit on a normal display. The viewer is unable to scroll the page up to get to other information on the page, such as links or login areas.
  • Frames are like guns, learn how to use them and use them wisely. Don't over do it!

All this talk has made me little thirsty! Let's go get some Java!!

[HOME][PAGE UP][PREV PAGE][NEXT PAGE]

The Rusk Family . . . "the Legend Continues"

Michael T. Rusk
Comments to author: mrusk@radix.net

All contents copyright © 1996-1997, Michael T. Rusk
All rights reserved.

Revised: December 03, 1997 10:41 -0500
URL: ./htmlgd/doframes.html