Tutorial on Creating Web Pages
with FrontPage Editor©

http://www.siec.k12.in.us/~west/online/website/index.html

Tammy Payton

||| West Home Page ||| Designing Web Pages |||

red.gif (74 bytes)

Let's Begin

Creating Your Web Pages

More Tips for Your Site

  red.gif (74 bytes)

Thanks for visiting! Do you have any questions? Comments?
E-mail to
Tammy Payton, web editor,


Step 1: Create a Folder on Your Hard Disk

||| Tutorial on Using Front Page© ||| Step Two |||

Tammy Payton

red.gif (74 bytes)

Create a folder on your hard disk. With this folder, you will mirror what is in this folder to what you will be uploading on your web server. To do this:

  1. Click on the icon called "My Computer" that is on your desktop.

35.gif (4244 bytes)

 

2. Click on "C" for your hard drive.

32.gif (4802 bytes)

 

3. Click on "File"

4. Click on "New"

5. Click on "Folder"

33.gif (2025 bytes)

 

6. Name this file anything that you want. Always use lower case letters when naming folders and files.

7. Double click on your new file so that your new file appears in the address window.

8. Create a new folder by repeating steps 3, 4, and 5. Create a new folder for each type of file that you might want to include in your web site. Suggestions are:

·         img - image files

·         vid - movies, quick time files,

·         aud - audio samples such as WAV files

·         apps - java applets, active X scripts

·         shock - shockwave files

34.gif (3689 bytes)

red.gif (74 bytes)

||| Tutorial on Using Front Page |||

 


Step 2: Capturing Images from the Internet

||| Step One ||| Tutorial for Using Front Page ||| Step Three |||

Tammy Payton

red.gif (74 bytes)

Before capturing images from the Internet, you need to consider the following:

·         Is this a reliable source? You should research each site that offers graphics for web use and make sure that the images you will be taking from that site is a reliable source. Some sites have created a catalog of images by capturing graphics without the creator or illustrator's permission. This is an infringement of their intellectual property. Never use graphics from sites that do not have clear ownership of that graphic.

·         Do you have permission to use this graphic? Many sites welcome the use of their graphics on web sites, but there may be some restrictions as to whom can use this graphic. Usually there is no charge for the use of graphics on non-profit organization sites and only a nominal fee for commercial web sites.

·         Does the creator of that graphic want a link back to their site? Read the terms that the owner of the graphic has for the  use of their images. Often the people who created that graphic require that a link back to them is included.

To save an image on your hard drive, follow these steps:

  1. Position your mouse arrow on top of the graphic that you have selected.
  2. Use the right click button on your mouse and choose "Save Picture As..."

36.gif (8983 bytes)

 

3. Find the folder that you created on your hard drive for your web site and save the image in your graphics folder.

37.gif (4808 bytes)

 

4. Use lower case letters for naming your file. These images should be saved in gif or jpeg format.

38.gif (6898 bytes)

 

Suggested Graphic Sites

·         1st Internet Gallery of GIF Animations

·         All Browser Safe Colors

·         Amenco Free Stuff

·         Angel Art Gallery

·         Animation and Graphics for Your Web Site

·         Badger's Animated GIF Gallery

·         Becki's Garden of Graphics

·         Billy Bear's Bullets, Icons, and Clipart

·         Cameo's Animal Hut

·         Chibi Creation

·         Clipart.com

·         Cool Graphics: Hotlink of Graphics

·         Country Graphics

·         Graphic Effects

·         Graphic Garden

·         Graphic Maps

·         Graphics by Stephanie

·         HTML Background Color Selector

·         Jelane's Free Web Graphics

·         Kitty Roach's Page Works

·         Laurie McCanna's Free Art Site

·         MACfonts.com

·         PCFonts.com

·         Media Builder

·         Mikey's Graphics Page

·         Realm Graphics Web Images

·         Skylight's Kids Graphics

·         A Texture a Day

·         Webpedia Animation Archive

·         World Atlas

 

red.gif (74 bytes)

||| Tutorial for Using Front Page |||

 


Step 3a: Choosing Color for Your Site

||| Step One ||| Tutorial for Using Front Page ||| Step Three |||

Tammy Payton

red.gif (74 bytes)

One of the most important steps that you should research for your web pages is deciding what colors, graphics, and background you will be using. When choosing images you should

·         Is your text color readable against the background? Visit this web site to view different combinations of background color and text.

216 All Browser Safe Colors
http://primeshop.com/html/216colrs.htm

·         Do the colors that you have chosen dither in appearance? Sometimes when you choose a particular color for background or graphics and then view that image or background in the browser, the colors suddenly become grainy. When colors dither in appearance like this, you have used colors that are not one of the 216 browser safe colors. Visit this web site and see how you can still achieve the color scheme for your site that you want.

Color Mix
http://www.colormix.com/

·         Does the creator of that graphic want a link back to their site? Read the terms that the owner of the graphic has for the  use of their images. Often the people who created that graphic require that a link back to them is included.

To save an image on your hard drive, follow these steps:

  1. Position your mouse arrow on top of the graphic that you have selected.
  2. Use the right click button on your mouse and choose "Save Picture As..."

36.gif (8983 bytes)

 

3. Find the folder that you created on your hard drive for your web site and save the image in your graphics folder.

37.gif (4808 bytes)

 

4. Use lower case letters for naming your file. These images should be saved in gif or jpeg format.

38.gif (6898 bytes)

 

Suggested Graphic Sites

·         1st Internet Gallery of GIF Animations

·         All Browser Safe Colors

·         Amenco Free Stuff

·         Angel Art Gallery

·         Animation and Graphics for Your Web Site

·         Badger's Animated GIF Gallery

·         Becki's Garden of Graphics

·         Billy Bear's Bullets, Icons, and Clipart

·         Cameo's Animal Hut

·         Chibi Creation

·         Clipart.com

·         Cool Graphics: Hotlink of Graphics

·         Country Graphics

·         Graphic Effects

·         Graphic Garden

·         Graphic Maps

·         Graphics by Stephanie

·         HTML Background Color Selector

·         Jelane's Free Web Graphics

·         Kitty Roach's Page Works

·         Laurie McCanna's Free Art Site

·         MACfonts.com

·         PCFonts.com

·         Media Builder

·         Mikey's Graphics Page

·         Realm Graphics Web Images

·         Skylight's Kids Graphics

·         A Texture a Day

·         Webpedia Animation Archive

·         World Atlas

 

red.gif (74 bytes)

||| Tutorial for Using Front Page |||

 

Step 3: Using Front Page Editor©
with Standard Toolbar

