Web Hosts
with
Website Builders
Hosting trusted by almost 4 million sites!

Click to TRY FREE

Get a Website in Minutes at Web.com

HTML Code Tutorial

Tutor Ebook Download

The Font Tag

<font></font>

Pre-HTML 4.0 versions used the code shown below to set font attributes. The method though still acceptable adds a considerable amount of extra code to an HTML page.

Extra code means larger slower loading pages. Larger pages mean more bandwidth consumption and higher web hosting rates.

Even in the year 2006 many popular website building tools still use this antiquated method of font definition.

To move your website into the current era of web development, use Style Sheets for setting font attributes in your pages. Not only will it make your pages smaller, but it will also make them easier to edit and revise. See the page on Style Sheets.

The pre-HTML 4.0 code for the font tag:
<p align="left"><font face="Arial" size="4" color="red">This is Arial size =4 color=red.</font></p>
which displays as:
This is Arial size =4 color=red.


Using style sheets the code in the body section would be:
<p>This is Arial size =4 color=red.</p>

The attributes for the font tag were:

  • face
  • size
  • color

HTML 4.0 and Fonts

CSS replaces these attributes with:

  • font-family
  • font-style
  • font-weight
  • font-size
  • color

Font attributes are specified using embedded, linked or inline style sheets.

Choosing Fonts

Many novices get carried away when they begin choosing font faces or families for their pages. The fonts that appear on your web page when viewed by a surfer are actually determined by the visiting browser. If the surfer's system doesn't have the requested font, the browser substitutes one that is on the system.

Always declare a generic font family as the last choice, when building Style Sheets. (See Embedded Style Sheets)

It is best to stick to the basic fonts that are included with most Operating Systems.
The following is a list of fairly safe choices:

  • Arial
  • Arial Black
  • Courier
  • MS Serif
  • Tahoma
  • Times New Roman
  • Verdana

Though the choices might seem bland, in most cases pages will be viewed by visitors as the page builder intends.



CGI Online
How to Create a Website -Tutorial
Main Website


This Free HTML Tutorial
is provided by Net Success 2000 Plus Inc.
PO Box 1508
Somerset, KY 42502
Last Modified: September 4, 2007

HTML Codes Tutor Ebook