PageTutor.com

That was so much fun I think we'll do it again! Let's divide Lisa horizontally into 3 sections. The top window needs to be 50 pixels high. The other two can be split equally. We will put Lisa into all three. Here are all the changes in one big chunk.

<frameset cols="50,*,2*">
  <frameset rows="50,*,*">
    <frame src="lisa.html">
    <frame src="lisa.html">
    <frame src="lisa.html">
  </frameset>
  <frame src="terri.html">
  <frameset rows="50%,50%">
    <frame src="kim.html">
    <frame src="tina.html">
  </frameset>
</frameset>

VIEW IT

I know it doesn't look like much. Actually if a page was divided up that much it would look pretty crappy. A good rule of thumb is don't have more than 3 frames on your page. If you can avoid them altogether, that's even better.

Now's also a good time to think about the poor folks that are using non frames capable browsers. Although most, if not all of your visitors will be able to see frames, there is a minority that is surfing the web with outdated or special equipment. If you would like to help these folks out you can write a noframes version of your main page and add it within the main <frameset> tag pair thusly...

<frameset cols="50,*,2*">
  <frameset rows="50,*,*">
    <frame src="lisa.html">
    <frame src="lisa.html">
    <frame src="lisa.html">
  </frameset>
  <frame src="terri.html">
  <frameset rows="50%,50%">
    <frame src="kim.html">
    <frame src="tina.html">
  </frameset>
  <noframes>
  <body>

    Put your non-frames page down here. If someone
    is using an old browser,it will skip everything
    above and come straight down here. Frames-capable
    browsers will ignore what is between the <noframes>
    tags.

    You may be asking a couple questions right now.

    * Do I have to write a whole nuther page?  Probably.
    * How many people will be missing my page if I don't
      do this?  Very few.
    * Do you think I should worry about it?  Nope.
    * Do you worry about it?  Nope.
    * Why did you put it in this tutorial?  Because it's
      a major feature and I wanted you to at least know
      about it.
    * Are you always this witty and charming?  Of course.

  </body>
  </noframes>
</frameset>

Note - My personal opinion aside, there is an argument for using the <noframes> tag. Your web page may be accessed by "user agents" other than modern web browsers. Whether we're talking screen readers for the visually impaired or some search engine spiders, the bottom line is, if your page is "frames only" you may be hindering a few people. If it is important to you to reach absolutely everyone with the least amount of potential problems, then take the time to use the <noframes> tag. Or better yet, try avoiding frames in the first place. My thanks to Matthew Miller, of the HTML Writers Guild for pointing some of this out.

So there you have the first several lessons of Frames Tutor. In later lessons you'll learn more about frames, how to size them, link to them, link between them and a whole lot more. You'll learn about borderless frames, embedded frames, and you'll even get a bunch of common frame layouts in template form.

Yes sir, there is a LOT more to frames... you'll learn plenty. But you'll need to become a member first...

SIGN UP NOW  >>

<< BACK NEXT >>
PageTutor - Frames Tutor
Lessons: Intro 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
Frames Templates      Barebones HTML Guide
Print version of this tutorial available - Get the PageTutor book & CD