lecture 10: frameset documents

As ever, this lecture only introduces the concept of frameset documents, which can be gone into in quite some depth. The detail is provided by the online teaching materials. Note that there is also some code on the handout for this lecture.

Frameset documents can cause confusion for some people because to an extent they are "invisible". In the example (by the way, it's probably a good idea to re-open this page and keep it open over the next couple of slides, if you had closed it), if you "View Source" in any of the three parts of the screen (top, left, right) when the window is in its original state, you will see the source code of the following documents (if you'd followed any links the left and right parts might have changed, but the basic principle remains the same):

top: a file called ext_topbar.html
left: a file called ext_description.html
right: a file called ext_class1.html

However, ext_frame.html - which is what appears in the location bar - is "concealed". Have a look at your handout, however, where I've put the complete code for this file. We will briefly analyse what's going on here, but to say again, details are in the online teaching materials.

First, the file has a standard document header. Note, however, the different <!DOCTYPE> declaration - "Transitional" replaced by "Frameset". If you want to validate a frameset document, you need to make this change or the validator will complain about the fact that...
...there is no <body> tag. Instead you use <frameset> tags to tell the browser where you want to "draw" the boundaries between the different parts of the screen. This is not a straightforward tag, so rather than going into detail in this lecture, have a look at the online teaching materials afterwards. In brief, however, this window is first divided horizontally - with the top section being 15% of the height of the whole window - this is what the first <frameset> tag does. Then, nested inside this first tag, it is then divided in half vertically - this is what the second <frameset> tag does.
<frame> tags then tell the browser what goes in each of the sections of the screen when the page is first loaded. These refer to HTML files that are, in all ways, "normal" - that is, you could load them individually and they would look the same as any other HTML file.

As the example demonstrated, however, the point of frames is that you can get the browser to load up different files into each of the sections of the page, effectively changing the initial conditions that you specify in the frameset document. How you do this is the topic of the next slide.

<< previous slide

return to lesson 10 index

next slide >>

lecture menu

lecture 10: frameset documents