||| Step Two ||| Tutorial for Using FrontPage© ||| Step Four |||

Tammy Payton

red.gif (74 bytes)

Microsoft's FrontPage© is a powerful software package that will do amazing applications to help you publish and maintain your web site. There are two dynamic programs nestled within FrontPage©. The first program is called FrontPage Explorer© which is designed to maintain and manage your web pages. They offer templates which are especially helpful if you are designing web pages that will be displayed on an intranet within your local area network. It will help you upload your web pages and all graphics that are needed so that each web page that you have created is displayed properly on the World Wide Web. It is an extremely powerful and dynamic piece of software.

Our focus will be on how to use Microsoft's FrontPage Editor©. This software is not as powerful as FrontPage Explorer©, but it is a wonderful WYSIWYG (What You See Is What You Get) web page editor. With this software, you can create your own templates for your web site and easily manipulate and add new components to your web pages. This is not a comprehensive tutorial on using FrontPage Editor©, but it will help you begin designing and creating your school web site. For additional links that you should explore for learning how to use FrontPage©, visit these sites:

·         Welcome to FrontPage
http://www.actden.com/fp/

·         Microsoft's FrontPage
http://www.microsoft.com/frontpage/

There are two ways that you can open Microsoft's FrontPage Editor©:

  1. You can create a shortcut on your desktop, then execute the program from there.

39.gif (2685 bytes)

 

2. If you have opened FrontPage Explorer©, cancel the dialog box called "Getting Started" and click the parchment and quill icon on the toolbar.  This will execute FrontPage Editor©.

3. Close FrontPage Explorer©

40.gif (8198 bytes)

Using Standard Toolbar:

It is recommended that when you are working in FrontPage Editor©, that you use the standard toolbar which will help you quickly edit your data. Follow these directions if you cannot see the toolbar at the top of FrontPage Editor©:

  1. Click on "View"
  2. Highlight the words "Standard Toolbar" then let go of the mouse button. You can select and de-select the toolbar so that it is visible and invisible on your work page in this way.

Below are two images of the same standard toolbar, but with some minor differences. Some of the icons that appear on the toolbar are not highlighted in one image and are highlighted in another. How to highlight so that the icons are active for your use will be discussed in the table below.

64.gif (1973 bytes)

68.gif (1878 bytes)

62.gif (1908 bytes)

Section 1: There are three options for you to choose:

  • The first icon will place a clean page on your screen.
  • The second icon will open a file that is in your computer so that you can edit it.
  • The third icon will let you save your file. Whenever you edit the page on your screen, you should periodically click this icon so that your material is saved.

Section 2: There are three options for you to choose:

  • The first icon will let you print the file that is on your screen.
  • The second icon will execute your browser and let you preview the file on your screen within that browser.
  • The third icon will spell check your file.

Section 3: As you can see, these icons are not always highlighted. Two of these icons will only become active if you have either some text highlighted or an image chosen. Not all three icons will be highlighted at the same time. Either the cut and copy icons are highlighted or the paste icon is highlighted.

  • The first icon represents the ability to cut text or graphic out of your file and place that information in a temporary clipboard.
  • The second icon represents the ability to copy highlighted text or graphics and place duplicate information that is highlighted into the temporary clipboard. This will not remove the highlighted information, but only copies the highlighted information.
  • The third icon represents the clipboard that is holding the cut or copied information. Just position your blinking cursor wherever you want the information pasted into, then use your mouse and click on this icon to paste that information there.

Section 4: These two buttons represent "undoing" the last activity that you did on the screen or "redoing" what you just undid.

Section 5: This icon represents FrontPage Explorer©. By clicking on this icon, you will execute this program on your desktop.

Section 6: There are three icons to use in this section:

  • The first icon represents FrontPage© componenets that you can add to your web page. Sometimes these components will be unreadable with any browser other than Internet Explorer or sometimes they cannot be executed successfully if the webserver which is hosting your web pages does not have the needed files loaded on the webserver to execute the components.
  • The second icon represents the ability to insert a table into your web page.
  • The third icon represents the ability to insert an image into your web page.

Section 7: This icon will create hyperlinks in your web page.

Section 8: There are four icons to choose from in this section:

  • The first two icons work together. These arrows are not always highlighted as you can see. When you have more than one file open in FrontPage Editor©, you can go back to the page that you had just looked at, then you can advance to the page that you just came from.
  • The third icon is the refresh button.
  • The fourth icon becomes highlighted when you begin viewing a hyperlink on the World Wide Web. You can click on this icon to stop this action.

Section 9: This icon is called "Format Mark Command." When this icon is chosen, the paragraph tags as well as line breaks are displayed on your web page when in "Normal View."

Section 10: This icon represents quick help if you have a question about a component within the viewed screen. Just click on this icon then position your mouse over the component that you would like more information about.

red.gif (74 bytes)

||| Tutorial for Using FrontPage Editor© |||

 

 

 


Step 4: Creating a Template

||| Step Three ||| Tutorial for Using Front Page© ||| Step Five |||

Tammy Payton

red.gif (74 bytes)

Congratulations! You have researched and found the graphics that you will use for your web site and now you are ready to begin creating your first web page. The first step is to create a template for your web site.

There are several good reasons why you should create a template for your web site:

1.      When repeated graphics are used, the download time for each web page is reduced. Visitors won't stick around waiting for a large bandwidth graphic to download for each new web page. Once a graphic has been downloaded completely, it will not have to be downloaded again for the remaining pages on which it appears.

2.      A template offers an aesthetically pleasing presentation of information.

3.      Navigational links will be placed at the same place on each page which will allow visitors to easily navigate from page to page.

Elements to include in the template are:

1.      Background color or image

2.      Choose the text and hyperlink colors that can be easily read against the chosen background

3.      Banner or heading that identifies this web site

4.      Placing navigational links which will be used to point visitors back to your home page or the choice of returning to the previous or advancing to the next page.

Steps for creating the template are:

  1. Open FrontPage Editor©. A new, white page will open up.
  2. Click on the disk icon that is on the Standard Toolbar to save this new file.

1.gif (3768 bytes)

 

3.      Find the folder that you created on your hard drive for your web site and save this file as template.htm

42.gif (4432 bytes)

To see the template for this tutorial, visit this hyperlink:

Template for Tutorial

To find out how to add information to your template, follow steps six through fourteen of this tutorial. Once your template has been created and saved, simply open the template up in FrontPage Editor© and follow these steps:

