Our Services
Web Portfolio
Web Standards
Statistics
Design Tools


Frames

In order to understand the usage and pitfalls of frames, you first need a basic overview of how web pages, frames, and search engines work.

how non-framed pages work.

On a non-framed web page, you have a title, description, keywords, and page content. The syntax structure is as follows:
<HTML>
  <HEAD>
    <TITLE>Title goes here.</TITLE>
    <META NAME="Description"
          CONTENT="Description here.">
    <META NAME="Keywords"
          CONTENT="Key words/phrases here.">
  </HEAD>
  <BODY>
    Page content goes here.
  </BODY>
</HTML>
When a search engine "indexes" the page, it will store the title, description, keywords, and some or all of the page content within its database.

frames 101.

Frames were introduced as an attempt to simplify navigation on web pages. Easy navigation continues to be the most common reason for their use today. Navigation links can stay in one place, and they never scroll off the page as you read through the content.

Terminology:

  • Frame - refers to a sub-window or sub-section in a web browser window
  • Frameset - refers to the whole page that you see; it holds all the frames

With a framed web page, you actually have more than one HTML file - one for the frameset, and one for each frame. Example: Say you have a page with the following layout where each table cell represents a frame:

Home   Services   Products
Web

Security

Media

Training

Let us create your dreams on the Web.

  1. There will be one HTML file that contains
    "Home  Services  Products".There will be another HTML file that contains
    "Web  Security  Media  Training".And another that contains "Let us create your dreams on the Web."
  2. There is also a frameset page which defines that the page should show three frames, one for each file. This page follows the same syntax structure as any unframed page, except that instead of a <BODY> section (where all the page content goes), it has a <FRAMESET> section (which defines the frames). The syntax for the above example might look something like this:
<HTML>
<HEAD>
<TITLE>Title goes here.</TITLE> <META NAME="Description" CONTENT="Description here."> <META NAME="Keywords" CONTENT="Key words/phrases here."> </HEAD>
</HTML>

 
the main problem - frames make things messy with search engines.

  1. Search results contain pages which are supposed to be within a frame. For example, if someone searched for Root Solutions, they could potentially have found the page that is supposed to be inside the main frame, or they could find the page containing only the navigational links in the left frame. In other words, they wouldn't see the complete page with all the frames; they would either be missing the navigational links across the top and down the side, or missing the main content.

    A workaround is to include a file called robots.txt within our web directory. The robots.txt file can tell search engines not to index those pages which are supposed to be in frames. For example, if all pages within the frame called "body" were named following the expression body_*.html, the robots.txt file could have an entry that said "DISALLOW body_". Not all search engines listen to the robots.txt file, but most do.

    An additional precaution to take would be to add to each non-frameset page JavaScript code that brought the user to a framed version of the page when the page was not loaded into its proper frame. Just remember that not all browsers support JavaScript.
     
  2. Pages have less probability of showing up in search results. Although frameset pages contain title, description, and keywords, they have less of a chance of showing up in search results. In addition to the title, description, and keywords, search engines will index anywhere from the first three lines to the full text of the page content. In a frameset page, there is no page content to index since all the content lies within the other pages (the pages being pulled into the frames). Therefore, search results will rely solely on the title, description, and keywords entered in the <HEAD> section of the frameset page.

 
other problems

  1. Unwanted scroll bars. Frames add unwanted scroll bars when users have their browsers sized smaller than the designer had in mind.

    The fix is to set SCROLLING="no" within the FRAME definition. The drawback of doing this is that the user will have to expand his/her browser window to see everything if it takes up more space than his/her original window size. Note: SCROLLING should not be set to "no" when the frame does not fit within a 600 x 320 window.
     
  2. Oversights. It is extremely common to browse through a framed web site and find at least one instance when a link within a frame takes you to another frameset page within the frame. Using the above example, the result would be two sets of navigational frames and one very small frame for the main content, as seen below.
     
    Home   Services   Products
    Web

    Security

    Media

    Training

    Home   Services   Products
    Web

    Security

    Media

    Let us create your dreams on the Web.

     
  3. Less real estate. Using frames leaves little space for the main content of the page. Authoring to a 600x320 window size requirement, with a left frame approximately 150 pixels wide, that only leaves 450 pixels for the main frame's width.

 
guidelines.

If frames are used, these guidelines should be followed:
  1. Always include the title, description, and keywords on the frameset page.
  2. Do not include the description or keywords on the pages that belong within frames.
  3. Create a robots.txt file to disallow search engines to index pages that belong within frames. See A Standard for Robot Exclusion.
  4. If the frames (other than the main content frame) fit within a 600 x 320 pixel browser, set the SCROLLING to "no" or "0" within the <FRAME> definition.
  5. If borders are not to be seen, use both BORDER=0 and FRAMEBORDER=0 within the <FRAMESET> tag.
  6. Always include a <NOFRAMES> section for the older browsers, if only to display a message telling the user (s)he needs to upgrade his/her browser in order to see the framed web site.
 
CONTACT US TODAY
 

Root Solutions, Inc.

sales@rootsolutions.com
 
001-714-524-0191
 
548 Nenno Ave.
Placentia, CA  92870
USA
 

 
 
 

 
© 2006, Root Solutions, Inc.  All Rights Reserved.