Design Review

Industry insights, studio news, and even a recipe or two!

Everything You Ever Wanted to Know About Fonts (But Were Afraid to Ask)

December 7th, 2010 by

An almost invisible art form

Untitled 1

Fonts exist everywhere you look, covering every conceivable surface – from television, posters and billboards to newspapers, magazines and the web. Yet they fade into the background, passing almost unnoticed. They are the workhorses of the design world, carrying meaning, making sales, persuading, while rarely receiving their due as pieces of art or even craft. They’re designed to be appealing to the eye and help draw attention to the pieces they are placed on – not to themselves.

What is a Font?

To understand what fonts are, you first need to understand what typography is. Typography is the technique of the arrangement of type (typefaces, point size, line spacing and line length), type design, and the modification of type glyphs. A typeface – often incorrectly regarded as the same thing as a font – is usually a visually consistent family of letters, numerals, and punctuation marks.

Fonts and typefaces were more easily differentiated before the widespread adoption of desktop publishing software, when a font was understood to mean a specific member of a type family such as italic or bold. For example Papyrus regular, Papyrus italic and Papyrus bold are all different fonts within the typeface, Papyrus.

In common usage today, a font is a complete character set of a single size and style of a typeface. If you have used any sort of office software, such as a word processor or spreadsheet program, you are likely familiar with several types of fonts, such as Helvetica, Verdana, or Comic Sans (which is despised by professional graphic artists).

So technically, when people are talking about fonts, they actually mean typeface, but the terms are generally used synonymously now.

The History of Typeface

Centuries ago, books were entirely written out by scribes, which severely limited the number of books that could be written. As you can imagine, books were quite rare. The need for faster book printing led to the invention of movable type, which was perfected by Johannes Gutenberg sometime around 1439.

In the process created by Gutenberg, a steel punch – which had a mirror image of the letter – was struck into another piece of softer metal. The impressions were then filled with molten metal to create “type,” which was then placed in a mold, or matrix, to be inked and pressed into paper. This was the invention of the first type, designed to resemble handwriting – Gothic blackletter, sometimes called Old English.

As more printing shops began to open, printers started looking at other font styles, which led to the creative art of font/typography design.

There are six families of typefaces based on the period of time during which they evolved:

  • Old style
  • Transitional
  • Modern
  • Slab serif
  • Script
  • Contemporary

Garamond, created by Claude Garamond in 1532, is the most common typeface of the Old style family.  The Transitional family was created when an English designer by the name of John Baskerville created Baskerville in 1757, which is heavier than the styles of the Old style family and designed to improve legibility. In the last stage of Old style evolution came the Modern typeface family, which began with the creation of Bodoni by Giambattista Bodoni in 1798.

In the nineteenth century, technology and the need for a new type style in mass communication – such as posters and other forms of advertising – brought life to the next family of typefaces, Slab serif. Vincent Figgins first commercially introduced slab serif around 1815. Script typefaces started to appear in the late eighteenth and early nineteenth century. The script family was developed to represent cursive handwriting and contain fine and thin strokes. Finally, in 1930, Paul Renner created Futura – the first Contemporary, completely serif-less (sans serif) typeface.

Photocomposition gained popularity around 1950 and was a process of assembling type by photographing characters on film. The type was developed on light-sensitive paper or on photographic positives, which were then used to make printing plates. This process gradually faded away between 1975 and 1985.

Computer-based typesetting began around 1973 when hybrids of photocomposition machines and digital output came together. Many of these machines were programmed with proprietary command languages to allow communication between output devices. Because none of these machines used a widely used command language, each machine output fonts in different ways, which was not optimal

In the late 1980s, the Apple Laserwriter printer was one of the first laser printers available to the general public. Also, the Apple Macintosh computer at that time was one of the first widely used computers to feature a graphic user interface. Concurrently, Adobe released one of the first desktop publishing programs requiring a graphic display, which they named PageMaker. Both the Laserwriter and PageMaker utilized the PostScript programming language, helping PostScript become the standard for typesetters. This marked the beginning of the digital printing age we see and know today.

The Attributes of a Typeface

There are two attributes of a typeface: type weight and type size.

