Dr. Mark Smith

Home
Up

Creating a web with MS FrontPage

Front Page is a powerful web design tool. The instructions below explain the fundamentals of using Front Page, the basics for this class assignment. If you desire, you can experiment with the more advanced features of the application.

Before following these instructions to begin a web, sketch out a flow chart so you can design your web. Remember that you are creating a web, not just a web page. A web includes all the links, graphics, colors, etc. that make a web site.

Before you can publish your files to the web, you must get a VSU Grits account and then create a public_html directory. To get a Grits account, visit the VSU home page and follow the link Student E-Mail Accounts.

To begin a web site on FrontPage, you should first lay out the fundamental file structure.

  1. Click file, then new, then web.
  2. To the right, designate the web’s location. On the computers in the electronic classroom, you can store your webs in the temp folder. Therefore, enter c:\temp\myweb.
  3. Select a One Page Web. Although you will end up with numerous pages, you may begin with one page. Note that you have other options: Corporate Presence, Personal Web, etc. These options furnish templates for a web. However, I would like you to build a web from scratch.
  4. Click open and a blank page will open up to the right. New_page_1.htm will appear in the upper left-hand corner of the window.
  5. In the views pane, click folders.
  6. In the folder window, you will notice at least two folders, one named private, the other images. You will also note at least one page, index.htm. Double click this page name.
  7. A blank page should appear with index.htm in the upper left-hand corner. This is also your home page in the navigation window.
  8. Click format and shared borders. (This function, along with themes, allows you to create a uniform appearance to your web.)
  9. At the bottom of the shared borders box, click top and left.
  10. Decide where you want you navigation buttons to go. Click the appropriate box under top or left.
  11. Under apply to, click all pages. This action will load this format on all your web pages.
  12. Click ok.
  13. Go back to format and click theme. This is where you will select the aesthetic features for your page.
  14. Scroll through the different themes in the box on the left, and select the one you want to use. Note that you can customize the themes my clicking modify at the bottom of the page.
  15. When finished here, be sure to click all pages under apply theme to:.
  16. At this point, go ahead and create and organize your web files according to your flow chart.
Left click then right click your arrow on the root folder at the top of the folder list pane and select new folder. When the folder appears on the tree, left click then right click it again to rename it according to your needs. Continue this process until you have created folders to organize all your pages. (Note that these folders are for organizational purposes only and cannot appear on the web; only pages can appear on the web.)
When you have created all your folders, go back and create the pages that will go in the folders.
To create pages within the folders, select the appropriate folder and right click it to select new page.
A page entitled new_page_# will appear next to an icon under the folder.
Select the new page and right click it to rename it according to your needs.
Note that each folder should have at least one index page to which you link all the child pages.
You can go back and add or delete pages at any point.
  1. After you have laid out your preliminary web files, you need to design the web itself.
Select navigation in the views pane. You will see a field to your right with a home page. This is the same as the index page in your directory.
Left click the pages under the folder list and drag them to the right to link with the home and parent pages. With some practice, you can easily link these pages together.
Continue this process until you have laid out your entire web in the navigation window.
  1. After you have created all your folders and pages, point your arrow at each page in the navigation window and left click and then right click your mouse to rename them. Note that this name will be the one that appears at the page’s top and on the navigation buttons.
  2. You can now access the individual pages, inserting whatever information you wish.

 

To create a public_html directory,

log onto your Grits account.
At the grits prompt, grits%, type ls.
The computer will then list whatever directories are in your account.
If public_html does not appear, type mkdir public_html and hit enter.
Type ls again, and you should now see public_html listed.
You may now log out of grits.