Home > Articles > Building Web Pages > Control your Web Fonts

Font Control

In the early days of HTML, the size and font of text was often controlled with font tag. While this is still a widely used way of controlling the look of text on web pages, the font tag has been depreciated in the latest revisions of HTML and there are plans to phase the tag out all together. In practice however, you can expect to see this tag work in browsers for several years to come so you needn't worry about converting all your HTML files just yet.

The font tag alternative

It would not be feasible to phase out the use of the font tag without any viable alternatives. Enter the style sheet...

CSS (Cascading Style Sheets) can be thought of as an extension to HTML, altering the properties of HTML tags (both on an individual and group level) without the need of altering the HTML elements of the page too much. CSS works along side with HTML to extend the capabilities, and while it is true that CSS has opened up the doors to greater control of page elements, there are still a few issues to be resolved before it can be used in mainstream web design with confidence.

The main problem has to be the lack of full support amongst the latest browsers. While it may be true that there are certainly more CSS aware browsers than those that don't understand it, it is also true that support for various CCS attributes vary widely from browser to browser. This in turn makes it very difficult to get a site looking as intended for all browsers using a single style sheet.

Take Control

While it is impossible to get pixel precision font sizes for every browser out there, you can use a technique called "overloading" to give you that little bit of extra control of those pesky fonts. The idea is simple, just use CSS with a HTML backup... so an overloaded font tag might look like this:-

<FONT FACE="Verdana, Arial, Sans Serif" SIZE=2 CLASS="blue">

In this example the font would be size 2 Verdana, Arial or Sans Serif in non CSS aware browsers, and will take the attributes set by the "blue" class for those that do support it. Where support is buggy the attribute set by the font tag will take over if a particular corresponding CCS attribute is not set.


Noticed a problem or got a question or comment?


This site will look much better in a browser that supports web standards, but it is still accessible to any browser or Internet device.


About this Page

Author: Rosemarie Wise
Originally Published: Fri 15th Dec, 2000
Last Revised: Fri 7th Dec, 2001
URL: http://websiteowner.info/articles/pages/fontcontrol.asp

Want to use this article on your own site? Learn more...


The Web Site Owner's Resource © 2000-2007 Rosemarie Wise