The main frame page is the page that people will see first when they come to your frameset. Think of it the way you would think of the index.html page on a non-framed Web site.
Step 1 to Building Your Main Frame
Open your favorite text editor to a blank page. Save this page as main.html.
Step 2 to Building Your Main Frame
Again, start with your basic HTML tags:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>My First Framed Page</title>
</head>
<body>
This page is more likely to have the title appear, as it is the page that is referenced in your noframes page.
Step 3 to Building Your Main Frame
As I said above, think of this page as the index.html page for your frameset. So, you would want to have a headline on your page:
<h1>My First Framed Page</h1>
Step 4 to Building Your Main Frame
Links on this page don't have to be targetted (unless you want them to open in a different frame), so you can write them as you normally would. Remember that some Web Developers don't like it when you open their page in your frameset, so it is polite to target external links to the special target _top. This tells the browser to open the link in the same browser window, but without any of your frames.
Build your index page with information that is relevant and interesting.
<p>I have been writing HTML for 3 months now, and I felt that it was time for me to build a framed page. This is the result.</p>
<p>You can see some <a href="photos.html">photos of me and my family</a> or just <a href="about.html">learn more about me</a>.</p>
<p>I learned to write frames from the <a href="http://webdesign.about.com/od/frames/a/aabg012100a.htm" target="_top">Web Design/HTML @ About.com Frames Tutorial</a>. Now <b>you can too!</b></p>
Step 5 to Building Your Main Frame
Finally, you should include alternative navigation on your main page, so that your pages remain accessible to people with browsers that can't view frames.
<p>
<a href="main.html">main</a> |
<a href="photos.html">photos</a> |
<a href="about.html">about me</a>
</p>
Step 6 to Building Your Main Frame
Then close the page like you would any other HTML document:
</body>
</html>
Step 7 to Building Your Main Frame
And don't forget to save it. Now, you can write the other two pages for your frameset (photos.html and about.html) and you'll have a fully-functional frameset.
Once you upload these pages to your Web hosting provider you'll be able to tell all your friends about your new "framing" ability.
