This page demonstrates Font and Paragraph Formatting in FrontPage 2000.
It may seem that this page is long and complicated, but when you bear in mind that this is ALL of the formatting that you get in HTML, it's worth studying what's available.
The only formatting elements not demonstrated on this page are Themes, Images and Backgrounds (and other page properties). In addition, advanced items like forms, style sheets (and some style sheet effects like Position or Borders and Shading), Dynamic HTML effects, and scripts can affect formatting but are beyond the scope of this document.
Bold, Italics, Underlining and Strikethrough
Superscript and Subscript
Other Paragraph Styles: Address & Formatted
Paragraph Spacing & Indenting
Enter text as you would with a word processor. Pressing Enter starts a new paragraph (see below). Normally, you'll let the automatic word wrap take care of the end of each line. The arrow keys and standard movement keys can help. Keep in mind these keyboard shortcuts:
|Arrow keys||Move up or down a line, or left and right a character|
|Page Up/Page Down||Move up or down a page (screen)|
|Delete||Delete one character (to the right of the cursor)|
|Backspace||Delete one character (to the left of the cursor)|
|Home||Move to the beginning of the line|
|End||Move to the end of the line|
|Ctrl+Home||Move to the very beginning of the page|
|Ctrl+End||Move to the very end of the page|
|Ctrl+Page Up/Down||Switch between Normal/HTML/Preview views|
|Shift||Shift plus any movement key selects text as you move (similar to selecting text with a mouse)|
|Tab||Insert four spaces (or move to the next cell in a table)|
|Ctrl+A||Select All of the text in your document|
Comments are notes you make to yourself about the page. They do not appear when the page is viewed in a browser. FrontPage displays comments in purple. FrontPage will print your comments if you print the page. To insert a comment, use the Insert | Comment command.
Comments do not affect spacing on a page.
Note: Anyone in the world can see a comment by viewing the page's HTML source code, so don't put anything confidential there.
A marquee is a scrolling region available with the Insert | Component | Marquee command. The result works only in Internet Explorer.
Headings are used to create an outline for your document. They automatically set text in the standard "Heading" style. Use the Style box on the Formatting toolbar, or use keyboard shortcuts (Alt+Ctrl+1 through Alt+Ctrl+6).
Note how small the last two styles are. Don't use headings gratuitously, and it's not good style to use them out of order (for example, using a heading four and then a heading two and then a heading six).
This is a Normal paragraph.
This is a Normal paragraph with center alignment.
This is a Normal paragraph that is right-aligned.
This normal (left-aligned) paragraph has regular left-aligned word wrapping, so that the right edge of the paragraph is ragged; if you have a paragraph that includes very long words, it makes it obvious that the right edge is ostentatiously-devoid-of-justified-word-wrapping, which can make a paragraph a somewhat-more-difficult-to-read thing--reader-depending, of course.
This normal (justified, not left-aligned) paragraph has "Justify" word wrapping, so that the right edge of the paragraph is always even; if you have a paragraph that includes very long words, it makes it obvious that the right edge is ostentatiously-stretched-to-enable-justified-word-wrapping, which can make a paragraph a somewhat-more-difficult-to-read thing--reader-depending, of course.
Use the three alignment buttons on the Formatting toolbar, or use the Ctrl+L, Ctrl+E and Ctrl+R keyboard shortcuts, or use the Format | Paragraph command (the last method is the only way to choose Justify). Only entire paragraphs can be aligned.
This Normal paragraph has italics (also known as the "em" style, for "emphasis"), bold (also known as the "strong" style), and bold italic text. Underlining is also available. Use Ctrl+B for Bold, Ctrl+I for Italics, Ctrl+U for Underline; or, use the appropriate buttons on the Formatting toolbar. The Format | Font command has the Font Style section, as well as some font variations.
Note: Underlining is easily confused with links, so it's best avoided.
You don't have to have black text -- almost any color text is available. White (white), "red", green ("lime"), "blue", "yellow", magenta ("fuchsia"), cyan ("aqua"), "green" (technically it's closer to forest green), "purple", "gray", "maroon", "olive", "navy", "silver", "teal" and any custom color you want. Use the Font Color button on the Formatting toolbar, or use the Format | Font command.
The Normal paragraph is normally displayed in Times New Roman (depending on the remote system), but you can choose different fonts. Be careful, however, since you cannot guarantee what fonts are on the viewer's system. Arial is a safe bet (it's also known as Helvetica or Universe). Garamond (alias Palatino) looks nice, but you can't guarantee that it's there. Courier is also available. Use the Format | Font command or the Font pulldown menu on the Formatting toolbar (Ctrl+Shift+F).
Note: You can specify more than one font if you edit the HTML or type in a strong of comma-separated fonts in the Font dialog box; for example, you may end up with a tag like <FONT FACE="Verdana,Helvetica,Arial,Universe">
On the Web, you don't specify point size. There are seven sizes: biggest (7), bigger (6), big (5), bigger than normal (4), normal (3), small (2), smallest (1).
Tip: Don't use the heading styles we saw earlier for character size unless your text is actually some kind of heading. Again, use the Format | Font command for font sizes, or the Font Size pulldown menu on the Formatting toolbar (Ctrl+Shift+P).
You can use Superscript (for example, the "2" in E=MC2) and Subscript (e.g., H2O). Use the Format | Font command and choose Superscript or Subscript after selecting the text you want changed.
There is a certain special font effect shown in this otherwise normal paragraph.
this sentence should be removed.) The Strikethrough effect is for indicating a
section that should be removed. Use the Format | Font command
and then choose Strikethrough for your selected text.
<STRONG>HTML tag instead of the
<B>HTML tag, but browsers treat them identically. Technically, it's better to use
<STRONG>supports speech-based browsers.
Similarly, the Emphasis appearance is only technically different from the regular Italic command -- it uses
<EM> HTML tag instead of the
tag, but again browsers treat them identically.
FrontPage 2000 introduces support for some special styled text (using an advanced feature called Cascading Style Sheets). These styles are not supported in older browsers, such as Internet Explorer 3.0 and earlier as well as Netscape Navigator 3.0 and earlier. Here are the new special styles, each of which is selected from the Format | Font command's list of special effects:
In addition to the above effects, there are some other special HTML tags supported by FrontPage. The important thing to remember about these HTML tags is that they are "logical tags," not "presentation tags." Therefore, they can appear differently in a different browser.
<SAMP>) is for computer code output samples (that is, computer code, for example if you were documenting the display of a particular computer program). It is often rendered in Typewriter style.
<DFN>) is for defining terms. It is often rendered in italics.
<CITE>) is for citing an author or source, especially book titles. It is often rendered in italics.
<VAR>) is for displaying "variables" in computer code, that is, text that users should enter or that varies from example to example. It is often rendered in italics.
Code style is for displaying computer code listings. It is often rendered in Typewriter style.
Note: To remove all of the formatting (bold, font, color, special styles, etc.), highlight the text and use the Format | Remove Formatting command (Ctrl+Shift+Z).
The Format | Font command has a new tab in FrontPage 2000 that allows you to use Cascading Style Sheet effects for making text appear wider or more condensed.
For example, this paragraph is expanded by 3 pts.
For example, this paragraph is expanded by 2 pts.
For example, this paragraph is expanded by 1 pt.
For example, this paragraph is condensed by 1 pt.
For example, this paragraph is widened by 2 pts.
For example, this paragraph is widened by 3 pts.
As of FrontPage 2000, the Typewriter style ("
not directly supported, although it shows the results properly in the editor. If you wish, you can use the HTML tab
and then add the
</TT> tags directly to your document (around whatever
text you want in typewriter mode). The result is demonstrated in the next
paragraph. You can't use the Format | Font command to do this
This is Typewriter style -- and did you know that most typewriters use the Courier font? The default font for Typewriter should be Courier, but that depends on the viewer's browser and computer system. Any mono-spaced font could be used.
In Typewriter mode, everything lines up:
12345678 llllllll The quick brown fox
12345678 wwwwwwww The quick brown fox
In Normal mode, the default font, Times New Roman, is "proportional" (as opposed to Courier, which is "fixed-width" or "mono-spaced"). So things don't line up:
12345678 llllllll The quick brown fox
12345678 wwwwwwww The quick brown fox
A couple of sections above, you saw a numbered list to display the different special styles. There are several types of lists you can use; these are accessible in FrontPage by using the buttons or Style choices on the Formatting toolbar. Or, to have the most choices, use the Format | Bullets and Numbering command.
There are several other Paragraph Styles available from the style box on Formatting toolbar (Ctrl+Shift+S).Address style is for indicating an e-mail or real-world address. It is often rendered in italics. Usually you'd use it at the bottom of a page, in the signature section. It's not that popular now; you can ignore it.
Formatted Style (also know as "PRE" for Pre-Formatted style) is a way to get things to be exact. Words don't wrap automatically. Formatted Style =============== It is the only style that allows you to use more than one space between words and sentences. /------------------------* ! *----------------------\ | | | You can draw oddball things in Formatted style. | | | \-----------------------------------------------------/
Formatted style is rendered by the browser in the same font as Typewriter style.
Horizontal Rules are horizontal lines, used to break up pages and for decoration.
A normal, default horizontal rule is two pixels high, 100% of the screen, shaded, and black.
You can make horizontal rules that are a little thicker. This one is five pixels tall:
You can make horizontal rules that are not shaded. This unshaded rule is also five pixels tall:
You can make horizontal rules have any color you want (although Netscape Navigator 3.0 will only show them in black):
You can make horizontal rules less than the entire width of the screen (such as 50% width):
They can also be left-aligned or right-aligned:
You can combine several attributes. This line is 10 pixels thick, right-aligned, 350 pixels wide, and green:
You can make a tall line, but it's a little pointless since you can't have text next to it:
The above line is 1 pixel wide and 60 pixels tall.
To change the format of your horizontal rule, double-click on it. FrontPage will display a dialog box that lets you edit the options. The next horizontal rule you insert will have the same properties as the previous one.
Normal HTML (as viewed in older browsers) is fairly limited. You can't change the line spacing within a paragraph. There is no good "Tab" character to indent the first line, and there are only two types of carriage returns -- a full paragraph break (with a blank line), or a single line break. In sum, traditional HTML has only limited options for a paragraph.
When creating a list of information, try using a Line Break (the "
code) by using SHIFT+ENTER. This is useful for short lines of
information, such as an address:
E. Stephen Mack
Mountain View, CA 94043
You can also use a line break to have several paragraphs, one after the other, without
a full empty line in between them. Another way to get a line break is the Insert |
Break command (choose "Normal Line Break").
This option may look a little unusual, and is not necessarily recommended. So be careful, since this option isn't standard and may not produce the desired results.
In addition to breaks, there's also indenting. You can indent a paragraph using the Increase Indent button on the Formatting toolbar. This inserts a
<BLOCKQUOTE>tag. Indented paragraphs are indented an equal amount on both the left and the right.
You can double indent a paragraph.
You can even triple-indent a paragraph!
FrontPage 2000 also introduces some advanced ways of formatting for newer browsers, using features from Cascading Style Sheets. These are available from the Format | Paragraph command. You can indent by a certain amount (such as 5% or .5in or 10mm), separately for the left and right. You can have a different indentation amount for the first line (like in this paragraph and the next one, with .5 in).
You can also choose to use double-spacing or single spacing, or in-between with 1.5 spacing. For example, the previous paragraph and this paragraph use 1.5 spacing. You can also apply a fixed distance above and below a particular paragraph.
A table (created with the Table | Insert Table command) can hold data:
Vertical information is called a "column" and horizontal information is a "row." Each intersection is called a "cell." To change the properties of a cell, right-click and choose Cell Properties. The first two cells in this table are given the "Header Row" property, which makes them centered and bold.
Tables can have borders:
Tables can have cellspacing (the distance between cells):
Tables can also have cellpadding (the distance within a cell):
By setting the width of the table (as a percentage or in pixels), changing the border size, combining properties and using colors, you can create very fancy tables:
You can place images inside tables, or lists, or even other tables. You can merge and split cells to create fancy effects. Tables can be used for layout (to align things in arbitrary positions on the page). Note that the most convenient way to move from cell to cell in a table is with the Tab key, which also creates a new row if you tab on the last line.