1. How to Make Navigational Frames in an HTML Document By: Patrick Clahane

2. Introduction HTML Frames HTML Frames Divides page into multiple blocks Divides page into multiple blocks Allows user to display multiple documents in one window Allows user to display multiple documents in one window Users Users People with a vary basic knowledge of HTML People with a vary basic knowledge of HTML Materials Materials Computer with internet connection and notepad Computer with internet connection and notepad Header, Links, and Home HTML supporting files Header, Links, and Home HTML supporting files

3. Step 1: Frameset Begin by typing Begin by typing in notepad in notepad This starts the HTML document and breaks the page up into 2 rows This starts the HTML document and breaks the page up into 2 rows The 20% row is the header frame The 20% row is the header frame The 80% row is the links and main frames The 80% row is the links and main frames

4. Step 2: Header Frame Type below the code Type below the code This will make the header.html file appear in the top 20% of the page This will make the header.html file appear in the top 20% of the page If no header.html file is present, in the current folder, a message will appear in the window If no header.html file is present, in the current folder, a message will appear in the window

5. Step 2: Continued

6. Step 3: Links & Main Frames Type Type This breaks the 80% row, created in step 1, into 2 columns This breaks the 80% row, created in step 1, into 2 columns The 20% column is the links frame The 20% column is the links frame The 80% column becomes the main frame The 80% column becomes the main frame

7. Step 4: Links Frame Type below the second code Type below the second code This will make the links.html document appear in the 20% column This will make the links.html document appear in the 20% column If no links.html file is present, in the current folder, a message will appear in the frame If no links.html file is present, in the current folder, a message will appear in the frame

8. Step 4: links Frame

9. Step 5: Main Frame Type Type This will make the home.html document appear in the 80% column (main frame) This will make the home.html document appear in the 80% column (main frame) The name=“showframe” part allows the links to be opened in the main frame The name=“showframe” part allows the links to be opened in the main frame If no home.html document is present, in the current folder, a message will appear If no home.html document is present, in the current folder, a message will appear

10. Step 6: Closing Frame Tags Type after the tag in step 5 Type after the tag in step 5 The 2 codes close the frames The 2 codes close the frames The code closes the html document The code closes the html document

11. Step 7: Targeting Links In the links.html document add the code ‘target=“showframe”’ to each of the links that you want to appear in the main frame. In the links.html document add the code ‘target=“showframe”’ to each of the links that you want to appear in the main frame. Without this code the link will open and take over the entire window Without this code the link will open and take over the entire window

12. Step 7: Targeting Links

13. Conclusion Questions?

14. Works Cited "Frames." W3School. 2008. 30 June 2008. "Frames." W3School. 2008. 30 June 2008.