How to use your template:

  1. Open your template up in FrontPage Editor©
  2. Click on "File"
  3. Click on "Save As"
  4. Choose the file folder that you want your file to appear in.
  5. Name this file using only lower case letters. Avoid long names. There should be no spaces in your file name.
  6. Click "OK"
  7. Now, click on "Format"
  8. Click on "Background"
  9. Click on the "General" tab
  10. Go to the "Title" box and give your new web page a unique title.
  11. Click "OK"
  12. You are ready to begin entering new data into your web page!

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||


Step 5: Creating Your Home Page

||| Step Four ||| Tutorial for Using FrontPage© ||| Step Six |||

Tammy Payton

red.gif (74 bytes)

After you have created a template for your site, the next page that you should create is your home page. This is the most unique and important page on your web site. Your home page should have the following elements:

·         It should be named "index.html" or whatever the default home page is on your web server. Check with your web server host to see what the default name is for the home page.

·         The information on the home page should be a table of contents. Visitors that come to your web site want to quickly know what information they can find here. They do NOT want to scroll through lengthy introductions or information.

·         WebSite Garage at http://www.websitegarage.com recommends that you keep the total size of your home page to under 40K and the remaining web pages to under 30K.  According to Emarketer.com, "Pages taking over 20 seconds to load can lose over 50% of visitors."

·         If you are designing a home page for your classroom, you should include a link to your school's home page. If you are designing a home page for your school, you should include a link to your corporation's web site. If you are designing a home page for your district, you should include a link to the State Department of Education. This will help lend credibility to your web site.

·         Whether you are creating a home page for your classroom or school, you should include a snail mail address somewhere on this page. Avoid using abbreviations of your state or province's name. Many people may not understand what the abbreviations represent. Also include a phone and fax number so that visitors can reach you quickly if they need to contact you about information that is related to your web site.

·         Include on your home page when you created this web page and when was the last time you edited the material on your home page. This will lend credibility to your web page. People do not want to read old data with links that are dead.

·         Include an e-mail hyperlink to a contact person. People will want to contact someone that is responsible for the content of the web page they are visiting. The contact person for your web site should never be a student.

Follow Steps Six through Fourteen to be sure that all the content that a good web page should include, is found on your home page.

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

Step 6: Formatting the Background Information

||| Step Five ||| Tutorial for Using Front Page© ||| Step Seven |||

Tammy Payton

red.gif (74 bytes)

This step will show you how to choose background colors for your web page, set the text colors that will be used throughout your web page, and enter information into your web page so that search engines can correctly catalog and describe your web page.

1.      Go to "Format"

2.      Go to "Background"

3.      There are three tabs that you will use to format the information you will need for your web pages:

·         General

·         Background

·         Custom

3.gif (5307 bytes)

 

Under "Background," you can choose the background image that you want to use for your web pages. You will choose the color of the text, hyperlink, visited hyperlink, and active hyperlink. Be sure that the text colors can be easily read against the background you are using.

 

Use these sites to check the compatibility of your background with the text:

All Browser Safe

HTML Background Selector

6.gif (8901 bytes)

 

Under "General," you should type the title for this web page. Each web page that is created should have a unique title.

5.gif (6688 bytes)

 

Under "Custom," you should add the following information as shown in this image.

This information will tell search engines how to catalog and correctly describe the material on your web site.

When you are finished entering in the data, click "OK."

11.gif (7721 bytes)

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Step 7: Editing and Previewing Information

||| Step Six ||| Tutorial for Using FrontPage© ||| Step Eight |||

Tammy Payton

red.gif (74 bytes)

Now that you have formatted the background elements for your web site, you can begin adding the visible data that visitors will see when they come to your web page.

  1. Before adding any new information, be sure that you have saved the information that you have entered so far.
  2. Look at the image to the right. At the bottom of this image, you will see three tabs named: Normal, HTML, and Preview.

1.gif (3768 bytes)

FrontPage Editor© allows you to look at your web page in three kinds of format. Each one has a specific use:

  • Normal: this is the format you will use to edit the visible information on your web page. For additional tips on how to add information to this page, here are more resources that you can use:

Welcome to FrontPage
http://www.actden.com/fp/

Microsoft's FrontPage
http://www.microsoft.com/frontpage/

  • HTML: Click on this tab to view the Hyper Text Mark-up Language that this WYSIWYG editor is coding your web page in. If you will be writing several web pages and you are the webmaster of your school site, it will be extremely beneficial for you to learn how HTML is written. From time to time, you will need to edit or "tweak" your web page under the HTML tab.

FrontPage Editor© is so powerful, though, that there may be times that you will need to edit your web pages using wordpad or notepad.  When you use FrontPage Editor©, it is assumed that you are using a web server that has files that will help you execute dynamic commands created by FrontPage Editor© for your web page. These resources include image maps, web counters, and databases.

If your web server does not have the files required to successfully execute commands such as image maps and web counters, your information will be unreadable by people visiting your web page. Every time you open your file in FrontPage Editor© and it detects HTML coding for image maps and web counters, it will rewrite your files so that it is executeable only with the files that it assumes is loaded on your web server. Check with the people who are maintaining your web server and see if these files are on your web server.

If you are using a web server that does not have the files that will help you execute these dynamic resources, you must edit your web page using wordpad or notepad.  For tips on how to add coding to your web page, here are some suggested resources:

Off Line Resource

HTML for the World Wide Web: 4
by Elizabeth Castro
published by Peachpit Press

 

On Line Resources

Web Developer's Virtual Library
http://www.stars.com/Authoring/

A Beginner's Guide to HTML
http://www.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimerP1.html

So, You Want to Make a Web Page
http://junior.apk.net/~jbarta/tutor/makapage/index.html

  • Preview: This tab will display your web page as it would appear in a web browser. You are unable to edit your web page under this tab.

There are two ways that you can preveiw your web page. When previewing, you will be unable to edit any data.

  1. Use the "Preview" tab found at the bottom of FrontPage Editor© page.
  2. Choose the icon at the top on the Standard Toolbar to preview this page in an actual browser as seen in the graphic on the right.

43.gif (3794 bytes)

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Step 8: Inserting and Resizing Images

||| Step Seven ||| Tutorial for Using FrontPage© ||| Step Nine |||

Tammy Payton

red.gif (74 bytes)

You should avoid over doing the number of graphics on your web page.  Graphics should be as small as possible and are usually the number one reason why it takes web pages so long to download. According to Emarketer.com, "Pages taking over 20 seconds to load can lose over 50% of visitors."

WebSite Garage at http://www.websitegarage.com recommends that your home page should be under 40K and the other pages on your site should be under 30K. You should keep these recommendations in mind when your begin inserting graphics in your web page.

