Back to Index Lists Fonts Formats Images Links Onward to the next 6



August's HTML Crash Course - Fonts

HTML isn't just about lists and plain text, however. You can do all sorts of things with it. But now, we're going to get into altering the text to suit your needs [ok, we still aren't getting into colour yet, but we're almost there]. We'll start with changing the font.

Most browsers, for some reason, support this really nifty, non-standard thing called the FONT FACE tag. Actually, it's just a FONT tag with the non-standard FACE attribute. What that does is allow you to change the font itself. Your browser probably displays pages in Times or Times New Roman for it's default font, which looks fine in print, but is ugly as sin on a computer screen. Now, you can change all that.

One thing you have to remember when choosing which font you want to use, is the fact that just because you have a particular font on your computer does not mean that I have that same font on mine. If you don't have the same font that I have, then this will show up looking like Greek. There is a solution, though. When choosing fonts, choose ones that are relatively common, like Arial, Helvetica, Geneva, or Verdana. The beauty of the FONT FACE tag is it will go through all the fonts you have selected until it finds one that the user has, and will then display that one. You can do this more easily with style sheets [that's what I use], but they are beyond the scope of this course. And besides, other people have already done it better than I possibly could. Here's how the tag for this page would look if I didn't use style sheets:

<FONT FACE="Verdana, Arial, Helvetica, san-serif">
The little san-serif bit at the end is just in case some users don't have any of those fonts I listed. What it will tell the browser to do is select the default san-serif font for his or her system and display the page using that. I really don't want to get into the ins and outs of the fonts themselves, and what serif and sans-serif fonts are, or what fixed-width fonts are, or anything like that. For a good crash course on typography on the net take a look at Webmonkey. Last time I checked they had quite a few good articles and tutorials.

You can alter the size of your text in the very same tag, with the SIZE attribute, oddly enough. There are, to the best of my knowledge, three different units of measurement that you can use to set the font size: points, pixels, and whole numbers. I would recommend you use the system of whole numbers, since points and pixels can be very limiting to your user [I'm actually guilty of this when I use style sheets - but it doesn't work quite the same way with them]. With the whole number system [I don't know if that's what it's actually called, that's just what I call it], you can set your text size as any whole number between 1 [one] and I think about 7 [seven]. If the user has vision problems or just finds it difficult to read your page because of their screen resolution, then they will be unable to resize the text if you set the SIZE attribute in pixels or points. I usually use a value of "2" for my pages, which is a little smaller than the default value, but big enough to still be legible on pretty much all systems and resolutions. But even if it isn't, then hey, it's resizable.

On to the formats.

Back to List     Onward to Formats

c: august@vestige.org h: http://www.vestige.org