Primary Color:
Primary Text:
Secondary Color:
Secondary Text:
Tertiary Color:
Tertiary Text:
Color Picker
Preview
FeaturesTypographyTutorials
Module Title
Home
Module Title

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut non turpis a nisi pretium rutrum. Nullam congue, lectus a aliquam pretium, sem urna tempus justo, malesuada consequat nunc diam vel justo. In faucibus elit at purus. Suspendisse dapibus lorem. Curabitur luctus mauris.

Module Title
Module Title
Instructions

Select a predefined style from the drop-down or choose your own colors via the handy mooRainbow based color-chooser. When you are satisfied with your selection, click the "Apply Colors" button below to store your selection in a cookie.

Apply Colors
Home Fonts & Typography
Fonts & Typography PDF Print E-mail
Written by Graphic Design Spider   
Wednesday, 24 September 2008 03:28

Fonts and typefaces – something that most people just kinda don’t get.  Different typefaces don’t just exist for fun – they convey different types of moods, emotions, and effects, and a point of good design is to be sure that your use of particular types faces is done completely intentionally; in other words, you’re picking a typeface because it’s going to complement the tone and style of the piece you’re working on, and therefore, more effectively communicate with your audience.

First, the basics.

A font is an electronic file installed on your computer comprising a complete set of characters of a single size and style within a particular typeface. A typeface is a whole family of fonts that differentiate from each other in one or way or another, but are all paired under the same stylistic umbrella.  For example, the font Arial Bold would be found within the Arial typeface (or family).  But when you go out to the Internet and see typefaces that you like, you download them as fonts, and put them in the Fonts folder.

If you were to go out to sites like www.fonts.com, you’d see a ton of different font styles – blackletter script, calligraphic, etc.  But, let’s keep things simple.  You can lump most fonts into one of three categories: serif, sans serif, and script.

Again, in the interest of keeping things nice and simple, “serifs” are like little feet on the ends of the letters.

Therefore, serif fonts are ones like Times New Roman, Garamond, Baskerville, Copperplate, etc.  All serif fonts have the “feet” we mentioned before.  They tend to convey a more formal, solid, and traditional tone.  If you were designing an ad for a cigar lounge, where the walls are made from rich oak, everybody drinks 15-year old Scotch or gin, and the servers address patrons as “sir” or “madam,” using a serif font would help convey that tone.  Most newspapers use serif fonts for both body text and headlines, since they’re working to maintain the reputation of a solid, dependable news source.

Sans Serif (without the feet) fonts carry a more modern and contemporary feel to them.  This includes families like Arial, Trebuchet, Tahoma, Helvetica, etc.  Also, any font with the term “sans” in the title is usually a sans serif font.

If you were designing the label for a body spray that features hip, young models and a lot of dramatic lighting and effects, you’d want to use a sans serif font to convey that attitude.

Script fonts are just what they sound like – cursive-style fonts.  Although one could make a case that cursive and script are different things, you get the idea.  These are great typefaces, but you want to make sure you use them sparingly and for the right application.  If you were designing a brochure for a funeral home and wanted to include a quote from a family on the front, a script font would help make it seem more personal…almost like someone’s reading the quote aloud.

Now that you know the differences among the font categories…see if you can figure out what type of font we used on this website.

Body Text vs. Headline Text

One of the biggest mistakes newbie designers make is to not differentiate between headlines and body text.  Some basic guidelines:

-Remember that a headline is there to get attention.  Some ways to set it apart are to make it bold, or make it significantly larger than the body text. 
-You rarely want to make body text bold or too small – it should be easily readable for most people.  Also – make sure that the color of body text is easily discernable against its background.  You’d be surprised how many people think it’ll be easy to pick out bright yellow against lime green.

Just remember that your audience is going to spend the most time reading the body text, so you want to make it easy on their eyes so they keep their eyes on the page longer.  Black text on white is the most legible and easiest format to read…but experiment and see what you can come up with.

Also…don’t feel like you’re limited to one particular font style.  You can have a sans serif headline along with serif body text and a pullout quote done in a script font.  Just try not to put more than two (or three at the most) different fonts on a particular page, or it gets cluttered.

Free vs. Paid Fonts

The fonts that come installed on your computer are a good place to start, but if you’re going to be a real designer, you’d best have a stock of good, reliable fonts at your disposal.  There are several ways to do this.

There’s a multitude of sites on the web where you can download fonts for free.  We’ve included a few of them below.  These sites usually contain thousands of several different types of fonts that you can download and install for free, without a catch.  There are a couple drawbacks, however.  First, these fonts tend to be more on the eclectic side.  Even though there’s a variety of different types, the majority are somewhat cartoony or are designed to look like a famous logo (Star Wars, The Simpsons, etc.).  If you really look, you can find fonts that you can use in everyday design situations.  However, these fonts aren’t always as crisp and clean as ones you’d actually pay for.  So, if you’re planning on doing design on a regular basis, we’d recommend you shell out a few bucks for some good, professionally-designed fonts that are sold in families and packs (so you get the bold, italic, and other versions).  If you can get a few good serif, sans serif, and script fonts, you’ll be all set.

Some Other Stuff

Learning about fonts and typefaces is a great first step to becoming a skilled designer.  After reading this primer, you’re already ahead of the pack.  To learn more, check out some of the resources below.

In the meantime, take a look at typeface/font choices anywhere you go.  Look at size, placement, style, etc., and just take some mental notes and think about why the designer made the choice that she/he did.  You’ll start learning some valuable lessons just by observing.

Related articles:

List of Font Resources

Paid Font Sites
Free Font Sites
 

GDS Mailing List

Sign up for our FREE newsletter to receive design tips and discounts on Interviews and other products!
Name
E-mail Address

Like it? Share it!

Add to: JBookmarks Add to: Facebook Add to: Mr. Wong Add to: Buzka Add to: Windows Live Add to: Ximmy Add to: Power-Oldie Add to: Bookmarks.cc Add to: Linkarena Add to: Digg Add to: Del.icoi.us Add to: Reddit Add to: Jumptags Add to: Upchuckr Add to: Simpy Add to: StumbleUpon Add to: Slashdot Add to: Netscape Add to: Furl Add to: Yahoo Add to: Blogmarks Add to: Diigo Add to: Technorati Add to: Newsvine Add to: Blinkbits Add to: Ma.Gnolia Add to: Smarking Add to: Netvouz Add to: Spurl Add to: Google Add to: Blinklist Information

Polls

As far as graphic design experience...
 
RocketTheme Joomla Templates