Are frames the work of the Devil?
On this page: Frames were all the rage a decade ago, and now they are used less and less. In this article, Lois Wakeman discusses the advantages and disadvantages of this oft-reviled technology.
When frames were first added to the HTML standard, they became very popular and widely used. But the big problem was, in my eyes, that so many of the sites that used them did so:
- either because everyone else was using them, in which case the browsing experience was made overly complex for the limited benefit that frames added,
- or to add some functionality to the page, but because the frames were very badly implemented, the browsing experience became frustrating and error-ridden.
At the time of first writing (June 2000) frames were unfashionable, denigrated by the majority of designers, and it's noticeable how many of the big-money sites no longer use them. Why has there been such a sea-change? It seems unlikely that it's because the elite of highly-paid web designers has taken note of user frustration - witness the recent demise of boo.com, whose designers ignored many tenets of accessible design and still got millions of dollars backing! And lots of big sites still have other features that make them difficult to use for many people.
I really don't know the answer to this one - probably as unfathomable as the changes in colours to wear each season.
Jargon
To understand what follows, you might need to understand these frame-related terms:
- Frames: rectangular containers in a browser window that show separate web pages next to each other. If frames don't have a border, scroll bar, or different background colour, you may not realise that they are present.
- Frameset: the overall page that defines the size and position of the frames, and what pages appear in them when they are first displayed by the browser. (The contents of frames can change subsequently when the reader follows links, but if the frameset is reloaded, the original content will be used.)
- Content and navigation pages in a frameset: as typically used, frames either contain fixed information that the reader can always refer to, usually navigational (e.g. a menu or banner), or content, which is the real "meat" of the site, and changes as the reader clicks on links.
- Inline frame: a frame that is embedded inside another page. Not as common as the 'normal' kind.
- Link target. In a framed page, the links can include a target, which specifies the frame in which the destination page should be displayed. If there is no target, the destination page just replaces the current one, in the normal way.
Pros and cons
Well, are frames a good or a bad thing then? The answer to this is, it all depends on what you want to do ...
First, the good points:
- They allow content and navigation to be separated from each other in a clear way, if used well. Typical uses are to present a left-hand navigation menu, and/or a top banner giving access to the main parts of a site. Other good uses are to provide a commentary on a web page without destroying the flow of the original text, and to allow quick access to different parts of a long page (for example an alphabetic list).
- They can cut down on the amount of duplicate information on each page, so saving download time. If the navigation banner and/or menu are constantly in view, there is no need to download them again with each new content page.
And now the bad points:
- They usually break the Back button. We might like to think that our site navigation model is so elegant that no-one could fail to use it, but the cold reality is that most readers rely on the back button to an alarming degree. (Of course, we are all forced to use it by bad site design, and it's very annoying to arrive at a page with no way out except the Back button, and then finding it doesn't work because of the way frames have been used!)
- They cut down on the amount of space for content; for readers with low-resolution screens (and don't forget that PDAs come into this category), this may be a real nuisance. For example, if there is a 25% frame at the left and a 10% one at the top, then 32.5% of a small screen is taken up by information that the reader might not need just now.
- Frames can cause problems with bookmarks (AKA favorites, or hotlists). Just to make things complicated, the way that bookmarks are created varies:
- In most, but not all, browsers, if you are looking at a frameset and use the right mouse button menu inside a frame, then that individual page is bookmarked. If the page isn't well-designed, it may be meaningless or useless seen away from its companion pages in the frameset.
- If you use the menu/button at the top of the window, then the whole frameset is bookmarked. If you have followed links in the contents of the frameset since it was loaded, these changes will not be remembered; but the original contents will.
- The URL of a frameset stays the same, regardless of how many links were followed inside it. This can be annoying for readers who cut and paste a URL to email to a colleague, for example. Just like a bookmark, the URL refers to the initial state of the frameset.
- The way that a framed page prints may not be what the reader expects or wants. For example, in old versions of Netscape and Opera, you can print individual frames only; in most new ones, you have the choice of the whole frameset as displayed, or individual frames.
- They are more difficult to implement well than single pages (this is not a fault of the technology as such, so much as a practical consequence of how it is implemented). Inexperienced web authors can make a real hash of a framed site. A common fault is forgetting to set link targets properly, so that when the reader follows a link, navigation frames either disappear or are displayed twice. Another common mistake is to forget that search engines will (mostly) list individual pages, so viewers may end up on what is commanly called an orphan page: one with no navigation visible. (This can be mitigated by using a client-side script to restore the frameset when possible.)
When is it OK to use frames?
On balance, there are a lot less pros than cons, so I would suggest that you avoid using frames as a compulsory part of your site unless they are necessary to accommodate the content, or add value for the reader. Here are some cases where a framed approach might be useful:
- To provide an A-Z set of links jumping to different parts of an alphabetic list (glossary, telephone directory, parts list, etc.) This is demonstrated on a trivial example framed page.
- To provide a commentary, or related samples, at the same time as some basic information. For example, see this
annotated XML specification. - To provide a contents list for an online manual or other long document.
To provide a navigational menu in a company intranet where there is varied and deep content.
Intranets have a captive audience, which can be trained in the basics of using the site, and which presumably has some incentive to become familiar with the content. In the sample illustrated here, the dark blue areas provide the navigational aids: links to the main sections across the top, and content for the current section, plus a search facility, at the left.
I think a better case can probably be made for inline frames - these are part of the current HTML standard, but not so widely used because they were historically only supported by Internet Explorer. As the name suggests, an inline frame is a rectangular area inside a web page, whose content comes from another page. If you have any newish browser, for example, you can try out this inline frame demonstration, doing the same thing as the other demo but in a much neater way. (If you have another browser, you may end up getting lost in framespace, neatly illustrating some of the pitfalls!)
When isn't it OK?
I summarised the general principle above, but I want to make some specific points:
- I think the worst misuse of frames is to pass off a different site's content as if it were part of the same one, by displaying it inside a frameset. Some sites give permission to do this, but most do not.
- Another really tiresome use is where lots of frames (for example, four or five) are used just to lay out content, when a table or, better, CSS, would do just as well.
- And if frames must be used, a common mistake is to keep changing the layout between one page and another for no reason, so the reader never knows what to expect or where to click.
And one final demonstration: how setting the targets of links wrongly can have annoying effects for the reader.