Follow these steps for inserting images:

  1. Position your blinking cursor on your page where you want the image to be inserted.
  2. Click on the "Insert Image" icon as seen in the graphic on the right which is found on the Standard Toolbar.
  3. Browse through your directory until you find the folder for your web site.
  4. Go to your image folder.
  5. Choose the image that you want to insert in your web page, by highlighting the name.
  6. Click "OK"

44.gif (2106 bytes)

Follow these steps for resizing images:

  1. Take your mouse and click once on the image that you want to resize. You will see "handle bars" surrounding your image.
  2. Grab one of the handle bars and resize the image until it is the size that you want, then let go.

46.gif (4802 bytes)

Follow these steps for editing the information about the images:

Some people who will be viewing your web page may have decided not to download any graphics and are only looking at your text information. When you insert an image into your web page, FrontPage Editor© automatically adds the name and the size of the image as a text alternative for those people viewing your web page without graphics.

You can edit the information about your image by following these steps:

1. Place your mouse on top of the image and right click the image one time.

2. Drag your arrow down to "Image Properties"

47.gif (4308 bytes)

3. Enter the text that you want to appear to describe your image.

48.gif (1457 bytes)

Follow these steps for image alignment and border thickness:

You can also add or remove borders from around your image and align your image with the text. At the top of the "Image Properties" box, there are three tabs: "General," "Video," and "Appearance."

1. Select "Appearance"

49.gif (2844 bytes)

2. Under "Border Thickness" you can designate the width that you want.

3. Under "Alignment" you can position your graphic on your web page. By choosing an alignment, your text will wrap around an image. If you keep the alignment as "default," the text in your web page will not wrap around the image.

50.gif (3845 bytes)

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Step 9: Editing Graphics with
FrontPage Editor©

||| Step Eight ||| Tutorial for Using FrontPage© ||| Step Ten |||

Tammy Payton

red.gif (74 bytes)

FrontPage Editor© has a handy graphics editor.

83.gif (2672 bytes)

84.gif (1589 bytes)

Select an image with your mouse by placing your mouse ontop of an image and clicking on that image one time. Notice how handlebars are now surrounding that image and a toolbar becomes visible on the bottom left hand side of your screen:

Using the image toolbar

Explore the functions of the image toolbar by saving this image of the lion in the right hand cell. Next insert this image in your web page and begin exploring the editing icons on the image toolbar.

lion.gif (655 bytes)

Creating Imagemaps

87.gif (394 bytes)The first five icons found on the Image Toolbar have been designed so that you can create clickable hotspots within an image which is called an imagemap. The imagemap that FrontPage Editor© creates will be unreadable if the webserver which is hosting your web pages does not have the needed files loaded on the webserver to execute the imagemap. Check with the web server provider to see if the files have been added. Tell them that you are creating web pages with FrontPage© and would like to know if they have the files on their web server that will read

More icons on the image toolbar

[FrontPage Image Map Component]

Read below to find out why this image is not appearing in your browser.

lion.gif (655 bytes)

lion.gif (655 bytes)

lion.gif (655 bytes)

88.gif (137 bytes)Use this icon to add text to a graphic. Select your graphic, then choose this icon. A text box will appear inside of your graphic. You can use the "Format Toolbar" to choose the font, the color of the font, and the size of the font that you want to put in your image. You can move the text to any place within your graphic. This icon actually creates a small imagemap on your graphic. Because imagemaps require added files to be loaded on your web server in order for them to be read and my web server does not have the files located on it, this image is unreadable. Click "Save" after editing your picture.

85.gif (140 bytes)Use this icon to create a transparent background for your image. Select your graphic, then click on this icon. Choose the color in the image that you want to become transparent. Once it is transparent, click on "Save."

86.gif (130 bytes)Use this icon to crop the image. Select the graphic, then click on this crop icon. Handle bars will appear inside of the graphic. When you have enclosed the portion of the graphic that you want, you can either press "Enter" or you can reclick the crop icon. This will remove the excess. Click "Save" after you have finished editing your picture.

89.gif (322 bytes)The next three icons on the image toolbar will do one of three things:

  • Washout: This is the editing icon that was used to produce the effect on the image above.
  • Black and White: this will turn all of your colors into black and white.
  • Reset: this will restore an image to it's saved version.

And more icons...

lion.gif (655 bytes)

lion.gif (655 bytes)

lion.gif (655 bytes)

lion.gif (655 bytes)

90.gif (280 bytes)These icons will allow you to rotate or flip your image. Select your graphic, then rotate or flip your image. Click "Save" after you have finished editing your picture.

91.gif (333 bytes)These icons will allow you to brighten or darken your image. If you do no like how your image appears, click on the "Reset" icon to restore your image to the original settings. Click "Save" after you have finished editing your picture.

92.gif (182 bytes)This icon will add beveled edges to your graphic. Select your graphic, then click on the beveled icon in the image toolbar. Click "Save" after you have finished editing your picture.

93.gif (158 bytes)This is the "Resample" icon. Whenever you resize your images, either by making them bigger or smaller, you sometimes lose clarity in your image. By clicking on the resample icon after resizing an image, you can add crispness or clarity to your image. WARNING: once you have chosen to resample an image, you cannot reset your image to it's original setting. It is a good idea to save a copy of an image before you begin resizing it.

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Step 10: Formatting Your Web Page
with a Top Bar

||| Step Nine ||| Tutorial for Using FrontPage© ||| Step Eleven |||

Tammy Payton

red.gif (74 bytes)

How you create your template is effected by the kind of background that you have chosen to use. When using a top bar, you have three choices:

1.      Use a table. Take a look at how this web page has been designed. Graphics have been inserted into a table at the top of this page. This will push all of the information that is placed on this web page down so that added information is only visible on the white background.

2.      Hit "Enter" until you begin at the point where you want to begin adding information to your web page.

3.      Use a transparent image.

Insert a transparent image at the top of your page. Here is a transparent image that you can download and use. Name this image "spacer.gif" and remember to save this image in your web site directory in the folder for your images.

spacer.gif (104 bytes)

Follow these steps for inserting images:

  1. Position the blinking cursor at the top of your page.
  2. Click on the "Insert Image" icon as seen in the graphic on the right.
  3. Browse through your directory until you find the folder for your web site.
  4. Go to your image folder.
  5. Choose "spacer.gif"
  6. Click "OK"

44.gif (2106 bytes)

Follow these steps for resizing images:

  1. Take your mouse and click once on the transparent image. You will see "handle bars" surrounding your image.
  2. Grab one of the handle bars and resize the image until it is the size that you want, then let go.

45.gif (3251 bytes)

View these pages to see what the information looks like when adding the transparent file:

·         Page without the transparent image

