Complete the following steps that are in blue by following the directions after each step. (Note: you must do these steps EXACTLY as they are or you will not be able to complete the steps in future days.)


  1. Go to Start > All Programs > and find Microsoft FrontPage and open it. ( Note: the program may take a minute to load because it is our first time using it. If  any windows pop up just click the OK or YES buttons.)

    Your screen should look like this now

     
  2. On the Right hand side of the page click the link that says "Empty Web"
    After you click the link your screen should look like this.

     
  3. Click the OK button and your screen should look like this now.

     
  4. On the left hand side of the page in the "Views" column click the Navigation button.
    Your page should look like this now.

     
  5. In the top left corner of the window click the new blank page button.

     
  6. You page should look like this now.

     
  7. In the "Folder List" column right click on the top folder that starts with C:\ and click new page.

     
  8. A new page will be added to your list of pages titled new_page_1.htm
  9. Change the name of new_page_1.htm to Primates.htm by right clicking on the page and then selecting rename and then typing in Primates.htm and then hitting enter.
    Your page should look like this when you are finished.


     
  10. Now you need to move the Primates.htm page over to the teal navigation area of your website. To do so, left click and HOLD DOWN on the Primates.htm page and drag over to the right until you see a line connecting the Primates.htm page to the Home Page like the example below and let go of the mouse button.

     
  11. Your page should look like this now.

     
  12. You need to add a new page just like you did for the Primates page for each of the following...
    - Reptiles
    - Bears
    - Wild Cats
    - African Savanna
    - Polar House
    - Bird House
    See steps 7-11 if you don't remember how to.
     
  13. When you are finished adding all of the pages your screen should look like this.

     
  14. Add a new page to the folder list rename it to Gorilla.htm

     
  15. Drag the Gorilla page over to the navigation section directly under the Primates page so that there is a line connecting them like the example below and then let go.

     
  16. Your page should look like this now.

     
  17. Now add a new page to the folder list and rename it to Chimpanzee.htm and then drag it so that it is under the Primate page and connected by a line like the example below and let go.

     
  18. Your page should now look like this:


    NOT LIKE THIS:

     
  19. No create a new page in the Folder List and rename it Orangutan.htm and drag it to the Navigation section of the window so that it is under the primates and connected to it by a line like the example below.

     
  20. Your page should now look like this.

     
  21. Add each of the following 3 animal pages and move them under the corresponding pages in the navigation section as follows.

    Under the Reptiles page add
        - Komodo Dragon.htm
        - Crocodile.htm
        - Giant Tortoise.htm

    Under the Bears page add
        - Black Bear.htm
        - Sun Bear.htm
        - Grizzly Bear.htm

    Under the Wild Cats page add
        - Tiger.htm
        - Lion.htm
        - Cheetah.htm

    Under the African Savanna page add
        - Elephant.htm
        - Giraffe.htm
        - Gazelle.htm

    Under the Polar House page add
        - Penguin.htm
        - Walrus.htm
        - Polar Bear.htm

    Under the Bird House page add
        - Eagle.htm
        - Yellow Billed Hornbill.htm
        - Crane.htm
     
  22. When you are done adding all of the pages your screen should look like this.

    Continued...


     
  23. Add a theme to your website. To do this you need to start by opening up your home page. To open a page double click on the page in the Navigation Window and it will open up. Your screen will look like this after you click on home page.

     
  24. To add a theme click on Format > Theme.

     
  25. When the Theme window pops up there will be a list of themes that are available on the left hand side of the page. Scroll through the list of themes and choose the one you like the best. The right hand side of the screen will show you what it looks like. Once you have found one you like make sure your select the All Pages button and then click OK. See example below.

     
  26. Next you need to Add a page banner to the top of your home page. To do so click Insert > Page Banner. Check the circle in front of picture and in the text box type Welcome to My Virtual Zoo and click OK. Finally click the Center Button so that the banner moves to the middle of the page and Hit Enter 1 time. Your page should look something like this now.

     
  27. Now you need to add links that will take people to the next sections of pages. To do so click Insert Navigation.
  28. When the window pops up you need to select Bar Based on Navigation Structure like the example below, and then click Next.

     
  29. On the Choose a bar style screen leave the "Use Page's Theme" button selected like the example below and click Next.

     
  30. On the Choose an orientation screen leave the left hand picture for horizontal buttons selected and click Finish.

     
  31. On the Link Bar Properties Window make sure that Child Level is selected like the example below and click OK.

     
  32. Your Screen should now look something like this.

     
  33. Notice the problem we have now. The buttons we just put in all end in .htm. We don't want that to show up on our buttons but we need that ending on the page when we make them in order for the pages to work. Here is how we fix this problem. Start by clicking the Navigation button on the far left side of the screen. You should see this now.

     
  34. We need to delete the .htm from all of our pages in the teal navigation window on the right side of our screen. For example, to delete the .htm from the Wild Cats.htm page complete the following steps...

        - First, right click on Wild Cats.htm
        - Second, select rename
        - Third, delete the .htm from the name and hit enter

    You should go from seeing this: to seeing this:
     
  35. Delete the .htm from every other page in the navigation the same way you did the wildcats page.
  36. Now double click on the home page again and if you did it correctly you should still see the buttons on your home page but they should not have the .htm on them any more. Your page should look something like this.

     
  37. Next you are going to add a horizontal line underneath your buttons. To do so click Insert > Horizontal line. Your page should look something like this now.

     
  38. Now you are going to add a picture to the page. To do so, center your cursor underneath the horizontal line on your page. Next click Insert > Picture > From File. When the window opens up find where you saved your zoo animal pictures at and choose your favorite one and then click Insert. Resize the picture to the size you like by clicking on it and dragging the corners of the picture to the size you want. Your page should look something like this now.

     
  39. The last thing you need to do on the home page is add 1 sentence at the bottom of the page that welcomes people to your site. You may change the font style and color to be anything you want. When you are finished your page should look something like this.

     
  40. Now that you have created the Navigation, Structure, and home page of your website you need to save it. To save your page simply click the save button at the top left hand side of the page one time.

     
  41. Now you must add Content to the rest of your website. To do so add each of the following items to all of these pages: (NOTE: Make sure you save every 3-4 minutes so that you do not lose work you have started.)

    A) For the: Primates, Reptiles, Bears, Wild Cats, African Savanna, Polar House, and Bird House pages you must add...

        - a Page Banner centered at the top of each page
        - navigation buttons under the banner going across the top of each page.
            (Note: on these pages you need to make sure that you select Child Pages and Home Page when you are inserting your buttons, See Below)
           
        - A horizontal line underneath the buttons
        - A picture that relates to the page it is on
        - 1 sentence that welcomes people to that section of your website.

    B) For every animal page (the lowest row in our navigation)
        - a Page Banner centered at the top of each page
        - navigation buttons under the banner going across the top of each page.
            (Note: on these pages you need to make sure that you select Same Level and Home Page and Parent Page when you are inserting your buttons, See Below)
           
        - A horizontal line underneath the buttons
        - A picture that relates to the page it is on
        - 3 facts about that specific animal.

     
  42. Now you need to preview your website and make sure it works. To preview your website you must click on the "Preview in Browser" Button located on the top left hand side of your page (See below)

    This will open your website in your internet window. Try clicking on all of your buttons and going through your website to see if it works.
     
  43. If you can see all of  your pages the you have successfully created your first basic website. If you cannot get to all of your pages you need to go back and fix any errors you have.
     
  44. Once all pages work you are ready to start adding more advanced items to your website by going to the next assignment.