app: font styles

Home
Up
.
 

Changing the appearance of the text

TIP: Whenever you make any change to text that you have already typed, you must first select the text that you want to alter.
Changing the Font Style

The font's style is a device built into HTML to make a change to the font being used.  

To access the font styles available in Editor, 

click on the drop box in the upper left corner:
Choose the font style you want to use.

Here are examples of the effect that each style has on the font:

  

Heading 1 

Heading 2

Heading 3  

Heading 4
Heading 5
 Heading 6

As the 

 heading 

number 

goes up

the size 
gets smaller.

 

Address formatting
 looks pretty similar to simply applying italics.
Formatted text is rendered in a smaller, monospaced font.  (Monospaced means
that each letter takes up the same amount of space, similar to the way a
typewriter works.  See how these letters all line up underneath one another
just perfectly?)

Using the list item style is the same as clicking the bulleted list button. ()

Descriptive Title and Descriptive Text are used in conjunction with one another for this effect:

Descriptive Title 
Descriptive Text.  This option is handy for definitions, menu item descriptions and that sort of thing.

Changing the Font Size

Changing the font size is as easy as choosing a new size from the drop menu.  The + modifiers make the font larger and the - modifiers make the font smaller.  The "+0" removes size modifiers from the font.

 

 

 

Changing the Font (Face)
Note: You cannot change the Font Face from the Netscape Editor.  You must edit the HTML.

The font face (usually simply referred to as the font) is the actual typeface used for the text.  You must be very careful when using this feature because the font will not display correctly unless the user has the font installed on his/her computer.

For example, this sentence is in Courier New.  Chances are, if you are on a Windows computer, it looks correct because courier new often comes with Windows.  If you are on a Macintosh, this looks like the default font, because your browser couldn't find a courier new.

I have the font face for this paragraph to Chicago, a font that is standard on Macintosh systems but does not come with Windows.  Right now, Windows users are seeing the default font because their operating system is scratching its head and going, "Chicago?"

This is in a font called Mr. Larry Tate.  (I'm not making this up.)  Although it is my favorite font, you probably don't have it installed on your system and are seeing this in the default font.*

Hopefully, I've illustrated the dangers of using specific font names.  There is hope, however.  There are a select group of fonts that are pretty much surefire at this point.  You see them on even the slimmest Windows machines.  Furthermore, they have equivalent Macintosh versions.  Unfortunately, the Macintosh versions and the Windows versions have completely different names (of course!).

Look at cascading style sheets to see how to please most of the browsers all of the time.  (Because you can't please all of the browsers all of the time.  It just won't happen.)

Otherwise, stick with these fonts:

Windows

Macintosh

Arial Helvetica
Times New Roman Times
Courier  Mono

 

If you aren't afraid to get your hands dirty, you can not only set the font face, but you can set it up so that if one font isn't found, the browser will look for a different font.  The page that you are viewing will always display Arial in Windows and Helvetica (the Arial of Macintosh) in Mac. 

The tag to control this is the <font face> tag, used like this:

<font face="Arial">text...</font> 

To add other fonts for the browser to search for if the first font is not found:

<font face="Arial, Helvetica">text...</font> 

 

 

 

 

 

 

 

 

 

 

 

 

*Props to you hipsters who do have Mr. Larry Tate installed. 
 For the rest of you, you can get it at Retroville.  (This is an unpaid endorsement.  It's just that funky.)

 

©2000 Harry Knight

Certain elements (software titles, search engine logos, etc.) are copyright and/or trademarks of the respective copyright owners.  Use of this material is restricted to educational use and is intended to promote both further understanding of the intellectual property discussed and, in effect, the product itself.