Typography Basics for Artists. Part 2 - Matching the Typeface

Anatomic parts of a glyph according to Wiki
Anatomic parts of a glyph according to Wiki:
1) x-height; 2) ascender line; 3) apex; 4) baseline; 5) ascender; 6) crossbar; 7) stem; 8) serif; 9) leg; 10) bowl; 11) counter; 12) collar; 13) loop; 14) ear; 15) tie; 16) horizontal bar; 17) arm; 18) vertical bar; 19) cap height; 20) descender line.
And here it comes finally - the second part of the typography basics for artists, where we're going to address a very common and practical task of matching a typeface to some pre-existing reference. The first part can be found here, and again, the material of these posts should be considered as no more than a starting point for further investigation – a hopefully useful introduction into the boundless world which typography is, aimed at those who do not necessarily inhabit it full-time.

So we have a reference text and want to match its look as close as possible. And first of all we need something to match with. Adobe users have access to the great library of typefaces which is a blessing on a budget, but even with no budget at all there are online collections to browse out there (“download fonts free for commercial use” seems to be a nice search line to start with). “Free for commercial use” part is quite important as many typefaces are freely available only for personal use – fonts are usually distributed with a license text file which is always worth of a study. And for that reason in particular my preferred online collection is Font Squirrel. Google Fonts looks like another great place to visit.

As soon as we have a typeface library and a quick way of browsing through it – it only take looking and comparing to find the closest match. Here are few things to look at.

1) The sample text. I personally find it most transparent and convenient to use the reference text (or its part) itself as a sample line when trying candidate typefaces on. Making sure the test string has some digits and special symbols is a good idea too. Another useful and beautiful tool are pangrams – phrases containing every letter of an alphabet. Wikipedia offers quite comprehensive list for numerous languages (including Klingon); some of my favorites for English:

Public junk dwarves quiz mighty fox.
Cozy sphinx waves quart jug of bad milk.
Bored? Craving a pub quiz fix? Why, just come to the Royal Oak!

For larger volumes there is a classical Lorem ipsum and other filler texts.

typographic variants of lowercase "a" grapheme
Image by GearedBull Jim Hood
typographic variants of minuscule "g" grapheme2) One reason to compare the look of all the characters is that even though the other visual parameters (addressed below) of two typefaces might match quite closely, still the same symbol can be represented with different graphemes like the alternative versions of a and g shown on the right. Numbers and special characters allow various visual interpretations as well.

3) Identifying the typeface in question within a broad classification as the first step considerably speeds up the comparison, since from now on we can quickly identify and skip the non-relevant styles and focus on closer examination of candidates from the same group only (like Script or Serif).

4) The next level of precision would be considering the contrast (thickness ratio between the main and supplementary strokes in a typeface) and other proportions of the characters (both overall like wide or tall letters, and between the elements within each letter like ascenders, descenders and counters). These qualities play a big part in defining the look of the font, and the habit of thinking of typefaces in terms of their contrast speeds up the navigation over the typographic ocean considerably.
The contrast of a typeface is the thickness ratio of main and supplementary strokes

5) And then the details. Typography is all about the balance in proportion and fine finishing, so what could be considered a minor in most other visual arts becomes diverse and intricately nuanced. Shapes of the serifs, ending elements, connections between strokes – all have space for diversity. Here is a very cool PDF listing the typographic elements. The style of those elements is also a subject of fashion, and certain details can attribute the typeface to a particular temporal or stylistic group.

Different versions of serif "T" letter

Next part, whenever it will choose to arrive, is going to cover the basics of display typesetting.

No comments:

Post a Comment