Did You Know...
How To Match Fonts With Personality? June 27, 2008
Fonts have personalities of their own and are used
as decorative elements to convey a certain look and feel for products and
businesses. When employed appropriately, they can be used to reinforce your
message to your customers. So, for example, lawyers and doctors use conservative
fonts to indicate their professionalism and graphic designers and artists use
fancy fonts that reinforce the idea that they are creative people.
However, what works in print doesn't always translate to the Web. And, with so
many to choose from, using fonts on your Web site isn't as simple as it might
first appear. Nothing turns off a potential customer more than arriving at a Web
shop that is cluttered with clashing, hard-to-read fonts. Its important to
select fonts that match your Web site's message and tone and explain some issues
peculiar to using fonts on the Web.
Fonts with Personality
Whatever it is that you are selling, the fonts that you use to create your logo
and decorate your Web site say a lot about your product. It's important to match
the fonts that you use to what it is that you want to say to your customers. For
example, elegant script style fonts work well for all things wedding related,
while gothic fonts are very 'in' right now for alternative arts. Use the right
font and immediately your audience knows a lot about your business — mix these
up and you confuse your visitors with mixed messages about who you are.
The Personality of a font
conveys a certain message about the business with which it is
associated
(click for larger images).
The example image above shows how the
personality of a font conveys a certain message about the business with
which it is associated. On the left side (above) are four fonts used for
text logos for four businesses. None of these fonts are a good match for how
we traditionally think about these businesses. The lawyers' names are too
flowery, the wedding font looks scary,
The fonts shown in the right-hand side image have personalities that clash
with the businesses they're describing. Those on the right look more
appropriate.
However, if you rearrange the fonts so they better suit the four businesses,
then it all takes on a much more appropriate look. The font that looked
scary for a wedding works just fine for a tattoo business, the lawyers look
like lawyers and the wedding business looks just as we expect it to. The
font for the children's fashion business gives a youthful feel to the logo.
It's all about understanding who your market is and creating a look
reinforced by the choice of font face and color that speaks to your market.
If you're interested, the fonts are, from the top: Skeksis, Sybil Green,
Chopin Script and Engravers MT.
Lost in Translation: Fonts and the Web
So now you understand how to match the font with the type of business
and your clientele. How does this translate to the Web? The answer is: not
very easily at all.
There are constraints in Web design that limit the fonts that you can safely
use on your Web site. The problem is that when you create a page, the HTML
code on the page is interpreted by a visitor's Web browser. This means the
page is rendered by the Web browser on your visitor's computer, so any fonts
specified in the code must be available on your visitor's computer for them
to be able to see the fonts on your page.
If you use a special font, for example, one that you have purchased, it is
unlikely that many — if any — of your visitors will have that font installed
on their system. The result is that their browser will substitute another
font for the one they don't have and your page won't look the way you
designed it to look.
There are only a handful of what are commonly called Core Web Fonts, which
are fonts that are generally contained on most computer systems. Core Web
Fonts include Arial, Arial Black, Courier New, Georgia, Times New Roman,
Verdana and Trebuchet MS.
Some other fonts, such as Lucida Sans and Comic Sans MS, are often
identified as Core Web Fonts but they aren't as universally available as the
other fonts. Webdings, a font full of dingbat characters, is available to
many users but not all.