The WebDev Buzz

One of the problems that web designers sometimes face is that the design they created offline appears different from the one that can be viewed online. Then, the client will complain saying that the words are not pleasant to the eyes or the overall effect is not as strong as the client expected. The problem may lie on the type of fonts used.

Unfortunately, the web designer will have no complete control over the font types. This is because both the Windows and the Mac OS have pre-installed fonts. And the types of fonts that were pre-installed depend on the version of the Windows of Mac OS. That is, older versions are different from the later versions. This implies that the receiver or reader of the web page may be using a computer that does not have the fonts used in the original web page design.

Still, the web designer must go around this problem and come up with an attractive website. The first thing he needs to do is to recall the few general styles of fonts. There are only five general styles: Serif, Sans serif, Mono-spaced, Cursive, and Fantasy. Here are the particular font styles included in each general type.

• Serif fonts: Times New Roman, Georgia, Palatino, and Trebuchet MS.
• Sans Serif: Arial, Helvetica, Verdana, Geneva
• Mono-spaced: Courier New, Lucida Console, Monaco, Andale Mono, and other typewriter styles
• Cursive: Comic Sans, Brush Script, Zapfino, Marker Felt, and other script and informal designs
• Fantasy: Ice Age, and other very rare and imaginative designs

When choosing a font style to use for a web page, the usual command goes by this standard format: font family: , , ,

For example, a web designer may write: font family: , , ,

The above command means that the web designer prefers the Verdana to the rest of the fonts. If the browser or computer application does not have Verdana, the alternative will be Arial. If both of them cannot be found in the stored font styles, then Helvetica is the third choice. If none of the specific three types are present, then the computer will need to look for a font style which is classified as Sans Serif. What if this, too, is none-existent? Then the default font of the computer will be used.

There are two implications of the above situation. First, there will always be fonts that will appear on the screen. That is, no website will appear empty. Perhaps, just way different from the intended one. And second, the web designer can choose fonts and not rely on the default font of either Windows or Mac OS. The first font type that he places in the tags will always be read as the preferred font.

In choosing fonts, another consideration is the size of the fonts. For bigger headlines or for banner ads, the good choices are Impact, Optima Extra Black, Gill Sans Bold, and Futura Extra Bold Condensed. These font types (and other similar fonts) have that punch needed to grab the attention of the reader. But these font types are not ideal for the body text. For small fonts, most font styles available are quite fine to use. But some of these fonts may appear either smeared or awkward in other computers. The best thing to do is to have small fonts saved in GIF or PNG.