What
Are Frames?
Frames provide website developers with a means to control how the user
navigates through a website. Frames are most often used by commercial
websites that want to give the user a way to view content from another
site without actually leaving the primary, commercial site.
Frames
break the web page up into subsections, or frames. Each frame has its
own navigation tools, so when the user scrolls down the page in one
frame none of the other frames are affected. This can be very helpful
in pages where one frame contains a lot of text but you don't want the
user to lose sight of your site banner and main navigation buttons.
The
MSDN Library Site* provides an excellent view of frames in action, so
I'll use it as an example for the rest of this discussion. When you
follow the link below, the MSDN site will open in a new window so you
won't have trouble getting back to Thinkydink or switching between the
MSDN site and Thinkydink as you read along. Click on the link, shrink
the new window so you can still easily click back on the Thinkydink
window. Look at the Library page, then switch back to Thinkydink but
don't close the MSDN Library page window - you will need to click back
and forth between it and the Thinkydink window as you read.
http://msdn.microsoft.com/library/default.asp
Notice
how the left-hand frame serves as a table of contents, and no matter
how much you expand or collapse the directory tree the content of the
right-hand frame doesn't change. Also notice that using the scrollbars
on the left hand frame has no affect on the right hand frame. Finally,
see that the heading of the page is also enclosed in a frame so that
the user of the page won't ever have to hunt around for the top-level
navigation links.
Frames
also allow the developer to specify the frame in which a new web page
should be displayed when the user follows a link. In the MSDN library
page, clicking a link in the left-hand frame opens the specified page
in the right-hand frame. Switch to the MSDN Library site and try it
now.
After
you've brought up a page in the right-hand frame, try clicking on any
link in that page. Depending on how the developer set up the link, the
linked page may show up in the right hand frame, as a completely new
site, or in a new window on top of the MSDN library site.
One
more thing to note about frames is that they may or may not be obvious
to the user. The frames in the MSDN library site are visible to the
user because they have their own scrollbars, but in sites where the
top and left hand frame contents are not scrollable, the user may have
no idea he is in a frames page until he clicks on a link and notices
that the target page is opened in a subsection of the current page.
Go back to the MSDN page and notice the page address which appears in
the URL address field. Now click on a link from the left hand frame
and look at the URL address field again after the target page has loaded.
The URL doesn't change, which tells you that you're not leaving the
main page when the new target page is loaded. This is one way to check
and see if you're in a page that uses frames.
If
you're asking yourself why a site developer wouldn't want the user to
know he's in a site with frames, the answer is this: the developer can
essentially hold the user captive on his site by forcing all new pages
to be loaded in one of the existing page's frames. Doing so ensures
that the user is exposed to all of the advertising on the developer's
site, no matter where the user navigates from within the site. The user
can outwit the developer by manually typing a new address into the URL
address field, but having to do so can be inconvenient for knowledgeable
users and very difficult for the technologically-impaired.
At
this point you can close your MSDN Library window, as it won't be needed
for the remainder of the discussion.
Back
to Top
The
Pros of Using Frames in Your Website
Frames
can be very useful to the developer and web surfer alike. The MSDN
Library page demonstrates how frames can make it easy for the user
to navigate through a great deal of content without getting lost in
a sea of pages and then having no idea how to get back to where he started.
I often wish more search engine pages would provide a frames option
because by the time I've clicked through three or more levels of linked
material, it can be a real pain to get back to my original search results.
Also,
as discussed above, developers who want to hold web surfers captive
on their sites can use frames to that end. Sometimes this is helpful
to the user, but most often it's just an annoyance.
Back
to Top
The
Cons of Using Frames in Your Website
The two main cons to using frames are:
1.
Some browsers don't support them.
2.
Many users don't like them.
But
a third con is that frames aren't very easy to to work with for beginning
developers. For more information about developer tools, see How
To Choose A Web Authoring Tool. Frames can be coded in HTML, but
they require their own unique tags and are often structured much like
nested tables. Even using a WYSIWYG web authoring tool, framesets can
be confusing to deal with because it's easy to get the frameset, or
parent, page and its various content frame pages confused. When I first
started working with frames, I sometimes made the mistake of opening
the parent page for editing when what I intended to do was make a change
to one of the pages contained within one of its frames; I'd make the
change, save the page, and find that I'd overwritten my parent page
instead of just changing the page contained in one of its frames.
I'm
pretty comfortable with frames now, but Thinkydink doesn't have frames
content because of the first two reasons: lack of browser support and
user objections. In general, I think it's a good idea not to put anything
in your pages that won't work for, or will annoy, a significant chunk
of your intended audience. The audience will just end up angry, having
made a mental note never to visit your site again.
Back
to Top
HTML
Tags Used For Frames
HTML
tags for frames are used in the "parent" page of a frameset,
but not in the "child" pages. The "parent" page
is the page which has frames defined in it and the child pages are the
pages displayed within the frames. Frames pages aren't coded the same
way as other pages in that you can't identify a child page of a frameset
just by looking at its code - but more about that later.
The
most basic tags used in the parent page are as follows:
| <frameset
cols="*,*"> </frameset> |
declares
a frameset, used in place of the BODY tags; the "*,*"
indicates two columns with variable width - see note below |
| <frameset
rows="*,*> |
used
to set number of rows in a frameset; the "*,*" indicates
two rows with variable width - see note below |
| <frame
src="[child URL]" name="[frame name]"> |
references
a child page to be displayed in the frameset and names the frame |
| <noframes="[text/image/URL]">
</noframes> |
what
to display to users whose browsers don't support frames |
About
that "*,*" - you can set the values for frameset columns and
rows as absolute in number of pixels, as a percentage of screen height
or width, or you can leave one or more of the values as an asterisk,
which tells the browser to use or divide up the remaining available
screen height or width evenly. If you use absolute values for any of
the columns or rows, leave at least one of the values as an asterisk
because you can't predict how large a screen display each user will
have; leaving one value variable ensures you won't end up with blank
spaces onscreen.
The
tags given above really only scratch the surface. You can set margin
values, scrollbar properties and frame sizing behavior and you can nest
frames. Since I don't use frames here and don't generally recommend
using them in World Wide Web pages I won't go into more depth on the
subject, but you can get all the details of these features at www.webmonkey.com
by searching on the word "frames".
Finally,
a note about commenting frameset child pages. You can't tell that a
given page is being used as a child page in a frameset just by looking
at the HTML code unless the developer has added comments to the page
that give the frameset details. Therefore,
if you're going to develop frames pages, it's a good idea to add comments
to the child pages so you'll have an easier time managing them later.
Your
comments should probably include the name of the parent page along with
its full URL, so if you go to edit or delete a page that's being referenced
by a frameset you'll remember to take the frameset page requirements
into account. For example, you don't want your content pages to be resized
to a format that makes them hard to view in the parent frameset.
Back
to Top
*MSDN,
Microsoft and the Windows logo are the proprty of Microsoft, Inc.