Simon & Matt's new Photoshop book is out now!

Photoshop CS3 Layers Bible book cover

Sharpen your Photoshop skills today!

PageKits.com Featured PageKits

Waterworld PageKit
Waterworld ($54.99)


Business Heaven PageKit
Business Heaven ($29.99)


See more! > >

 

Tutorial: To frame or not to frame

Level: Intermediate. Published on 1 January 1998 in Web design and style

That is the question, answered by this tutorial. Not sure whether to build a framed site or not? You'll find some suggestions here.

Frames are one of those things. You have to learn how to do them, because sometimes you need them. But when and how to apply them can be a real problem.

In this tutorial we'll try to clear up a few points about frames and show you when it's a good idea to use them. First off, the pros and cons of framing...

Pros

  • They are really handy for navigation purposes. A navigation frame can contain a lot of navigation options all at your fingertips - AND the navigation doesn't have to reload on each page.
  • They allow you to disguise your directory structure since the browser only shows the root of the site.
  • Frames are actually a useful design tool in their own right. They allow you to split a page with both background images and colours in a different way.

Cons

  • The browser has to load two or more HTML pages as opposed to the usual one, slowing down the final download time.
  • External linking to a page within a site that uses frames is very difficult if you want to load the frame too.
  • There's more scope for screwing up the code.
  • Some browsers can't see them, narrowing your audience.
  • Some search engine spiders can't see them either, worsening your search engine positioning.
  • They can look dead ugly if you don't get them right.

So when should I use them then?

Well, there's no hard and fast rule. Basically, you can use them to great effect if you have a menu that you want on permanent display, especially if it has a long load time and you don't want it permanently reloading every time the visitor looks at a new page.

They're also great for updating, since there's only one menu file to change for a whole site when you add a section.

Frames are good if space is an issue, and you want to fix a certain size for viewing - here's a good example - chopper, from our own PageKits. It'll fit easily into a small browser, and the frames themselves change from being a technical thing into part of the overall design.

However, frames do tend to get you into a bit of a design dead end, since they prompt you to think a certain way. For instance, you couldn't do something like Nightdrive with frames, and even if you could, you'd be negating the benefits by having the menu reload all the time. The trick is to dictate to the frames, not let the frames dictate to you, where things should be.

On a small site, you may not need frames, since the menu options are less complex. Also you may have a design that you like that doesn't fit the mould for frames. If so, you don't have to use them at all!

Frame tips

You can do some really nice stuff with frames, but there are certain things to avoid.

Watch out for frame borders - different browsers treat them differently (see the How to do framesets HTML tutorial), and you can easily have them on when you want them off if you don't test well!

Make sure your menus work at small browser sizes, so that when viewed like this, options aren't chopped off (it's best to set your menu frames to scrolling=no, since scrolling menu frames look gross). Watch out on long menus though!

Try not to have too many frames on the page, especially if the borders are on - it just looks horrible, and slows the download as it loads all the HTML pages.

The end

That's the end of this article. We hope you found it useful. If you're still stuck and would like further help, check out our online Help Forums, where you can get assistance from members of Elated and other webmasters.

Also, don't forget the free ELATED Extra Newsletter, where you can get more great Web-building articles and tips sent straight to your inbox!

If you would like to offer us feedback on this or any of our articles, please contact us. Have fun!

Top of Page

Get our free newsletter!

  • Improve your Web skills
  • Exclusive tips and tricks
  • Free bonus Web template

Sign up now!

We won't give or sell your email address to anyone, and you can unsubscribe at any time. Privacy statement