Create Websites with Frames

Create Websites With Frames (video)

Alternative instructions for NVU | Change MainFrame page to an existing page or site

  1. Open Dreamweaver
  2. Click ‘File’
  3. Click ‘New’
  4. Click ‘Page From Sample’ on the left hand side
  5. Click ‘Frameset’ from the center
  6. Click ‘Fixed top, Nested left’ on the right
  7. Click ‘Create’
  8. Click ‘OK’
  9. Click ‘File’
  10. Click ‘Save All’
  11. Create a new folder called ‘homework6’
  12. Save the frameset as index.html
  13. Save the main body as home.html
  14. Save the left bar as navigation.html
  15. Save the top as header.html
    *************I WILL CREATE THIS PAGE FOR DETROIT MICHIGAN**************
    ********************you can create this page for whatever you like********************
  16. In the header:
    1. Type ‘Welcome to Detroit’
    2. Center the header
    3. Change the font to x-large
    4. In page properties, change the page background to dark grey
    5. Change the font color to white
  17. In the left hand navigation bar:
    1. Type ‘Home’
    2. Hit enter
    3. Type ‘Things To See’
    4. Hit enter
    5. Type ‘Places To Stay’
    6. Highlight the three lines of text and select ‘B’ for bold
    7. In page properties, change the page background to dark grey
    8. In page properties, click ‘Links’ on the left hand side
    9. Change links, visited links, rollover links, and active links colors to white
    10. Highlight ‘Home’ and make it a hyperlink to home.html
      1. Under target select ‘main frame
    11. Highlight ‘Things To See’ and make it a hyperlink to see.html (this page hasn’t been created yet)
      1. Under target select ‘main frame’
    12. Highlight ‘Places To Stay’ and make it a link to stay.html (this page hasn’t been created yet)
      1. Under target select ‘main frame’
  18. Drag the verticle frame line to the right by left clicking on it and pulling it to the right. Do this until all text is visible on one line (per item).
  19. Add some text and images to the main frame (home.html)
  20. Add the Things To See page
    1. Click ‘File’
    2. Click ‘New’
    3. Click ‘Blank Page’
    4. Click ‘HTML’
    5. Click ‘Create’
    6. Add some content to the page, but no links!
    7. Save the page as see.html
  21. Add the Places To Stay page
    1. Click ‘File’
    2. Click ‘New’
    3. Click ‘Blank Page’
    4. Click ‘HTML’
    5. Click ‘Create’
    6. Add some content to the page, but no links!
    7. Save the page as stay.html
  22. Click ‘Save All’
  23. Open index.html and view it in your browser. All secondary pages (home.html, see.html, and stay.html) should appear in the main body portion of your page with the header and navigation bar displayed as well.
  24. Create a link to homework6/index.html from your homework page (comw100/index.html).
  25. Upload your homework6 folder and your index.html file to your web space.

Remember that you can create this on any topic that you desire and design it (colors, fonts, pictures) any way you wish.

Advertisements

Comments are closed.

%d bloggers like this: