Making Web Pages With FrontPage

 Here we are going to cover making web pages and basic web page editing.There a several ways of making web pages in FrontPage.

To make/create additional web pages then:

1. Select the new web page icon from the top menu bar    
2.  Alternatively Select File>new>web page and select blank page from the Task Pane  on the right.
3. The new page is created with a default name of new-page-1 etc.
4. To save a page then click the floppy disk icon or select File>Save
5. When saving a web page for the first time you are given the option of changing the file name and changing the page Title:
   
   
    
6. FrontPage doesn't force you to give the page a title and a common mistake amongst new users is to leave the default title. (see Quick web page checks)

Setting Up Fonts

FrontPage default to using Times Roman as the default font which is the same as used by Internet Explorer. The default font for the page is shown below:

To change the page default then you need to Select Tools from the top menu and then select Page>Page Options> default fonts. I set both to Verdana as shown below:

You should note that setting up the page default only affects the way the page is viewed in FrontPage. It doesn't affect the way the page is viewed in a web browser. Without specifying the page font explicitly the page font will default to the browser default.

This is because setting the font in the manner described above doesn't explicitly set the page font it only appears to set the font. To explicitly set the font you need an explicit font declaration using the FONT tag or using Cascading Style sheets.

To se what we mean by this open a new page (new page 1) and enter in this text:

Now select the entire line and change the font size by selecting the size from the size list drop down box. Select 10pt. The text now appear as shown below. Note the font size as displayed in the size menu is always 10 regardless of where in he line you position the cursor.

Now position the cursor at the end of the line and hit return. Now on the second line enter the text:

You should have a page that looks line this:

Now this appears to work ok we set the font once for the top line and it gets picked up for the rest of the page. The problem only becomes apparent when we examine the actual html coding as we find that each new paragraph has its own font declaration which becomes very messy. The HTML is shown below:

You will also find that sometimes it reverts back to the default font and so you have a mixture of fonts and font sizes on a page. There are two ways of overcoming this the old fashioned way is to declare the font size outside of a paragraph tag. To do this you need to view the page in HTML/Source mode and insert the following font declaration:

Notice the letter m is only there for positioning so that when I switch back to normal mode I know where to start entering text. If you don't have some kind of positioning text it wont always work.

The HTML for the page (between body tags) now looks like this:

Now if you switch back to normal mode and position the cursor over the letter m and re-type the previous two lines and then look at the HTML you will see the following:

Notice we have only one font declaration which is sufficient for the entire page unless of course we need different fonts. Now sometimes you will find that FrontPage starts inserting repeated font tags after you have made other font declarations.

The way I always fix this is to enter html/source mode and insert a couple of paragraph tags with a bit of dummy text in the like this:

I then edit the text in normal mode, hit return and it tends to work ok after that. If you do look at your HTML and find that it contains multiple FONT entries there is no need to worry. It doesn't look as good but it still works as so there is no need to change it.

The other method and the current preferred method is using cascading style sheets. If you don't know what these are then take a look at starting css tutorials. I will be covering how to use CSS with FrontPage in coming tutorials.

Starting FrontPage Tutorials and Guides:

• Starting FrontPage
• Creating a New FrontPage Website
• Making Web Pages With FrontPage