Create unique design is the key point to get users attention on your site. Just like working with traditional paper documents, fonts can make a really big difference in the way your documents look. You can invoke a wide variety of feelings just from the look of the type. You can go from a formal, almost rigid look to a whimsical or childlike presentation. You can use fonts for the same effect on the Web, as long as you keep certain limitations in mind.

Three major terms are used to describe the styling and presentation of text on both paper and the Web: typeface, font family, and font. A typeface is a specific design for a set of characters. The design is what gives the characters their
unique look. Is there a curlycue at the bottom of the letter g or a long, waving top stroke on the capital letter F? Does the whole set look like the handwriting work of a five-year-old? All sorts of features like these go into designing the typeface, which is given a name by its designer. Common typefaces are Arial, Helvetica, Times New Roman, Garamond, and Courier.

A font, then, is a specific instance of a typeface. The additional properties of a font include the size measured in points, pitch (width of the standard character within the font, measured in characters per inch), and spacing. Therefore, if I were to correctly refer to a font, I’d need to say something like, “Courier 12 point, with pitch value of 10.”

The point value used to measure font size is a height measurement, with each point is approximately 1/72 of an inch. The Courier 12 point font, then, would be 12/72 of an inch high, or easier read as 1/6 of an inch in height. Many browsers generally use a 10-to 12-point font size as the default font size. Later in this chapter, I’ll look at how the user and the designer can make changes to those sizes. Finally, the font family is a set of fonts of the same typeface that have different sizes and other adjustable characteristics.

Typefaces and their associated fonts can be divided into two broad categories: fixed-width (also called monospaced) and proportional fonts. A fixed-width font gives the same amount of space to each letter, whereas a proportional font gives different amounts of space to different letters.

Many people consider typefaces to be the basis of graphic design. Well-chosen and well-placed typefaces are a key factor in whether documents communicate effectively to the intended audience. Typography is the study of the selection, combination, and placement of fonts.

In almost all aspects of computing experience, the user is able to choose which typeface to use in various interfaces, including the ones to be used for text displayed in your Web browser. Going further, not only can the user choose a typeface, but which specific font to use as well! However, the ability to make such changes and manage them to provide a pleasing result can be harder than it sounds.