·         Page with the transparent image

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Step 11: Formatting Your Web Page
with a Side Bar

||| Step Ten ||| Tutorial for Using FrontPage© ||| Step Twelve |||

Tammy Payton

red.gif (74 bytes)

How you create your template is effected by the kind of background that you have chosen to use. When using a side bar, you have two choices:

Use the indent button on the tool bar:

Before entering any data on your web page, click the indent button on the tool bar as many times as it takes to move the information off of your background image.

View this web page to see what the data looks like after the indent button has been used:

Formatting a Web Page Using
the Indent Button

 

55.gif (1450 bytes)

Use a table to push your information off of the background image:

1. Insert a table into your web page by clicking on the table icon on the tool bar, then highlighting one cell.

51.gif (4638 bytes)

 

2. To align your table so that the web page information is not written on top of the background image, follow these steps:

  • Position your mouse inside of the table and click the mouse one time on the right side.
  • Choose "Table Properties"

52.gif (18547 bytes)

 

3. Edit at least three pieces of information inside of the "Table Properties" box:

  • Specify Width: begin with 90 percent or 85 percent.
  • Alignment: choose "right"
  • Border Size: "0"

4. Click "OK"

53.gif (4229 bytes)

 

54.gif (16540 bytes)

You can insert another table within the table that you just created by placing the blinking cursor where you want the new table to be inserted into. Then repeat step number one.

Visit this web page to see additional tips for formatting cells within a table:

Creating a Web Page with a Side Bar

 

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 

 


Step 12: Adding Text to Your Web Pages
with Format Toolbar

||| Step Eleven ||| Tutorial for Using FrontPage© ||| Step Thirteen |||

Tammy Payton

red.gif (74 bytes)

There are helpful tool bars that will allow you to quickly edit and format your text. If you cannot see the format toolbar, you can view this bar by:

1.      Clicking on "View"

2.      Clicking on "Format Toolbar"

The first choice that appears on the format toolbar, is a drop down box that will let you choose what kind of text you will use in your web page. Most of your document will be written in normal text. Also, there is a choice of formatting your headings that you use within your document. When writing web pages, it is important to use the heading text formats when typing headings within your web page and to never use the heading text formats for formatting the text in the main body of your web page.

Line breaks and paragraphs:

Line Breaks

Paragraph

By pressing "shift" and "enter"
you will be inserting a line break
into your document.
This cell shows what happens
to your text when you press
"shift" and "enter" at the end
of each of these lines.

By pressing "enter"

you will be inserting a paragraph

break into your document.

This cell shows what happens

to your text when you press "enter"

at the end of each of these lines.

Usually when you are entering data into your web page, you will use neither a line break nor a paragraph break. Your words will automatically wrap to the next line without using the line break or paragraph break. However there are times that you will want to insert a line break or a paragraph break into your web page.

Using heading tags:

Only use Heading Text Format when typing in the main headings within your document. Use Heading 1 for your first heading, then progressively use the remainder headings within your document. Here is an example of what the Heading text format does to your text:

This is Heading 1

This is Heading 2

This is Heading 3

This is Heading 4

This is Heading 5
This is Heading 6

56.gif (4661 bytes)

Formatting the font:

The second drop down box that is on the "Format Toolbar," is a list of fonts that you have installed on your computer. You can change the format of the font of your text just as you would in any windows document by highlighting the text, then choosing the font.

The only draw back is if someone that is viewing your web page does not have the different font installed on their computer, the default font appears rather than the font that you chose to use.

With this tutorial, the Arial font was chosen. If you do not have the Arial font installed on your computer, the text appears differently on your computer than it does on other computers that have the Arial font installed. Here is a graphic of the Arial font versus the default font. You can see for yourself if you have the Arial font installed on your computer:

59.gif (926 bytes)

57.gif (3274 bytes)

More formatting buttons:

58.gif (845 bytes)

60.gif (1914 bytes)

The remainder of the "Format Toolbar" contains five sections:

1.      Section 1: By highlighting your text, then clicking either letter, you can increase or decrease the size of your font.

2.      Section 2: After highlighting your text, you have the choice of formatting your text with bold, italics, or underline. You can use more than one of these buttons at the same time.

3.      Section 3: After highlighting your text, you can choose a different color for your font by clicking on this section.

4.      Section 4: With these three buttons, you can align either text or graphics on your web page.

5.      Section 5: This section allows you more options for formatting the text on your web page. The first button in this section will help you create a numbered list, the second button allows you to create a bulleted list, the third button will let you decrease indention, and the last button will let you increase indention.

Remove your formatting:

If you do not like the new format, you can quickly delete all of the formatting and start over again by following these steps:

1.      Highlight the text that you want the formatting to be removed from.

2.      Go to "Format"

3.      Go to "Remove Formatting"

This will only remove the color, size, bold, italics, underline, and different font choice.

This will not remove the alignment of the text, the numbering or bulleting of the text, and whether or not you are using Heading or Normal text.

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Step 13: Adding Tables to Your Web Pages
with Table Toolbar

||| Step Twelve ||| Tutorial for Using FrontPage© ||| Step Fourteen |||

Tammy Payton

red.gif (74 bytes)

If you plan on working with tables, it is recommended that you display these three toolbars on your desktop: "Standard Toolbar," "Format Toolbar," and "Table Toolbar." For tips on how to use standard and format toolbars, visit these web pages:

·         Standard Toolbar: Step 3

·         Format Toolbar: Step 12

Follow these directions if you cannot see the toolbars at the top of FrontPage Editor©:

  1. Click on "View"
  2. Highlight the toolbar that you want to appear on your desktop, then let go of the mouse button. You can select and de-select the toolbar so that it is visible and invisible on your work page in this way.

Working with the Table Toolbar:

66.gif (1120 bytes)

69.gif (1275 bytes)

65.gif (1026 bytes)

In the cell above, there are two images of the same table toolbar, but with some minor differences. Some of the icons that appear on the toolbar are not highlighted in one image and are highlighted in another. How to highlight so that the icons are active for your use will be discussed in this table.

Section 1: There are two choices in the first section:

  • The first icon helps you draw a table anywhere on your web page. You can select and deselect this option by clicking this icon off and on.
  • The second icon will erase cells within a table. It will not erase a table, but only the cells within the table. You can do this by clicking on this icon, then dragging the eraser over a wall of a cell.

Section 2: There are three icons in this section:

  • The first icon will insert a row within an existing table.
  • The second icon will insert a column within an existing table.
  • The third icon will delete highlighted cells within a table.

Section 3: There are two icons in this section:

  • The first icon will merge highlighted cells together.
  • The second icon will split highlighted cell(s) into rows or columns.

