To show how easy different web layouts can be done we are going to create a nested column web layout that will use buttons to navigate to the different pages. You will create another home page called home2.html that will contain a flash movie and will display the additional external pages when you click on the buttons that will be displayed in the left bottom frame. Go ahead and create your home2.html page and save it as a html file. This page will appear blank at this time.
Because a <FRAMESET> tag can include either a ROWS property or a COLS property, but not both, you have to nest <FRAMESET> tags if you want to create a grid of frames on your Web page. The second row of your current frame layout will consists of two columns. The first column will display the links to the sections of your country (in my example the United States (Northeast, Southeast, Southcentral, Southwest, Midwest, West)), and the second column will display the the section chosen from the first column with a list of states that contain information of historial/educational attractions in that area.
Go to the end of the <FRAME> tag that contains the logo you created earlier (<FRAME SRC="head.html"), and then press the enter key to create a blank line below it. Type the following code:
Notice that you have entered another end frameset tag. This is because you must let the browser know that this is where the nested frames end.
Next you'll specify the sources for the two frames in this row. The left frame will contain the sections or regions of your country, which we will name "sections," and the right frame will contain the home page, which you already created called "home2.html," which is the visible default page that will be seen when you open your frames Web page. You will also create additional pages that will represent each section. The left frame will be static (will not change) and the right frame will change according to the section you choose in the static frame. Return to your text editor that contains yourbusinessname.html and enter the following code after the <FRAMESET COLS="200,*"> by pressing the enter key to insert a blank line. On the blank line, insert the following code:
You have created the layout of the two additional Web pages needed to complete the frames page, but you in have only created one page, the home2.html page that does not contain anything at this point. Create a new file in Notepad (be sure to enter the basic HTML codes), and enter your sections into your document, making sure you enter page breaks where applicable. Choose a background that will enhance your page and be sure to name this file sections. The below is the six regions of the United States. Here is how it appears in notepad:
Here is how they appear in the left frame as shown:
Save your file then view it in your browser. Its beginning to look more like a Web page, however, notice that your logo frames needs to be fixed in order to display the text. At the present time, the text extends beyond the frame border. If all your text is display correctly, then you will not need to extend the top frame down. Continue to follow the directions below if you need to fix your heading.
Don't worry about the look of your home page at this time because you will be creating a movie that will replace your image map and images on your home page. You will now create links for the pages that will load the page in the home frame when selected. This will take the place of the image map. We will not worry about the image map at this point.
Before we begin editing the frames properties, return to yourbusinessname in Notepad and change the <FRAMESET ROWS> tag to reflect 120 pixels instead of 60. This still does not fix the scroll bar problem, so you will have to fix it by controlling the frame's appearance.
