Frames and Spiders

By Vince Barnes

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.




Page 1 of 2

 
1 2
Next Page

Make a Comment

Loading Comments...

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
  •  
  •  
  •  
Thanks for your registration, follow us on our social networks to keep up-to-date