Section 4: There are three icons in this section. These icons determine the postion that data is viewed in a cell. The three choices are:

  • aligning data so that it appears at the top of the cell.
  • aligning data so that it appears centered in the cell.
  • aligning data so that it appears at the bottom of the cell.

Section 5: There are two icons in this section:

  • The first icon will distribute highlighted rows evenly.
  • The second icon will distribute highlighted columns evenly.

Section 6: This offers a quick option for the color that you want for each cell or a group of highlighted cells.

Inserting a table within your web page:

There are two ways that you can insert a table within your webpage:

1.      70.gif (155 bytes)You can use this icon that is on the standard toolbar. You can click and drag the number of rows and columns that you want, then release your mouse. FrontPage Editor© will automatically set your table width to 90% of your page. You will need to use this icon to insert a table that is nestled within another table.

·         71.gif (132 bytes)You can use this icon that is on the table toolbar and draw on your web page where you want a table to be inserted. A small table will appear on your web page, which can be resized.

Resizing your table:

There are two ways that you can resize your table:

  1. 72.gif (1100 bytes)Position your mouse over a cell or table wall until you see a double-ended arrow, then click and drag the wall to the width or heighth that you want.
  1. Place your mouse anywhere inside of your table, then right click on your mouse one time. An information box will appear. Highlight "Table Properties," then click once.

One of the sections in the "Table Properties" box will give you the option for setting the size of your table.

It is recommended to use the percent option rather than the pixel option when sizing your table. By using the percent setting, your table will expand and contract depending on the size of the screen that is viewing your web page.

74.gif (3054 bytes)

Setting table properties:

One of the sections found on the "Table Properties" box, is the layout which has five options:

1.      Alignment: use this to choose where you want your table positioned on your web page: right, left, center or default.

2.      Float: If you choose the default option, the text on your web page will not wrap around the table. By choosing right or left, the text on your web page will wrap around your table.

3.      Border Size: This determines the width of the line that can surround your table.

4.      Cell Padding: This determines how much space separates the information in the cell from the cell wall.

5.      Cell Spacing: This determines how much space separates each cell.

75.gif (2541 bytes)

In the "Table Properties" box, you can customize the background of your table or you can customize the background of each cell if you had chosen "Cell Properties."

  1. Under "Custom Background" you can either insert an image or choose the background color for your table. If you do not choose anything under this heading, the background image or color of your web page will appear.
  2. Under "Custom Colors," you can choose the color of the border that surrounds your table. If you choose the light and dark border colors, you can create a 3-D effect to the border.

76.gif (2997 bytes)

Selecting rows and columns:

To format your cells or to change the properties of rows and columns, you will need to know how to select or highlight cells. There are two ways that you can select cells in a table:

  1. You can select one or more columns and rows by positioning your mouse on the edge of the cell and when the mouse arrow becomes a solid black arrow, you can click and drag the arrow to highlight your selected cells.
  2. You can position your mouse inside of a cell, then click and drag your mouse over the cells you want to select.

73.gif (1777 bytes)

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Step 14: Creating Hyperlinks

||| Step Thirteen ||| Tutorial for Using FrontPage© ||| Tip 1 |||

Tammy Payton

red.gif (74 bytes)

A hyperlink in your web page will take visitors to different web pages on your web server or anywhere in the World Wide Web. You can hyperlink either images or text to another file on your web server, to a web page on the World Wide Web, or to an e-mail address.

Creating a hyperlink:

To create a hyperlink you should:

1.      Highlight the text or select an image on your web page

2.      79.gif (184 bytes)Click on this icon found in the standard toolbar then follow these directions:

  1. An information box called "Create Hyperlink"   will appear on your screen. At the bottom you will see the options you can use for creating your hyperlink.

77.gif (3086 bytes)

  1. 78.gif (230 bytes)Click on the icon with the world to link the text or graphic to a web site on the World Wide Web. By clicking on this icon, you will execute your browser. Find the web page that you want to link to, then return to FrontPage Editor©. You should see the last web page that you browsed to, in the URL window of the "Create Hyperlink" information box.
  • 80.gif (196 bytes)Click on the icon with the folder to link the text or graphic to a web page or graphic that is on your hard drive. Before linking a web page or graphic to another web page or graphic, you should make sure that this file or graphic that you are linking to is located within your web site folder.
  • 81.gif (179 bytes)Click on the icon with the envelope to link the text or graphic to an e-mail address. When you click on this icon, you will be prompted to enter an e-mail address of someone such as yourname@webserver.com

Editing or removing hyperlinks:

To remove a hyperlink from an image or text, select or highlight the hyperlink you want to edit and go to "Hyperlinks Properties." You must remove any information that is appearing in the URL window found in the "Hyperlink Properties." There are two ways that you can open the window called "Hyperlink Properties" which is where you can edit or remove hyperlinks on your web page:

  1. Place your mouse on top of the hyperlink you want to edit, then right click on the hyperlink and select "Hyperlink Properties."
  2. 79.gif (184 bytes)Place your blinking cursor anywhere within the hyperlink or select the graphic that you want to edit, then click on the hyperlink icon on the standard toolbar.

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Tip 1: Adding Dynamic Content
to Your Web Site

||| Step Fourteen ||| Tutorial for Using Front Page© ||| Tip Two |||

Tammy Payton

red.gif (74 bytes)

Dynamic Content on Remote Web Servers

Now that you have edited and written your web pages, you can add more interactive features and additional resources to your website. Here are some resource sites to explore which will help you add some interactive features WITHOUT having to learn HTML coding:

Bravenet

http://www.bravenet.com/
This web site will help you set up your own mailing lists, guestbooks, form processors, greeting cards, hit counters, web counters, search engines, and MORE!

Extreme Counting

http://www.extreme-dm.com/tracking/
Check out what they promise to deliver...much more than just counting web pages!

Fastcounter

http://www.fastcounter.com/index.html
This web site will help you set up your own web page counter...and they promise that it will only take five minutes!

Guestbook Server

http://guestworld.tripod.lycos.com/
Add a web page to your site so that visitors can leave messages. This would be a wonderful way for parents to interact with their child's classroom.  Or you can use this as an online discussion forum.

Holiday Calendars

http://home.wnm.net/~debi/calendar.htm
Here are more custom made calendars for your web pages.

Internet Coach PuzzleCenter

http://www.apte.com/puzzles/
Teachers can create seven different puzzle types from anagrams to crossword puzzles.

VantageNet Web Services

http://www.vantagenet.com/
Here is a free service that you can use to add polls and forums to your web site.

red.gif (74 bytes)

Adding Dynamic Content on Your Web Server

