[ PROS&CONS | FRAMESET | LAYOUT | NAMING | TARGETING | EDITING ]

Frames at first sound like an excellent idea, but they can often get out of control. If you decide to use them, they should add to your site, not take away from it. At the most, you should use two frames. Under certain circumstances, three can work. When used cleverly, frames can be excellent additions to a site. They also must be easy to use and function well. Frames can be a bad idea if they are too complicated, ugly, non-functioning, or unnecessary. They may be hard to use, too.

First, you must setup a frameset document. This contains the layout commands for the frames. When linking to a page with frames, you must link to the frameset document, and not the pages themselves.

Begin by creating an HTML document as usual, then add [FRAMESET][/FRAMESET] tags. Now for the layout...

Overview of Frameset Attributes:
BORDER=x creates a border for all the frames, x=width in pixels
FRAMEBORDER=x this does the same as "BORDER=x" but it is for a different browser. If you want both i.e. and netscape navigator users to see your borders, use both. ( annoying, huh? )
BORDERCOLOR=#...... specifies color of border
COLS="x, x" column dimensions; percentage of window, pixels, or space remaining. ex. 25%, 100, * *=remaining space
ROWS="x, x"row dimensions, done the same as with columns
FRAMESPACING=x space between frames, x=pixels

Remember that rows are horizontal and columns are vertical. Now if you didn't know that, this'd be difficult to do.

When deciding the layout of your frames, decide whether you want to use columns or rows. Usually, one will be larger than the other. The larger one is commonly the viewing of the site, while the smaller one provides a menu or site map, etc. I'll use an example of a frameset using two rows, and no columns.

[FRAMESET ROWS="80%, *"]
[/FRAMESET]
The rows attribute above states that the first and larger frame will take up 80% of the viewing area, and the second frame will use the remaining ( * ) space. The larger one will come on the top, because it was listed first. ( When using columns, whichever one you list first will appear on the left. )

Okay, after getting the frameset tags set up, you can now configure the individual frames. Each frame is designed using attributes with in the frame [FRAME] tag. It is not used in pairs. The attributes are:

NAME="..." names the frame ( this is important because when linking later, you'll need a name to specify which frame an html doc loads into. )
SRC="..." place the desired url here. this specifies which page loads into the frame.
BORDER=x width of the frames border, x=# in pixels
FRAMEBORDER=x again, this does the same as BORDER=x. Use both if you want everyone to view it
NORESIZE prohibits the viewers from resizing the frame as they please
SCROLLING="yes/no/auto" controls the scrollbars of the frame. "Yes" requires scrollbars, and "no" will not allow scrollbars. "Auto" will install a scrollbar only if it is needed.
Continuing with the same example, here's the coding for the two row frames:
[FRAMESET ROWS="80%, *"]
[FRAME SRC="blah.html" NAME="top" BORDER=1 FRAMEBORDER=1 SCROLLING="auto"]
[FRAME SRC="blahmenu.html" NAME="bottom" BORDER=0 FRAMEBORDER=0 SCROLLING="yes"]

[/FRAMESET]
The first, and upper frame is named "top." The lower frame is named "bottom" and is serving as a menu bar along the bottom of the screen. It has no borders, which looks a little spiffy. Remember to name your frames something short and logical, and keep simple !

Now, once your viewers are looking at the frames and navigating your site, they will have to be able to use more than one frame. Such as with a menu bar, a link in one frame must load a page in the other frame. So, all the links must be targetted. This means that they point to a specific frame or window for the new page to load. Without a target, it will simply load into the same frame or window the link is located.

When linking from one frame to another, use the frame's name as the target. Using the menu frame to link to "stuff.html" in the frame above it, looks like this:

[A HREF="stuff.html" TARGET="top"]link[/A]
The bottom frame remains the same, while the top frame loaded a new page, "stuff.html."

Editing is an essential part of developing a framed site. Before opening it to the public, you must test every link and be sure it appears as you wish. Chances are you'll find many problems, and have to search through the links and frameset to find them. This is normal, and all part of making frames work. It is also a good reason to make the design simple, because more frames mean more complications.

[ PROS&CONS | FRAMESET | LAYOUT | NAMING | TARGETING | EDITING ]

[ HOME ]