WebTV's iFrames and Frames
<font color="red" size=4>Please be informed. This page uses frames. Reload (cmd-r)</font>

Frames are concerned with the display or usage of more than one web page on a document that is currently being viewed. There are two kinds of these:

• iFrames (Image or "Floating" Frames)
• Frames

With WebTV's Page Builder these do not function fully in the manner usually described. Some expedients must be taken at times to have them work at all and in some instances not all capabilities can be expressed using WebTV. In presenting each the code for the usually expected result will be given and then how it appears using WebTV. Whatever limitations or work-arounds as may apply will be described as they apply to WebTV. When trying a code a test-bed may serve to identify whether a code is correct, but it may be necessary to either create one's own sample pages or have URLs for a few on hand and to use these on Page Builder (or another server's editor) test pages created for this purpose. For this discussion, three sample pages of differing color are the documents utilized.

iFrames Anyone reading this certainly knows how to make use of an <image> tag. The iFrame tag is used in virtually the same way, the distinction being that html is the end extension to the URL and not gif or jpg. The basic iFrame tag is:

<iframe width=? height=?? src="URL.html" align=center | right frameborder=#> </iframe>

where the ?s are in pixels, and # is a positive integer. Left is the default alignment. The frameborder and other attribute are not enabled for WebTV Classic users. Note the required closing tag. The iFrame tag is one for IE and does not work with NS. In some ways it is the same as using an <embed> tag with an html URL. The examples below show the two used with a height and width of 100 pixels:

iFrame Tag

Embed Tag

At this point it is seen both function in the same unsatisfactory manner for WebTV, and the <embed> tag does not work for PC. Only the width is as specified when using WebTV. Unless the original page whose URL is used is kept short, as is done for this example, the height will be as many pixels long as the original page. With a PC, Internet Explorer (IE), both height and width attributes can be used.

NOTE: The ubiquitous Powered By WebTV and the Barnes & Noble banner on every WebTV page are also there. The banner can be eliminated without violating WebTV's Terms Of Service (TOS) since the pages whose URLs are used appear on a page, this one, which still maintains the banner. This is done by placing a <script> tag at the point where the end of the page is desired. To fall within WebTV's TOS these pages are published but not made public. Anyone doing otherwise does so at their own risk.

It can be seen now that the height dimension of the page used in an <iframe> or <embed> tag is a determining factor in their use. Both dimensions may still be used,otherwise it is sufficient to just set the width, knowing that the height will be that of the page displayed. The example below is for the three sample pages employed throughout this discussion with a width of 100.

The black sample page has a width of 100 and height of 100.The green sample page has a width of 100 and height of 125.The blue sample page has a width of 100 and height of 150.



What makes an <iframe> tag different from an <embed> tag is the ability to change, or target, the frame content. For this, the iframe is given a name and this name is targetted using as many anchor links as there are changes to be made in iframe content:

<iframe width=? height=?? src="URL.html" name="newdoc"> </iframe> <a href="URLother.html" target="newdoc">Change It</a>

The effect is as shown below:



Show No. 2
Show No. 3
Show No. 1

Using "Back" will step through each page in the iframe until the first call to the iframe was made. To break-out of iframes an anchor tag calling the original page having the attribute target="_top" is included on each page called into the iframe, i.e.,

<a href="URLorig.html target="_top">Exit</a>

The advantages to an <iframe> tag are readily evident:

• Other documents, as many as may be necessary, may be displayed without ever leaving the page.
• These documents may contain text, image, and/or sound.
• An iFrame can essentially be dimensioned and placed wherever desired on a page as easily as an image.
• iFrames can be used in WebTV e-mail as well as on pages.

It must be pointed out, though, that attributes for the <iframe> tag which control internal and external margins and scrolling are not enabled for WebTV Classic users. They are for Plus users. This is written on a "new" Classic.

Frames Where iFrames resemble the display of images, Frames resembles more collections of images, or rather iFrames, within a table. The distinction, though, is that in defining how a Frame is to look the columns and rows are written separately. The tags employed for Frames, while differing from those of tables, enter as when writing a table: left-to-right and top-to-bottom. They are however, more separate from one another, and more must be kept in mind or realized by inspection that the placement is as intended.

There are essentially three steps in setting up a frames page.

• Have as a beginning page a non-frames introduction stating that frames will be used. This is especially important with WebTV as frames are susceptible to the WebTV JavaScript "Bug" and instruction can be given to reload (cmd-r) if a blank page with no message in the status bar appears.
• If WebTV Page Builder is used, the first frames page or frameset page is best done using Advanced Editor as this makes a smoother transition between the pages used in the frames. More importantly, the frameset page should have no <head> or <body> tags or, at the very least, no <body> tags. Using Advanced Editor in WebTV Page Builder insures this. Having a non-frames beginning page with a link to a frameset page also masks the odd URL that results when using Advanced Editor. The URL has titlehead at its end, e.g., nameFramesetPagetitlehead.
• Finally, write all other pages that are to appear in the frameset separately with their own independent URLs.

Most usually the number and size (in % or pixels) for each column down a page is initially established, and these are written as a frameset. Here the number of columns is 2, with the first 35% of the screen width and the second 65% of the screen width (note the quotation marks in each tag):

<frameset cols="35%,65%">

It must now be decided how many Frames (just leave out the i on iFrames) are to be in each column, as this will determine the format for this part of the code. Each will require a <frameset> tag for the number of rows across a particular column:

<frameset rows="100,*">

Here 100 pixels is set for the first row's horizontal width and the asterisk ( * ), leaves it to the browser to make up the difference. A frameset of three frames is usually more than enough. If there were more it is a usual practice to specify only one of these and let the browser fill in the rest. At the very least, leave one row dimension unspecified. These specifications work well with a "new" Classic, however with a Plus the asterisk often must be replaced with a value to appropriately fill the frame. In the examples below this value is 215.

What determines where the <frameset> for the rows is to be placed is given by the placement for the actual frame tags, each of which must have a different name, and which look not-too-different from an <iframe> tag:

<frame src="URLforit" name="alldifferent">

Using these, if one wants a frame first then next to it two others in the same column the code is as on the left. For contrast, the code for two frames first and one next to it is on the right, below:

<frameset cols="35%,65%"> <frame src="smp1" name="blk"> <frameset rows="100,*"> <frame src="smp2" name="grn"> <frame src="smp3" name="blu"> </frameset> </frameset>

<frameset cols="35%,65%"> <frameset rows="50%,*"> <frame src="smp1" name="blk"> <frame src="smp2" name="grn"> </frameset> <frame src="smp3" name="blu"> </frameset>

Please again note, frames on WebTV are prone to the JavaScript "bug', and if just a blank white page is seen with nothing in the status bar the page must be reloaded (cmd-r) to be seen. As with iFrames, the margin and scroll attributes for the <frame> tag are not enabled with WebTV.

There are some WebTV related characteristics associated with the use of frames:

• Frames cannot be viewed in Page Builder's edit mode, and therefore not in e-mail. They can only be viewed when Previewed there or when published.
• Only one <frameset> is allowed on a page. Any more and only the first is executed.
• Wherever a <frameset> is placed in coding a document, it will appear at the very start of the document when viewing it. In other words, pages designed using WebTV frames will either occupy a whole viewing screen or a portion at the top of a page.
• The entire horizontal width of the screen must be used with WebTV. Setting any other dimensionality in a <frameset cols="?"> tag will still occupy the entire screen width in proportion to the widths specified, whether in pixels or percentages.
• The row dimensions in the <frameset rows="?"> tag are similarly affected. Only one, of two, dimension values can be specified in pixels or percentages, the acual vertical height of the frameset being controlled by the browser.

Linking so as to change any one frame can be done, as with iFrames, by specifying the name for the frame:

<a href="URLother.html" target="framename">Change It</a>

One particularly useful frameset is to have a sidebar filling 25% (about 150 pixels) of the screen with links to all other pages on the remaining 75% of the screen on the right. This would entail:

• First, a non-frames page to link to the frameset page
• A frameset page coded:
  
  

  <frameset cols="20%,*" frameborder=0> <frame src="left.html" name="lftside" scrolling=no noresize> <frame src="cntnt1.html" name="rtside" scrolling=yes noresize> </frameset>

  
  The sidebar frame width is set to 20%. Whatever text is in the sidebar page will "adjust" itself to fit this width.
  
• A page with a URL appropriate for left.html with links for the pages that are to appear to the right coded as:
  
  

  <sidebar bgcolor=?> <table width=150 height=1500 bgcolor=? border=0> <tr><td valign=top align=middle> <a href="cntnt1.html" target="rtside">Page 1</a> <a href="cntnt2.html" target="rtside">Page 2</a> etc. </td></tr></table> </sidebar>

  
  A table is used to contain the frame links. The width must be in pixels as this is the only unit acceptable by the WebTV sidebar tag. A large height is used for the table so that the sidebar will extend below the viewing screen.
• One page for each link shown on the left sidebar page with URLs appropriate to cntnt#.html, #=1, 2, etc.

In blue are shown optional tags that may be added to have the right frame scroll for all pages loaded into it. The widths must be in pixels. Scrolling attributes in frame tags are not recognized by WebTV, but they are by PC. The sidebar tag is not recognized by PC. Both types of code are utilized so that, depending on the instrument, the tags that will not work are ignored in favor of those that will. An example (right side scrolling relative to the sidebar) is shown upon clicking the button below.

NOTE: A "break out" link which loads the frameset page is included in the sidebar. Clicking this enables going "Back" to the page viewed previous to originally loading the frameset page without going "Back" through all the frame pages that may also have been viewed. Frame pages are "children" of the "parent" page which calls the frameset page. The history for these pages differ. "Breaking out of frames" means directing page history control back to the parent page. This amounts essentially to:

• Returning to parent page history as when the frameset page was first called, which is done using the anchor tag:
  
  <a href="frmset.html" target=_top>BREAK OUT</a>
  where target=_top effects this; and,
• Hitting "Back" to return to the page prior to when the frameset page was called.

An equivalent to this demonstration of frames would be to use appropriately constructed iFrames within a table, much as when displaying images. The effect will appear to be the same and has the advantage of being applied in e-mail.

There are many interesting usages of frames, many of which are yet to be realized in WebTV pages. One of the more prominent of these is the continuation of music from "page-to-page" which has become the only way of doing so now that the target=main attribute has been unabled with the year 2000 upgrade. Another is with slide shows.

Be Polite Not all browsers can accept frames. They are simply ignored. Tell whoever visits your site that this is an unfortunate circumstance by adding after the frames coding:

<noframes> <body> Sorry. Without frames this page cannot be viewed </body> </noframes>

How many times has such a message been seen by you, the viewer? This is why and how it is done.