These are web sites that will aid you in adding dynamic resources on your own web pages. You will need to know something about HTML coding to add this to your information.

The Applet Depot

http://www.ericharshbarger.com/java/
This site offers several applets that you can add to your web pages such as clocks, puzzles, quizzes, and more!

Cut-N-Paste JavaScript

http://www.infohiway.com/javascript/indexf.htm
You can add interactive games and tools to your web site using their tools.

Jars.com

http://www.jars.com/
You can find javascript, perl, flash, xml, and more interactive features that you can add to your web pages.

Javascript Planet

http://www.geocities.com/SiliconValley/7116/index.html
Here's a one stop site for java! This award winning site is a great resource if you are looking for javascript.

Matt's Free Perl CGI Scripts

http://worldwidemart.com/scripts/
This site offers helpful scripts for your HTML documents.

Time and Date

http://www.timeanddate.com/
This web page will help you add clocks, dates, calendars, and even calculate how many days are in between two dates.

TrueTech

http://www.truetech.com/
This site will help you set up a live web cam for your school.

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Tip 2: Find a Host for Your
School Web Site

||| Tip One ||| Tutorial for Using Front Page© ||| Tip Three |||

Tammy Payton


There are several places that will host your school web site. Some will do this for free while others will charge you for the space that you use. For an additional price, some will offer you extra services such as web resource tools which will help you build dynamic content for your site. Visit these suggested links for web site hosting:

Educational Resource Center

If you are a member of the Educational Resource Center sponsored by your state department of education, they may have a web server that you can use to host your school's web site.

Internet Service Provider

Your Internet Service Provider will usually offer their members limited space on the web server. Contact your Internet Service Provider and see how much space they will give you.

eschool.com

http://www.eschoolhouse.com/
Electric SchoolHouse offers a web resource that will help connect home and school by offering a place to publish your school web site.

nschool.com

http://www.nschool.com/index.html
This offers a free web-based service for schools to help build communication between schools, students, and teachers.

SchoolLife.net

http://www.schoollife.net/
This web site will offer teachers and schools the flexibility of using templates to create their web pages or they can create their own HTML documents and upload them intact.

SchoolNotes

http://www.schoolnotes.com/
You can post your daily or weekly
homework assignments easily on this site. 

Homework Central Hosting

http://www.homeworkcentral.com/hosting/
This web site offers space for schools, teachers, and students. They even have on line help for your web site development.

Homestead

http://www.homestead.com/
Basic members can have up to 12 mg free web server space. This site will allow you to build your own site using their easy to use HTML coding program. Also, you can add dynamic content to your web site.


Examples of Homestead Web Service

Mrs. Flanagan's First Grade Class

http://www.homestead.com/mrsflanagan/index.html

 

Mrs. Ross's First Grade Class

http://www.homestead.com/msross/index.html


||| Tutorial for Using Front Page© |||

 

 


Tip 3: Setting Up Your FTP

||| Tip Two ||| Tutorial for Using Front Page© ||| Tip Four |||

Tammy Payton

red.gif (74 bytes)

Now that you have created your web site on your computer, you can transfer these files to your web server. This is called FTP which is the acronym for File Transfer Protocol. You will need to download a program that can transfer your files to the web server.

Before downloading a file from the Internet, you should create a folder on your hard drive. Follow the steps listed on the Step One page, which explains how to create a new folder on your C drive.   You should name this folder "download." Whenever you download files from the Internet, you can prompt the file to download into this folder. Now you can find your file quickly after it has downloaded onto your computer.

Follow these steps for downloading an FTP program:

1.      Use a reputable site whenever you download files off of the Internet. One site that has shareware and freeware programs that you can use to download files from is called TUCOWS at http://www.tucows.com/

2.      Under the heading "Network Tools," you will see a hotlink to "FTP and Archie"

3.      You will be prompted to tell what region of the world you are from so that you can find the closest web server which will ensure the fastest and most reliable download.

4.      TUCOWS has a unique rating system for the programs that you can download from their site. They will tell you whether the program is shareware or freeware. A freeware program that is widely used is WS_FTP LE.

5.      You will need a zip program to unzip this file after it is downloaded. A file that has been zipped has been compressed so that the download time is reduced. Before you can use a file that has been zipped, you need to unzip or decompress those files.

·         To find a program that can unzip files that have been compressed, return to TUCOWS  home page at http://www.tucows.com/

·         Find the category "General Tools" and then choose "Compression Utilities."

·         Pay close attention to which programs are shareware and which are freeware.

·         If you choose a program that has an "exe" file extension name, that program is a self-extracting file. For example, if you see a file name called tammy.zip and another file name called tammy.exe, the tammy.exe is a self-extracting file.

o        To install a self-extracting program onto your computer you should follow these steps:

§         This is the simplest program to install on your computer. Once you have downloaded this program onto your computer in your "download" folder, you should close all of programs that you are running on your computer.

§         Find the file that you just downloaded by going to the icon on your desktop called "My Computer."

§         Find the folder called "download."

§         Open the download folder and double click the file that you just downloaded.

§         Your program will begin to install itself!

o        Once you have installed your zip program on your computer, read the help files to determine how to unzip compressed files.

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Tip 4: Logging on to Your Remote Server
Using WS_FTP LE

||| Tip Three ||| Tutorial for Using Front Page© ||| Tip Five |||

Tammy Payton

red.gif (74 bytes)

Before uploading your web pages, check to make sure that all of your links are leading to the correct pages. If your web pages are finished and you have checked all of your files, you can begin uploading your web pages to your web server.

 

 

 

 

ftp1.gif (2113 bytes)

ftp2.gif (1528 bytes)

 

ftp3.gif (1627 bytes)

ftp4.gif (1463 bytes)

 

 

 

When you execute WS_FTP LE, this informational box will appear called "Session Properties." When the provider for your web server assigns you space, they will give you the information that you need to log-on and transfer files to that web server.

1.      Profile Name: This can be any name that you want to call your connection to your web server space.

2.      HostName/Address: You need to enter the specific address for the web server that you are connecting to.

3.      Host Type: The default is called "Automatic Detect." However if you know the type of web server, WS_FTP LE offers several choices from which you can select.

4.      User ID: The host of your web server will assign you an ID.

5.      Password: The host of your web server will assign you a password. If your computer is in a secure room, you have the option of saving your password and never having to enter it again. However if several people could get access to your computer, it is advisable not to save your password on your computer. So whenever you log on, you will have to enter the password before you are allowed access to the web server.

6.      Account: This informational box maybe optional and it is not always needed to log on to your web server. You will have to see whether or not the host of your web server requires this information.

