Setting Logotype — Part II
In our last installment on logotype, (Setting Logotype — Part I), we noted that logotypes are typically stored as images, rather than as text. Because of that, font smoothing — the process used to make type look good at all sizes — can’t be applied to logotype.
Now we ask, “Why?” Why store logotypes as images rather than as text?
Well . . . there’s a darned good reason for that, and we’ll get right to it.
Previously, we saw this lousy looking logotype from Venable:
Now we’re going to create a good looking version of Venable’s logotype:
In the process, we’ll discover why we can’t store logotypes as text (yet).
________
Let’s get started.
To begin, Venable’s logotype is set in Times Roman, in a text style known as caps and small caps.
So, we start by setting the logotype that way:
.
VENABLE
Next, we stretch the type vertically by 50%:
Then, we adjust the spacing between the characters:
Finally, we add the trademark symbol and the LLP:
So, there’s our logotype set to spec.
Why not use the logotype as set. Why store it as an image?
Because we want a browser to display the logotype at the firm’s web site, but browsers — unlike typesetting programs — can’t do all the things we did to set the logotype as text. (Though they will be able to do such things in the near future.)
________
Now, zoom way in on this page. As you do, note that the one instance of Venable set as text is the only one that remains nice and smooth at any level of zoom. All the others, being images that can’t be smoothed, look fuzzier and fuzzier the more you zoom in on them.
In our next and final episode, we’ll see what we can do to improve the quality of the logotype at all levels of zoom.
1 February 2010 at 12:20
Fantastic work with the logotype but just one little thing — when adjusting the space between the letters, the last thing you want is uniform spacing. Although Venable isn’t the best word for illustrating the general principle — Illinois might be better — here are the basic rules:
1. Leave extra space between the vertical elements of letters like F, L, B or H.
2. Reduce space between round letters like O or C and adjacent verticals.
3. Let slanty W or V or A overlap an adjacent letter.
bonus:
4: Let the curve of an O or U or S fall slightly, very slightly below your baseline.
These are old calligraphic principles that are most often lost in computer fonts. Type Illinois in any size of Arial and you’ll see what I mean.
1 February 2010 at 15:05
Steven:
Thanks. Those are great tips, but #4 doesn’t apply.
If you look closely, you’ll see that characters that are curved on the bottom don’t sit on the baseline. They sit just a bit below it so all characters SEEM to be on one line.
12 February 2010 at 9:12
[...] our last installment on setting logotype, (Setting Logotype — Part II), we examined why logotypes are usually set as images, rather than text. Because of this, they need [...]