Now that you are thinking about what you want to put on your site, you probably want to start building your own pages. You should have a fairly good idea of the types of pages you want to put in your web. Roll up your sleeves, because it is time to start building those pages. This chapter starts with the basics: working with headings, paragraphs, and text styles.
As you read along, you should reproduce the examples in this chapter and the ones that follow. Create a web in which you can practice. When you create a normal web, a single blank page is placed in it. You already know the procedure: Simply specify a normal web in the FrontPage Editor's New Web dialog box.
It is usually best to build pages in several passes. First, plan the content of your pages by putting in the headings. Starting this way gives you a feel for the content that you want to include on a page. It is also easier to create bookmarks when there is not much text in between headings-you have less to scroll through.
After you enter the headings, enter the content beneath each heading. Look at the section and decide what best conveys the information that you want to include. Sometimes, plain text is all that is necessary. Other times, a list or a table might be more effective in getting the message across.
While you enter the content, create the links to the other pages in the same section; create the new pages in the process. Add the pages to your To Do list, and enhance the task descriptions if necessary.
After the basic content is on the pages, develop the navigation links for the section. This gives you the opportunity to take a final look at the pages. Decide which pages belong in the navigation bar and which ones should have the navigation bar included on them. Use the Include Bot to place a text version of the navigation links on the page first. This way, you can make sure that you like how the links flow before you make the graphics. You can even put pages on the Web at this point. At least they will be doing something while you develop the graphics.
After the graphics are done, edit the navigation bar to display the graphics in place of or in addition to the text links. All the pages that contain the new navigation bar are updated automatically because of the Include bot.
Finally, develop header graphics and footers, using the same basic design throughout each of the pages in a section. Try to give your pages a consistent look and feel. Update the pages to which you added graphics on the remote server-including the pages that have the navigation bar included within them.
Now, take a look at the basic building blocks that you use in your pages-headings and paragraphs.
A paragraph is a line or a group of contiguous lines that use
the same format and are separated in the FrontPage Editor with
white space. Once you hit the Enter key at the end of a line,
you start a new paragraph. The paragraph is separated by what
appears to be an extra space.
NOTE |
You can use line breaks to start a new line in the same paragraph. |
When you format a paragraph, all the text contained in the paragraph changes to that format. You cannot mix paragraph styles in a paragraph. You can, however, mix character styles in a paragraph, which are discussed later in this chapter.
You have a blank page in front of you, and you are wondering where to start. First, organize your thoughts by putting headings on your pages. Figure 9.1 shows three levels of headings for a page in the early stages of development. The first heading-the page title-is Heading 1. Four sections are formatted as Heading 2: Picking Your Potato, Making the Gravy, Adding Spices, and What to Top Your Potatoes With. Some sections have additional topics listed beneath them. Those headings are formatted as Heading 3. It is like formatting an outline in a word processor.
Figure 9.1: Organize your thoughts by placing headings on your page first.
When you create a page based on the Normal template in FrontPage, it opens up in the FrontPage Editor and appears completely blank. If you immediately start typing, the text is entered on the page in normal paragraph format.
A quick way to format the first line on your page into a Heading 1 paragraph is to use the style bar, shown in Figure 9.2. Click the arrow in the drop-down menu box, and choose the heading or other paragraph style.
Figure 9.2: Use the style bar to format text into another commonly used style.
You can also use the Format | Paragraph command to insert a paragraph or heading. When you use this command, the Paragraph Format dialog box, shown in Figure 9.3, appears.
Figure 9.3: The Paragraph Format dialog box provides one way to format the paragraphs on a page.
From the Paragraph Format dialog box, you can perform these procedures:
Figure 9.4: Normal paragraphs are used most commonly
in your pages.
TIP |
Use the alignment buttons on the FrontPage Format toolbar to align paragraphs or text quickly. |
After you make your paragraph format choices, click OK to return to the FrontPage Editor.
After you place a heading on a page, you probably want to press Enter and start typing another line. When you do this, the new line uses the same format as the previous one-including its alignment, color, and character style. In the example here, your second line would appear as a Heading 1. Use the Insert | Heading command to start a new line with a different heading.
Six levels of headings are available in FrontPage. Their font
sizes are shown in
Table 9.1.
NOTE |
Table 9.1 lists the font sizes as they are applied in the FrontPage Editor. Users might have their browsers set to display headings and fonts differently. |
You use some of the same methods discussed earlier to add text content to a page. For example, you can use the style bar or the Format | Paragraph command to format text paragraphs. To insert a new paragraph on your page, use Insert | Paragraph. You can choose from three types of text paragraphs: normal, formatted, and address.
Normal paragraphs are the meat-and-potatoes paragraph of your Web page. You use them for most of your content.
To insert a normal paragraph on a page:
Use formatted paragraphs when you need to provide content in a fixed-width format. You cannot use tabs in HTML pages, but formatted paragraphs enable you to add additional spaces to your text and give the appearance of using tabs. This type of paragraph is good for text-based tables, ASCII art, and code. Figure 9.5 shows three examples of formatted paragraphs. Line breaks split each paragraph into several lines.
To insert a formatted paragraph on a page:
Address paragraphs format text in italics. The traditional use for an address paragraph is to place author information at the beginning or the end of a page. Most commonly, this information is placed at the end of a page, as shown in Figure 9.6.
To insert an address paragraph on a page:
You can easily change a paragraph from one format to another.
For example,
you can change an address paragraph to a heading, a normal paragraph,
or a formatted paragraph. In Figure 9.7, the address paragraph
has been reformatted to a Heading 5.
Figure 9.7: You can change the formatting of a paragraph.
To change a paragraph style:
To split a paragraph into two or more paragraphs that use the same paragraph style, position the insertion point where you want to split the paragraph. Then press Enter. The paragraph is split at the point you specified, and the parts are separated by white space.
To split a paragraph into two paragraphs while applying a different style for the second paragraph, position the insertion point where you want the paragraph to break. Choose the Insert | Paragraph command, and select a new style. FrontPage splits the current paragraph at the insertion point.
When you press the Enter key to start a new line on a page, it
starts a new paragraph and inserts white space after the preceding
paragraph. To start a new line of text without starting a new
paragraph or adding white space, use line breaks.
TIP |
To view where the line breaks are on your page, click the Show/Hide button, which shows and hides paragraph marks. This button is the one |
To insert a line break:
You can add extended attributes to paragraphs by clicking the Extended button in the Paragraph Format dialog box. These attributes are added to the HTML code that FrontPage generates for the paragraph.
To add extended attributes to a paragraph:
You can format any text on your page to use a different color,
alignment, or font size. You can also use several different types
of text styles. Table 9.2 describes the various styles and typical
uses for them.
NOTE |
Text styles are not to be confused with font faces. The FrontPage Editor works with two basic types of text styles-a proportional font (Times Roman) and a fixed-width font (Courier). All of the character styles you choose in FrontPage are based on these two font styles. Refer to Chapter 21, "Using Your Own HTML Code," to learn how to assign different font faces to your Web pages. |
Style | HTML Tag | Typical Use Regular Styles |
Strong | <STRONG> | Marks a strong emphasis. It is often rendered the same as bold text. |
Emphasis | <EM> | Emphasizes text. It can be rendered in italics or as underlined text in browsers. |
Underline | <U> | Underlines text. You can also use the Underline button on the FrontPage Editor tool bar. |
Strikethrough | <STRIKE> | Renders text with a line drawn through it. It is often used in legal online documents. |
Typewriter font | <TT> | Renders text in fixed-width format. You can also use the TT button on the FrontPage Editor Format toolbar. |
Citation | <CITE> | Marks a citation from a book or other published source. |
Definition | <DFN> | Marks a definition. It is usually preceded by a term. |
Sample | <SAMP> | Renders sample text or special characters. |
Blink | <BLINK> | Causes selected text to blink on and off. Use it sparingly. |
Code | <CODE> | Marks computer source code. It is rendered as fixed-width text in FrontPage Editor, but it is rendered as monospaced text in some browsers. |
Variable | <VAR> | Marks a variable used in computer code, equations, or similar work. It is usually rendered in italics. |
Bold | <B> | Renders text as bold. Can use Bold button on the FrontPage Editor tool bar. |
Italic | <I> | Renders text as italic. You can also use the Italic button on the Frontpage Editor toolbar. |
Keyboard | <KBD> | Marks instructions that a user enters by keyboard. It is rendered as fixed-width text in FrontPage Editor, but it is rendered as monospaced text in some browsers. |
Use the Format | Characters command to apply formatting to the text on a page. You can apply formatting to a single character, a word, a group of words, a sentence, a paragraph, or even the entire page.
TIP |
You can use the Bold Text, Italic Text, Underline Text, or Typewriter Font buttons on the Format toolbar to change text styles quickly. |
TIP |
Use the Increase Text Size or Decrease Text Size buttons on the tool bar to change the size of your text quickly. Each time you click the button, the size of the text increases or decreases by one increment. |
TIP |
Use the Text Color button on the tool bar to change the color of your text quickly. |
In Figure 9.8, the three aligned paragraphs are selected for formatting. The font size is increased from the default font size-3 (12-point)-to 5 (18-point) by twice using the Increase Text Size button on the tool bar. The Italic button is used to put the text in italics. The Font Color button is used to change the text to blue.
Figure 9.8: Normal text can be reformatted in interesting ways when you combine different formats.
The words They're great shown in Figure 9.8 demonstrate how you can apply character formatting to a portion of a word. The font size is increased a few letters at a time. As you can see, you can use character formatting to achieve interesting effects without relying on graphics.
FrontPage enables you to format text in other ways as well. You can use superscript and subscript text, increase or decrease indentation, and insert special characters. The procedures are quite simple.
Use superscript and subscript text to designate footnotes or dropped text. To raise a character or a group of characters above the base line of the text, use superscript text.
You can indent or outdent text to add emphasis to your layout. Use the Increase Indent button to indent the text toward the right. Use the Decrease Indent button to outdent the text toward the left.
Special characters are items such as trademark, registration, and copyright symbols; accent marks on text; special currency symbols; and common fractions. To insert a special character:
What if you want to rearrange your content and place some of it on a different page? What if you placed section 3 before section 4 instead of after it? Mistakes sometimes happen, but it is not tough to fix them.
FrontPage has a multiple-level Undo function. This means that you can undo several steps. Choose Edit | Undo or click the Undo button for each step that you want to undo.
If your hot list is so long that you have to scroll to read all of it, you might want to split it up into several pages. To do this, you can cut the text from one page, place it in the clipboard, and paste it into another page.
Likewise, consider all those Back to Top links that you must create on a page after the bookmarked sections. You actually need to create them only once. Make the first link, copy it to the clipboard, and paste the text and its link into all the other sections. The same applies for graphics used as bullets or dividers on your pages. Copy the first one into the clipboard, and paste it somewhere else.
To copy and paste text and images to and from the clipboard:
There are two ways to delete text. One method places the text into the clipboard for pasting into another location. The other method deletes the text from the page without placing it into the clipboard.
To delete text from a page and place it into the clipboard, use the Edit | Cut command or click the Cut button. To delete text from a page without placing it into the clipboard, choose Edit | Clear or press Del.
You can also delete the character before the insertion point by pressing the Backspace key for each character you want to delete. To delete text after the insertion point, press Del for each character you want to delete.
If you change the format of your text-such as if you increase or decrease the font size-you can return the text to the default format. Simply select the text, and press Ctrl+Space. The text returns to the default format for its paragraph style.
Suppose that you are writing a page about flowers, and you forget what you wrote about petunias earlier. You need to find exactly what you said about it. To find text:
You realize that what you said about petunias actually applies to daffodils. Instead of retyping everything, you can use the Replace command. To replace text:
It is always a good idea to spell-check your pages before they go out to the public. FrontPage has a built-in spell-checker at your disposal. The spell-checker starts at the beginning of the page and checks the spelling of each word. When a spelling error is found, it is displayed in the Not in Dictionary field in the Spelling dialog box. If the spelling resembles a word in the standard dictionary, replacement words are suggested. To use the spell-checker:
Once you have an idea of the information you want to include on your web, entering content into your pages is very simple. Starting with basic headings helps you organize your thoughts. You can use character styles and formatting to add your content. Using different character styles, you can add emphasis to areas on your Web page. After the content is complete, you can use the FrontPage spell-checker to verify that your content is spelled correctly.
Your text can be more than simple text. You can use color, change the alignment, increase or decrease the font size, select different formats, and even insert special characters. After your text is placed on a page, you can spell-check it.
| Why do the headings get smaller as the numbers get larger, and the character styles get larger as the numbers get larger? |
| The reason why the headings get smaller as their numbers get larger is because they correspond to hierarchical logic. Typically, your page title is displayed in Heading 1, topics beneath it in Heading 2, topics beneath them in Heading 3, and so on. Text styles increase in size as their designations increase because it is most logical. A small number indicates a small font size; a large number indicates a large font size. |
| Are there any rules regarding what font size to use following a heading? |
| Not really, except that you might want to use a heading that is at least the same size or larger than the text beneath it. Normal paragraphs use a default font size of 3 (12-point), which means that Heading 1 through Heading 4 look all right with it. If you use smaller headings, such as Heading 5 or Heading 6, you might want to decrease the font size. |
| Can I change the default size of the font in the FrontPage Editor? |
| No. This setting is not user-definable. You must set the font size or use the Increase Font Size or Decrease Font Size buttons on the tool bar to change the size of your text. |