Understanding Frames

Team-Fly    

Macromedia® DreamWeaver® MX Unleashed
By Matthew Pizzi, Zak Ruvalcaba
Table of Contents
Chapter 7.  Framesets


Frames are essentially several documents contained inside one container document, typically called a parent frame. Refer to Figure 7.1 to see an example of four different HTML documents. At first glance, it may appear as if only three documents are in the browser, but remember that an HTML document holds the three together, thus making it four separate documents.

Figure 7.1. This document is cut into three sections. Each section is a separate, independent HTML document being held together by another HTML document that you can't see, called the parent frame.

graphics/07fig01.jpg

In addition to framesets streamlining the development process, they also streamline the Web experience for the end user. Many advantages exist, both for the developer and the end user, in creating a Web site that uses several HTML documents to present content.

TIP

Refer to the companion Web site located at http://www.dreamweavermxunleashed.com to see a QuickTime movie demonstrating the power and convenience of a frameset.


The Advantages

The advantages of setting up a Web site that uses framesets can be profound. All elements that are constant throughout the Web experience do not have to be reloaded every time a link is clicked. It's typical to see an arrangement with a navigation structure on the left side, a logo with a banner ad on the top, and a main area where new pages will be loaded in. Figure 7.2 illustrates a real-world Web site that uses such a system.

Figure 7.2. The Titanic movie's Web site, located at http://titanicmovie.com/past/tour_index.html, uses a frame structure with a navigation system on the left and a logo and banners on top.

graphics/07fig02.jpg

By having the new content appear in the larger area, the site can appear more complete. Accessing new documents and swapping them out of the same location saves download time and offers an easier navigation experience for the Web user. Web sites seem very organized when frames are being used.

The Disadvantages

Along with all the advantages frames can provide, they also offer some disadvantages and challenges for a Web designer. The most important of these challenges is search engine placement. Most search engines will view the HTML text of a document to find any keywords associated with ones searched. The problem with this is that the parent document is where the search program checks for the HTML text because it's the document closest to the browser. The other frames or HTML documents are essentially placed on top of the parent, therefore being disguised from spiders and other search applications. Of course, there are some things you can do to help expose content within these documents, which you'll learn later in this chapter.

Another disadvantage is bookmarks. When the end user is navigating through the Web site, the main portion of the document is being swapped out every time a link is clicked, until finally the end user finds the desired content. Then the end user decides to bookmark it or add it to the favorites by accessing the menu. Unfortunately, the page the user was looking at isn't bookmarked; instead, the parent frame is bookmarked because that's the closest frame to the browser. Remember, the frames are essentially inside the parent frame; think of the parent frame as a compartmentalized tray, and each compartment of the tray is a frame. Because the frame is in a compartment, the content is not exposed as a normal HTML document usually would be to a browser.

If the end users are savvy Web surfers, they may know that you can contextual-click the document to bookmark it. However, when they return to the link by using that bookmark or favorite, the surrounding frames will not accompany that document. This can be a disadvantage because users are not returning to your site for further exploration, but to a page within your site with no navigation to other portions of your Web site. So as a developer, you're potentially missing out on return business.

The last disadvantage is printing, for the same reasons as bookmarking pages. If the end user chooses File, Print, the parent frame is printed, which contains nothing but some HTML code.

Be Prepared

Finally, it's important to understand the difference between a frameset and a frame. A frameset doesn't contain any content. A frameset, generally, is considered the parent frame, and this frame has HTML tags that hold the position of the other frames or HTML documents in the Web browser. Framesets in some ways resemble tables because they are constructed of columns and rows. The HTML for a parent frame looks something like the following:

 <frameset rows= "25%, *">    <frame src="/books/4/291/1/html/2/top.html">   <frame src="/books/4/291/1/html/2/bottom.html"> </frameset> 

The frameset tag would be between the <body> tags.

This code represents a frameset, which contains two rows: one on top monopolizing 25% of the browser and one on the bottom that is a relative size. The bottom size changes, depending on the size of the browser window, whereas the top remains constant at 25%. Refer to Figure 7.3 to see what this page will look like in a Web browser.

Figure 7.3. This page is divided to contain two rows, a top and a bottom row. Remember that a third document holds these together.

graphics/07fig03.jpg

There is also the columns attribute, which inserts an HTML document vertically. An example of a parent HTML document with vertical and horizontal frames could look like this:

 <frameset cols ="50, 375" rows= "25%, *">  

Relative options are also available for frame columns, which you will learn about when you get deeper into frames in this chapter.


    Team-Fly    
    Top


    Macromedia Dreamweaver MX Unleashed
    Macromedia Dreamweaver MX 2004 Unleashed
    ISBN: 0672326310
    EAN: 2147483647
    Year: 2002
    Pages: 321

    flylib.com © 2008-2017.
    If you may any questions please contact us: flylib@qtcs.net