Html Tutorial For Making Web Pages

HTML TUTORIAL
What is HTML Introduction Lesson1:Tags Lesson2:Paragraphs Lesson3:Attributes Lesson4:Lines Lesson5:Graphics Lesson6:Alignment Lesson7:Links Lesson8: Tables Lesson9: Frames
HTML EXTRAS
Uploading Webpages Quick Reference Color Chart Webpage Templates Free Web Graphics Graphics Optimizer Resources Free Software

Frames- Part 1
Part 2 | Part 3

Do You Really Want Them?
Scroll down the page, see what happened? The top part of the page remained stationary while the rest of the page moved. That's what's called frames. Used in moderation they can make a page look pretty snazzy but they can also be a real pain. For instance not all browsers support frames. Some search engines ignore pages with frames and frames can leave visitors fuming when they try to go to a different site but that site ends up being in your frames. But if you still want them read on.

More Than One Page
A web page with frames is actually made up of several pages put together into one. This page for example is actually three pages: One for the top, another for the main section, and a third one which brings them together.

You can see that this page has two frames, the top frame containing the page with the title and horizontal navagation bar, and the bottom frame containing the page with the sidebar and main section. The pages within the frames are written just as you would any html document but the page which brings them together has it's own set of html tags. Here's how the code looks for this page:

<HTML>

<HEAD>
<TITLE>Frames</TITLE>
</HEAD>

</HTML>

Did You Know
All it takes is a teeny little mistake like a missing quotation mark to mess up your webpage big time, so be careful when you write your code.

Notice that the html document starts out just like any other web page except there are no BODY tags. In their place are the FRAMESET tags.

ROWS is an attribute of the beginning FRAMESET tag. It tells the browser that the frames will be horizontal. If you wanted your frames to span vertically (from top to bottom) you would use the COLS attribute instead.

The numbers tell the browser how much of the screen each frame will take up, in this case the first frame takes up 25% and the second 75%. Distribute the percentages among your frames so that the total adds up to 100% and take note that each percentage is separated by a comma. Notice also where the quotation marks are, the second quote doesn't come until after you finished listing your percentages.

Next comes the FRAME tag with the attribute SRC. Remember? The SRC in the IMG tag tells the browser which graphic is to display on the page. Well here it's telling the browser which page is to be displayed in the frame. In this case the first frame will hold a page with the file name "title.html" and the second frame will hold a page with the file name "main.html".

Beacause I wanted my page with "HTML MADE EASY" ("title.html") to be in the top frame I put it first. If however I put my main page in the first frame tag and the title page in the second, guess what? My main page would have ended up in the top frame and my title page in the bottom. Get it? The order in which you put pages in the frames is the order in which they appear on the screen. The same goes for vertical frames, the first frame will be on the left with the other following. If you wanted your page to have three or more frames just add more FRAME tags with the file name of the pages that are to go into them.

NOTE All you who use Internet Explorer must have noticed if you right-click to view the source you will get the code of the page contained in the frame of which you clicked and not the code of the page which brings the frames together. To get at its' code you need to go to the View menu and click Source.

So I guess you're wondering if you can have both horizontal and vertical frames on the same page like this.

Webpage Templates | Graphics | Graphics Optimizer | Resources | Freeware