The weight of a specific font is the thickness of the strokes of the characters. Fonts will appear lighter or darker depending on the weight of the typeface. Most typefaces have around 2-6 weight variances while others may have as many as 12 ranging in variances from ultra-light to extra-bold.

The most common font descriptions are:

  • Hairline
  • Thin
  • Ultra-light
  • Extra-light
  • Light
  • Book
  • Normal / regular / Roman / plain
  • Medium
  • Demi-bold / semi-bold
  • Bold
  • Extra-bold / extra
  • Heavy
  • Black
  • Extra-black
  • Ultra-black / ultra

The image below shows an example of various font weights.

Untitled

The size attribute of a font refers to the height of a character, which is measured in points. One point is the smallest unit of measure in typography and is often abbreviated as “pt.” Traditional point sizes usually used for letterpress printing start at 3 pt and go as high as 72 pt. Larger sized type (14-18 pt.) is mostly used for headings while medium sized type (10-13 pt.) is mostly used for body text. Fonts of 72 pt. or higher are generally used for displays or posters.

The image below shows an example of font size.

Untitled 3

Serif and Sans Serif

In addition to typeface or font attributes, there are also visual features known as serifs. There are only two serif categories typefaces can have – serif or sans serif.  Serif fonts are generally easy to recognize by the thin strokes at the ends of some characters.  On other characters, such as the letters “O” or “S,” you’ll notice that the horizontal lines of the character are thinner than the vertical lines. Serif typefaces are often more legible (especially in print) than sans serif typefaces and help to catch the readers eye, which is why they’re very popular with newspapers and (somewhat less so) on the web.

See the image below for an example of the serif font, Times New Roman.

Untitled4

Sans is a French word meaning “without,” so sans serif basically means that the characters do not have serifs. These types of fonts contain characters, which are consistently the same weight on vertical and horizontal lines. Sans Serif fonts are often used for body content and titles or headings.

See the image below for an example of the sans serif font, Arial.

Untitled5

Modifying Typeface

There are three major modifications that can be applied to type: kerning, leading, and alignment. All three of these modifications are used to ensure the text is visually appealing and legible, or to achieve a desired look on the document in which it appears.

The space between characters is called letterspacing, and is very important for the correct display of various characters. Letterspacing is built into every font you see on your computer. Characters such as “l,” and “h,” require more spacing than characters such as “o,” and “c.” Kerning is the process of making adjustments to the letterspacing between characters. Negative kerning is when the space between characters is decreased and positive kerning is accomplished by adding more space between characters.

The space between lines of text, for example above or below a sentence, is referred to as leading (pronounced as ledd-ing). The term originally comes from the old process of placing metal lead strips between lines of text in letterpress printing.

The alignment of the text is also very important, depending on how the text is being used. Depending on the style intended for the composition of the text, the alignment may be specified as flush left, flush right, justified and centered.

Font Software

With the widespread use of computers today, professional type designers, web designers, and even hobbyists are using many types of font creation software to create their own fonts. The first commercial font editing software was actually released in the mid-80s for the Apple Macintosh, called Fontastic. Since then, many more font creation programs have become available, such as the very popular Fontlab Studio, and Fontographer.

There are various other popular font design programs available in addition to the high-end programs mentioned above such as Typelight, FontForge, FontCreator, Typetool, FontStruct, and FontExplorer. Many of these programs are available on both Mac and PC and are offered at various levels of expertise.

Free Fonts

Now that you know what a font really is, the terminology used to describe them, the elements that make them up, and a bit about how to manipulate them, we thought you’d enjoy some free ones to use in your own projects. The sites listed below are some of the most popular and reputable places to download and install free fonts to your computer.

Have fun and let us know if you come across anything cool!

Sources:

http://en.wikipedia.org/wiki/Font

http://en.wikipedia.org/wiki/Typeface

http://nwalsh.com/comp.fonts/FAQ/cf_28.htm

Visual Design Theory – NIIT

http://www.vletter.com/aboutfonts.htm

http://en.wikipedia.org/wiki/Slab_serif

http://www.linotype.com/fontcloud

http://en.wikipedia.org/wiki/Script_typeface

Questions or Comments? Leave a reply, we would love to hear from you.


Phone: 303.995.1472 Fax: 1.866.823.5015 Site Map