7.      Comment: This is an optional box.

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Tip 5: Transferring Your Files
Using WS_FTP LE

||| Tip Four ||| Tutorial for Using Front Page© ||| Tip Six |||

Tammy Payton

red.gif (74 bytes)

Now that you have logged on to your web server, you can begin uploading your files. The first step that you need to do, is to locate where the files to your web site are located on your C drive. Once you have located your web site on your local system, check to make sure that the files on the remote system mirror what your local system has.

 

 

 

ftp10.gif (2144 bytes)

ftp11.gif (2186 bytes)

ftp12.gif (2072 bytes)

ftp13.gif (2296 bytes)

ftp14.gif (3079 bytes)

ftp15.gif (2652 bytes)

ftp16.gif (2337 bytes)

ftp17.gif (1863 bytes)

ftp18.gif (1826 bytes)

 

 

 

Under "Options," you can set your WS_FTP LE program to open in the same directory every time that you log on to the web server.

You can open folders and highlight the files that you want to transfer from the local system to the remote system or you can even transfer files from the remote system to the local system. To do this follow these steps:

1.      Highlight the files which are on your local system that you want to upload to the remote system.

2.      Look at the remote server window and locate where you want those files to be placed. Be sure that the destination of the file is appearing in the remote side window.

3.      Click on the arrow that is pointing to the remote web server. Your file will begin to transfer to your remote system.

4.      You can download files from the remote system to your local system by following steps one through three, but in reverse order.

5.      You can select several sequential files that you want to upload at the same time. To do this, click on the first file that appears. Then hold the "shift key" down and click on the last file that you want to transfer. Every file that is in between the first file and the last file is now highlighted in blue. Be sure that you can see the destination in the opposite window before clicking the arrow to begin transferring your files.

6.      You can select several non-sequential files that you want to upload at the same time. To do this, hold the "control" key down and click on each individual file that you want to upload.  Only those files that you clicked on, will be highlighted in blue. Once you have selected all of your files that you want to upload, you are ready to transfer them. Be sure that you can see the destination in the opposite window before clicking the arrow to begin transferring your files.

7.      When you are finished, click "Close"

8.      Then click "Exit"

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Tip 6: Check the Coding

||| Tip Five ||| Tutorial for Using Front Page© ||| Tip 7 |||

Tammy Payton

red.gif (74 bytes)

Check the HTML Coding

Once your web page is uploaded on the web server, you can see how well your web page has been written by submitting it to the Web Site Garage at http://www.websitegarage.com/  Or you can enter the URL of your web page in the form below:

Web Site Garage

Tune Up Your Web Site Free:

 

 

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 


Tip 7: Announcing Your Web Site

||| Tip Six ||| Tutorial for Using Front Page© ||| Tip Eight |||

Tammy Payton

red.gif (74 bytes)

Announcing Your Web Site

Are you satisfied that your web page is as good as you want to make it? The next step is announcing your web page. "If you build it, they will come..." Well, with the Internet, you need to send out invitations to let the world know that you have this resource available. So, how in the World-Wide web of over 50 million pages can your webpage be found?

Related Sources

Remember the resource links that you included in your web activity? E-mail the sites that you pointed to in your activity and give them the web address of your activity and tell them how you are using a link to their website as part of your project. Invite them to come and see how you are using their resource. Without even mentioning that you'd appreciate a link on their website to your activity, many of them will voluntarily include a link back to you.

 


Search Engines

Major search engines include on their site a page where you can add your webpage's address or URL. Follow these links and register your site. If a search engine that you use is not listed below, go the the homepage of the search engine and follow the links that say "add a site" or "help."


Educational Websites

You can announce your webpage or activity on an educational website. Some of these websites will create a link only to the homepage of a school or a classroom while others will create links to a lesson or activity. Look at the kinds of webpages they are pointing to, to see if your webpage or activity is appropriate for that educational website.

Blue Web'n

http://www.kn.pacbell.com/wired/bluewebn/

Register your lesson at this website.

Classroom Connect's ClassroomWeb

http://www.classroom.net/classweb/

Add your school homepage into their database or search for other schools that have already added their website.

Classroom Connect's FTP Site

ftp://ftp.classroom.net/Classroom-Connect/crcposts/

If you'd like to respond to any of the posts on the list or join projects posted to the list, send email to the original sender ONLY and not to the list. To post a message, send it to: crc@classroom.net

Education World

http://db.education-world.com/perl/browse?cat_id=589

Add your school to this ever growing database.

Global SchoolNet Projects Registry

http://www.gsn.org/pr/_cfm/RevisitCheck.cfm

Add your project to this searchable database of on line projects.

Hotlist of K-12 Internet School Sites

http://www.gsn.org/hotlist/index.html
Register your
USA school or browse through the list of schools that have already been added.

Internet Scout Net-Happenings

http://scout.cs.wisc.edu/scout/net-hap/
Join this mailing list and receive and send announcements for educational news.

K12 Opps

http://archives.gsn.org/k12opps/

View a list of submitted projects and join one! If you want to join this listserv and submit your own project, follow the link found under "Educational Mailing Lists."

Web 66 School Registry

http://web66.coled.umn.edu/schools.html

Register your school website or browse through their global listing of schools that are online.


Educational Mailing Lists

One of the richest communication sources to find and announce projects is through an educational mailing list. Follow these two links to learn more about what is a mailing list, how to join a mailing list, and some etiquette manners you should observe.

Educational Mailing Lists

http://www.siec.k12.in.us/~west/article/list.htm

Follow this link to learn how to sign-up with a mailing list, how to respond to in a mailing list, and what are some etiquette guidelines to observe.

Join an Educational Mailing List

Here is a partial list of educational mailing lists that you can join. Many more are available which can be found by entering educational listserv into a search engine.

 

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||

 

 

 


Tip 8: Who Is Viewing Your Site?

||| Tip Seven ||| Tutorial for Using Front Page© |||

Tammy Payton

red.gif (74 bytes)

Discover Who Is Viewing Your Site

If you are managing your own web server, you can install software programs which will monitor the traffic that is visiting your web site. Here are some suggested programs that you can install:

Checking the Domain Name

Once you know who is visiting your web site, you may have discovered a list of domain names or numbers which have accessed your web site. You can discover who owns these domain names or numbers by accessing CheckDomain web site and entering this information in their searchable database:

Discover Who Is Linking to Your Web Pages

Once you have announced your web pages to the world, you can discover who has created a link to your web site by typing in the web address of your web pages in any number of search engines. You may be amazed to discover who has added your resources to their web site!

red.gif (74 bytes)

||| Tutorial for Using Front Page© |||