weballey logo
 
left Frames - basics backnext right
homesearchsite mape-mail
< basics >
targeting
nesting
esthetics
noframes
bad things
quick recap
tags
epilogue
      I'm not too fond of frames myself. The layout of normal website pages is far better and easier done with tables. But there are situations where their use is acceptable or even unavoidable. Like for instance when you want to show a set of external links and the linked pages at the same time. Switching back and forth would be the only other option. Which may be quite cumbersome.
    Frames are a construct to show several web pages in one browser window. You create a page with sub windows, in which you show other pages. Those other pages may contain yet other framed pages. The first page is in fact not a normal web page, but a "frameset" containing one or more framed web pages. To understand frames, it is very important that you grasp this concept.

There is no body
    A frameset page is different from a normal web page. It does not have a BODY, like a normal web page would. Instead it contains a frame set, telling the browser how and where to show the framed pages. When there is a BODY tag before the frameset, the frameset will be ignored by the browser. A BODY tag after the frameset causes only the frameset to be shown, and the body ignored.

Show me! <HTML>
<HEAD>
<TITLE>A simple frame set</TITLE>
</HEAD>
<FRAMESET>
<FRAME SRC="page.html">
</FRAMESET>
<HTML>

    What you see here is in fact the simplest frame page possible. One frame page, containing only one frame, showing only one webpage, page.html. You see the body is replaced by a frame set. Starting and ending with the FRAMESET tag. Inside it there is the reference to the page to be framed with the FRAME tag. the attribute SRC, or source, specifies the page to be framed. This can be any qualified URL you desire. Any page that can be viewed in a web browser, can be viewed through a frame. One frame doesn't make much sense, so let's add one. Some browsers don't even accept a frameset with only one frame.

Show me! <FRAMESET COLS="50%,*">
<FRAME SRC="page1.html">
<FRAME SRC="page2.html">
</FRAMESET>

Rows and columns
    To add another frame you add an attribute to the FRAMESET tag. The COLS attribute tells the browser there are two or more frames in the frame set. They will be displayed next to eachother. The attribute values determine the size of each frame. In this case the first frame will be 50% of the browser window. The asterisk tells the browser to use the rest of the window for the second frame. If you don't use this COLS attribute, or specify improper dimensions, only the first FRAME will be displayed.

Show me! <FRAMESET COLS="50%,*" ROWS="50%,*">
<FRAME SRC="page1.html">
<FRAME SRC="page2.html">
<FRAME SRC="page3.html">
<FRAME SRC="page4.html">
</FRAMESET>

    Instead of columns you can also create ROWS. In fact you can use them together. The code above will create a frameset with four frames, two above and two below. You can make as many frames as you like, but try to not to make it too complicated. Two or three frames is more than enough for your browser to handle. Frames are always displayed slower than a normal web page. The sub pages are only loaded after the frameset page is complete.

<FRAMESET COLS="*,50%,*">
<FRAMESET COLS="50,*,50" ROWS="50,*,50">
<FRAMESET COLS="*,3*">
<FRAMESET COLS="*,75%">

    Some other possibilities, try to imagine what they do, or just make them. Sets three and four will do exactly the same.

Don't just sit there, DO something!
    As always it is probably a good idea to try out everything you see here for yourself. You cannot learn to swim without getting your feet wet. Type the html code to a text editor, and view it in your browser to examine the results. Remember you always need more than one page, the frame page, and the pages displayed in the frames.

goto top  
leftCopyright © Gerben Hoekstra - All rights reserved backnext right