Web Design: What Fonts to Use?

Copyright 2006 Mark Nenadic As web designers, it's difficult not to get bored by using the same old fonts day in and day out with every new - or not so new - web design. After all, web design is a creative job, but how can we let our creativity flow when we're being held back by font restrictions. Worry no longer, there is something that you can do about the font that you use. Though choosing a new font is a bit more complex than it may initially sound, there is a way that you can go about choosing the way that your text will appear. Essentially, there are fonts that come pre-installed in all Windows and Mac operating systems. Of course, these font sets do change over time, but there are a great number of them that have been around for a long time, and will continue to be due to popularity. This is an issue, because you will want your font to be compatible with the operating systems of your users. The same thing goes for the web browsers, such as Netscape, Internet Explorer, and Firefox, used by your viewers. Of course, you can't assume that every font will be visible to everyone, but there are some things that you can do to "shake things up" a little bit for the sake of your web design - and your own sanity. Overall, there are a few different forms of fonts available to you. Usually, this consists of: Serif (also called generic) - such as Times New Roman, Georgia, Palatino Linotype, Trebuchet MS Sans serif - such as Arial, Helvetica, Verdana, and Geneva Mono-spaced (also known as typewriter style) - such as Courier New, Lucinda Console, Monaco, and Andale Mono Cursive (also known as scripts and informal) - such as Comic Sans, Brush Script, Zapfino, and Marker Felt Fantasy - any fanciful design such as those with floral and other forms of embellishments, or those in the shape of objects. Naturally, this is not an exhaustive list, but it gives you an overall idea of what's out there, and how it's classified. This is important to know, because it is required when you enter the information into your site script. Because you'll be offering your site to different operating systems and browsers, your script must instruct your user's computer as to how to display the type. This is the reason that a web page script is specified in CSS in a way such as: Font family: , , , So you could write the following to instruct your viewer's computers: Font family: Georgia, "Times New Roman", Times, serif What does this mean? It means that while Georgia is your preferred choice for the web design, if it is not recognized by the user's computer, it should use Times New Roman and Times instead, which are the names used by Windows and Mac for the most common serif font. Since the serif is the generic, the operating system will always have something to work with, and the text of your website will always (or at least, almost always) be visible and readable to your site visitor. Similarly, if you were using sans-serif font styles, your specification could say: Font family: Verdana, Arial, Helvetica, sans-serif Just as the serif script said, this one states that Verdana is your first choice for your web design, but Arial and Helvetica can also be used as alternatives, and if they are not recognized, then the 'sans-serif' generic style will do. By using those font specifications, your script will work with your site visitor's operating system to find a font that is already installed on their list. This also means that you can choose whatever font you want as your primary font choice, and always have a secondary and tertiary backup in case your desired font doesn't happen to be installed on the computer of any of your website visitors. As a web designer, this makes web designing much more appealing, as it allows for greater creativity and flexibility when creating the overall look of the web design. Furthermore, it is attractive to the website visitor, as it allows for something different to look at, and a font that has been specially chosen for that particular site.