Fonts
A introduction on the role fonts play in web design.
Introduction to Fonts
Choosing which font to use is a critical step in the design process. Considering how much the text affects the feel of a web page it’s surprising how little attention most webmasters give to their fonts. Each different font will change the look and feel of the text on your web page. This is because many times most readers don't consciously notice what font is being used but they have impressions in their head about what each font conveys. These impressions influence the meaning of the message and the style and tone of your page so you'll want to think about who is reading your page and the feeling you want to convey, then choose a typeface that fits. For example, some of the older fonts you see in textbooks convey an academic or formal tone while some of the newer alternative fonts convey a contemporary or informal tone.
There are no good and bad typefaces, there are appropriate and inappropriate typefaces for each situation. If you run a serious business you'll want to use a serious font but if you run a fun business then you'll want a fun font. Although the job of selecting the most appropriate font for your page can be intimidating, if you use common sense and follow some general guidelines then you will be in good enough shape to be able to make your page look attractive.
Font Fundamentals
 | Fonts and Typefaces. Many people use the term "font" as a synonym for typeface, which is incorrect. A "typeface" defines the shape of each character and is made up of the upper and lowercase letters of the alphabet, the numbers zero through nine, punctuation marks, and special characters. Within the typeface there are many fonts to choose from — different sizes and styles (e.g., italic, bold and so on). "Fonts" are the electronic files that contain typefaces. They denote a particular typeface in a particular size and a particular weight. When referring to computer useage the interchanging of the two terms isn't really an issue. |
| Type size. The height of characters in a font is measured in points with each point being approximately 1/72 inch. The width is measured by pitch, which tells you how many characters can fit in an inch. Common pitch values being between 10 and 12. A font has a fixed pitch if every character has the same width (also called a "monospace font"). If the widths vary depending on the shape of the character, it is called a "proportional font". |
| Serif or Sans Serif. Typefaces fall into one of two categories - serif and sans serif. Serifs are the small cross-strokes that decorate the ends of a letter. Serif fonts are usually considered more readable than sans serif fonts which is why they are used in long texts like books. Sans serif fonts don't have these cross strokes and are simpler and have usually been used in writing headlines. But computer monitors show sans serif fonts better than serif fonts (because of the low resolution of computer monitors) so many webmasters use sans serif fonts for body text. |
| Leading. Leading (rhymes with "heading") refers to the amount of vertical spacing between lines of type. It is commonly referred to as "line spacing". |
| Weights. Typefaces generally come in several different weights, such as Regular, Italic, Bold, and Bold Italic. Each of these weights is contained in a single font file. |
| Proportional or Monospaced. Type can either be monospaced or proportionally spaced. Type that comes from a typewriter and a few fonts are monospaced, which means skinny letters have the same width as wide letters. With proportionally-spaced fonts each letter is just the width of the character so skinny letters take up less space than wider letters. |
| Letter Spacing - Kerning. This refers to the adjustment of the space between individual letter pairs. Its purpose is not to increase or decrease the letter spacing overall but to correct problems which occur between specific pairs of letters. |
| Letter Spacing - Tracking. This is the amount of space between letters. Tracking is usually used to increase letter spacing as type gets smaller and decrease it as type gets bigger. For example, large headers on web sites sometimes have less letter spacing than normal because large font sizes can make the letters look too far apart. |
| Font Family. A font family is a group of related fonts which vary only in weight, orientation, width, etc. For example, Times is a font family, whereas Times Roman, Times Italic and Times Bold are each fonts. |
Buying Fonts
Most people don't know it but fonts are copyrighted and licensed for use and font licensing is a very delicate issue because most fonts sold on the web are ripoffs. Because of this you may want to avoid fonts sold on shareware Websites where you can get a billion fonts for a little money because they debase the value of the work because there is no credit given to the original designers.
Font Links
Font Finder
Buy Fonts
