Use Frames,
Be Pretty and Be Spidered!
One thing about frames is that people are passionate about them. They either
love them or they hate them, not usually anything in between. Not usually that
is, but I am in between! I see them as very useful for certain things and I
certainly don’t hate them. Today I’m going to go through the process of setting
up a site using frames (since it is a frequent Mentors question) and them I’ll
talk about a couple of the misconceptions and tricks of the trade concerning the
use of frames. If you’re already very familiar with the use of frames. go ahead
and skip quickly through the first few paragraphs.
First, let me describe a frames (a.k.a. "framed") page. It comprises a group of
pages (i.e. a group of HTML files) including the "frames" (or "framed") page
itself, which specifies the frames in use, and an initial page to be displayed
in each of the frames of the frames page. Thus a site using a frames page that
has a "title" frame, a "contents" frame and a "body" frame, as in our example
here, uses a minimum of four HTML page files: the frames page, the title page,
the contents page and the first body page (which in our example is the "main"
page.)
OK, let’s build the frames page itself. Here’s the code:
<html>
<head>
<title>Example Frames Page</title>
</head>
<frameset framespacing="0" border="0" frameborder="0" rows="75,*">
<frame name="title" scrolling="no" noresize target="contents"
src="title.html" marginwidth="0" marginheight="0">
<frameset cols="150,*">
<frame name="contents" target="body" src="contents.html"
marginwidth="0" marginheight="0" scrolling="auto">
<frame name="body" src="main.html"
marginwidth="0" marginheight="0" scrolling="auto">
</frameset>
<noframes>
<body topmargin="0" leftmargin="0">
<p>This page uses frames. Your browser doesn’t support them.
It’s time for an upgrade!</p>
</body>
</noframes>
</frameset>
</html>
First we specify a frameset. In our case we will have two rows, one for the
title and one for the contents and main pages. Specifying rows="75,*" says make
the first row 75 pixels high and the second row (that’s the "*") the rest of the
available space. We have set the framespacing, border and frameborder to zero
because we don’t want any visible borders around our frames and we want to
control all the margins inside the pages themselves.
Within this frameset we specify the first frame, which will occupy the first row
of the frameset. We are not going to allow this frame to be resized or to be
scrolled because we are going to design it’s content page such that it will fit
nicely within the boundaries of the frame (which is set to 75 pixels high.) This
frame is called "title" and we specify that it will initially display a page
called "title.html". We also specify a default "target". The "target" is the
frame which will, by default, display the result of any hyperlink on a page
within this frame. In other words, if we put a hyperlink on our "title.html"
page which links to "cp2.html" and does not specify a target frame in the
hyperlink itself, then "cp2.html" will appear in the frame called "contents"
when the link is clicked.
The second row of the frameset has two frames. To do this we have to specify
another frameset, which is contained within the first frameset and which will
contain our two frames. This frameset is specified as having two columns, which
correspond to our two frames. The first column, or left frame, is set to 150
pixels wide. The second column occupies the rest of the available width.
In the first of these two columns we specify a frame called "contents" which
will initially display "contents.html" and which has a default target frame
called "body". Again the margins are set to zero. Scrolling is set to auto,
however, which means that if the page being displayed is too long or too wide
for the frame, scrollbars will appear.
The second of the two columns is a frame called "body" which will initially
displlay a page called "main.html". We end our second, or inner, frameset with
</frameset>.
Next we display something for those visitors to our site whose browsers are so
out of date that they cannot display frames. Between <noframes> and </noframes>
is the html code for our message to these visitors.
Now we end our first, or outer frameset and our page file.
That is all there is to the frames page.
