Choosing Fonts

As one of the authors is fond of saying, "Letting a newbie loose in a font menu is like giving a crazy person a gun." In many respects, the font chosen will actually set the "tone" for the entire site. What follows is Chris' rationale behind his font choices:

Let me first begin by saying that this is not intended to be a lesson in graphic design. By nature, I'm an intuitive designer, and that intuition has been cultivated through a combination of many years of graphic design study and work experience. As such, the way I work is a method that meets my needs and may not be the case for you.

Asking a designer why he or she decided to use a particular font (or in the case of the Oakbridge Community Center logo, a combination of fonts) is very much akin to asking why a painter decides to use "Kelly Green" instead of "Forest Green." Why does a designer ultimately decide to use a serif font instead of a sans serif font? Why Aachen Bold instead of Helvetica Black? These are aesthetic decisions.

Very early in my graphic design schooling, I had a professor that preached that every font has a unique characteristic, and it is the job of the designer to decide if that font's characteristic fits their particular design. In essence, the characteristics of a font will determine how appropriate it is for the design at hand.

To understand how this theory works, let's take a look at wedding invitations. As a rule of thumb, wedding invitations are normally elegant and classy. Therefore, a cursive or calligraphy-type font would be a wise choice to convey those sentiments. A font that is thick, boldfaced, and heavy such as an Aachen Bold typeface would not be a wise choice. Likewise, a stock car racing program should not be designed with the same cursive , elegant font that wedding invitations use because that font would seem too fragile and wouldn't match the nature of the sport. In this instance, Aachen Bold would be a perfect choice, as its characteristics scream "toughness," and its thick, heavy, bold, macho characteristics match that particular sport. Find the characteristic of the font and match it to your project.

That's what I tried to do with the Oakbridge Community Center masthead. At the start of the process, we decided the community center was going to be family friendly. I then chose the characteristics I thought the OCC font should have.

The first decision was to use a serif font. This would convey a sense of class and responsibility and would make it appealing to parents, young adults, and possibly senior citizens .

Although the center would be populated by kids, I purposely tried to stay away from using a font that might look "cool" or "hip" such as a hand-written or graffiti-looking font. Although I'm sure the neighborhood kids might enjoy it, it could also present the wrong type of message and possibly attract the wrong type of crowd .

Figure 10.1 shows you a good example of this. Using Eras Ultra ITC (the middle treatment) and Comic Sans at the bottom, you can easily see how the "message" changes.

Figure 10.1. The choice of font has a dramatic impact on the message.

As such, the serif font needed to be bold but not heavy. Because some serif fonts have very, very thin stems, those stems can sometimes get destroyed when trying to make them into web graphics, so I needed something bold but not too heavy.

Ultimately, I chose to go with a font called AzoteSSi. This font seemed to have all the characteristics I was looking for, and it was perfect for the "Oakbridge Community" portion of the logo.

With regards to the word "The," I found using the AzoteSSi font didn't seem to add enough contrast. Instead, I needed to choose a different font, but one that still seemed to convey friendliness. Finally, TangoScriptSSi seemed to be the perfect fit, and properly scaled, it fit absolutely perfectly inside the letter "O."

The word "Center" was always going to be a part of the navigation bar. As such, it was very easy to compose the word and place it as far to the right as possible. In this case, that meant placing it tightly against the stem of the "Y" in the word "Community."

And a logo was born!