• Commercial Type
• FontFont
• Font Bureau
• Hoefler & Frere-Jones
• Typotheque
• House Industries
• Village
• OurType
• Process Type Foundry
• Lineto
• MyFonts — As a retailer with a very liberal acceptance policy the quality of type available at MyFonts varies widely. Here are my personal recommendations (rated 4 stars and above) as a start.
• FontShop — The foundries represented at FontShop are more carefully curated, but there is still dreck through which to wade. I can’t link to my picks until the site’s Favorites function is shareable, but the Bestsellers, Award Winners and Underused lists feature some of the best stuff.

Of course, there are dozens of reputable outfits that make and sell good fonts. It’s almost irresistible to list every little foundry I love, but most of them are available via one of these outlets and a set of links longer than the one above is often more overwhelming than useful. Think of this list as a shopper’s starting point for building a lasting typographic toolset. These sites offer most of the best fonts available, and — crucially — present them well, too.

The focus here is on downloadable desktop fonts for print use, but some of these shops offer webfont versions as well. For now, my webfont service shortlist is simply: Typekit, Webtype, Typotheque, Fontdeck, and Fonts.com. MyFonts and FontShop also offer downloadable, self-hosted webfonts.

Speaking of typeface recommendations, our very own Typographica.org reviews are also a good introduction to a few of the best new typefaces. After an unforgivable two-year hiatus, we’re wrapping up the 2011 edition now.

It was built from scratch and made specifically for high density displays. Google describes it has having a “dual nature. It has a mechanical skeleton and the forms are largely geometric. At the same time the font’s sweeping semi-circular curves give it a cheerful demeanor.” — GottaBeMobile

This is pure PR BS. I know it when I see it because I’ve had to write a few glowing descriptions about typefaces that don’t really glow.

Click to embiggen image.

I’m all for the strategy of developing a unique identity typeface, and I commend Google for employing type designers in house, but this is an unwieldy mishmash. Roboto indeed has a mixed heritage, but that mix doesn’t have anything to do with the gibberish from the press release. Its parents are a Grotesk sans (like a slightly condensed Helvetica) and a Humanist sans (like Frutiger or Myriad). There’s nothing wrong with combining elements of these two styles to create something new. The crime is in the way they were combined: grabbing ideas from the Grotesk model, along with a Univers-inspired ‘a’ and ‘G’, welding them to letters from the Humanist model, and then bolting on three straight-sided caps à la DIN.

When an alphabet has such unrelated glyphs it can taste completely different depending on the word. “Fudge” is casual and contemporary. “Marshmallow” is rigid and classical. This is not a typeface. It’s a tossed salad. Or a four-headed Frankenstein. You never know which personality you’ll get.

For now, I can only speculate on how this beast came to be. The font files credit the design to Christian Robertson, whom I know to be a very bright professional with some decent work under his belt, including the convincing handwriter Dear Sarah and the adorable Ubuntu Titling font. Either Google tied him down and made unreasonable demands or there’s something nasty in the water down in Mountain View. To be fair, I haven’t seen the fonts on a phone, in person, and Google promises that they are built specifically for that medium. But I can’t imagine that would erase the inherent problem with the design. There are some good shapes in Roboto, they just belong in multiple typefaces.

In any event, Roboto probably won’t terrorize mobile screens for very long. Helvetica and Frutiger are immortal. Hodgepodge brutes like these usually have a short lifespan.

Download the Roboto fonts
See Roboto in action
For a multi-class combo done right, see Fakt or Breuer Text.

Update: Robertson has replied with his rationale for the design:

Here’s the thinking with the open terminals on the ‘e’ and ‘g’. It has been the hard and fast rule for sans serif types that the a, c, e, g and s must agree as to their angle of exit. Interestingly, this is not the case for serif types, and certainly isn’t true for any kind of handwriting. It is common for the lower case ‘e’ to be more open than the ‘a’ for example. If there is a single story ‘g’ it will often remain open, or even curve back the other way (up until it forms a two story g).

As I experimented with this thinking I realized a couple of things:

1 / I have always hated the way Helvetica and all of her acolytes close the terminal on the ‘g’. It is just so awkward. You can’t do it with a pen; the terminal always wants to end somewhere other than straight up (note that this is not true of s or a). It’s like a ‘t’ or ‘f’ that hooks all the way around. It’s just gross. It’s even worse with the geometric bowl on top. You get such an awkward double curve. I equally hate any calligraphic ‘g’ that closes with a ball terminal.

2 / I discovered that the type with a closed ‘a’ and ‘s’ and an open ‘e’ and ‘g’ has a really beautiful texture across longer blocks of text. The rhythm has this kind of a swirl that is actually really nice to read. You are correct that Fudge and Marshmallow may initially disrupt some expectations, but over the course of actually using the font, you forget that ‘e’ is decreed to be closed like ‘a’ (it doesn’t want to be anyway and ‘g’ needs a friend). Despite the PR speak, the variation in exit vectors does make for a more cheerful type.

As for the other two monster heads, I’m ignoring the part about the straight sided caps, since I don’t find it a problem that the lower case aren’t equally straight sided. Also, I find your disagreement with the K hardly worthy of justifying another head; possibly a finger or toe.

Note that there are still some bugs in the font that has been extracted from the SDK. Many of these have been corrected already, and you can expect to see some fixes to minor kerning issues and some diacritical misalignments. Also, since Android doesn’t use much of the nastiness that is TrueType hinting, Roboto is not hinted to support older Windows browsers, for example.

Update: Jan. 12, 2012 — Google offers the full 16-font Roboto family and specimen book on their new Android Design site. (Thanks, Reed Reibstein.)

It’s the sort of project that most designers have seen many times before they are even out of school. It would be more interesting if there was a theory or direction behind Moritz Resl’s approach, but his short description shows there wasn’t much thought put into it.

“This project shows what a font would look like if it consisted of all typefaces installed on my system. Every character from a to z is drawn using every single font with a low opacity. In total there are over 900 typefaces in my library. I didn’t exclude the ugly ones.”

Exploring the commonalities and differences between typefaces is intriguing (though others have overlaid fonts to make lovely images that work as art better than Resl’s), but without any controls in the experiment, nor any data about the method or what’s included, the only thing we learn from the result is that there is variety in type, enough to make something mostly but not entirely illegible. And we get a pretty video.

Something like Kai Bernau’s Neutral, a well-researched comparison of typefaces in search of the most “neutral” aspects, has much more value. I guess the images wouldn’t the draw the traffic that Average Font draws.

Update: Yet another exploration in typeface merging popped up last week. This time the result, Avería, is a working family of fonts. My reaction is essentially the same as I wrote above. It’s an arguably interesting experiment, but not a very useful one. The designer, Dan Sayers, sums it up himself in the first sentence of his description: “I am not a type designer.” If you need a serif in this vein, there are far more useful typefaces drawn by trained professionals from scratch — Tribute, Fabiol, FF Avance, Garaline, Galena, to name a few. Or, to put it in a more festive way:

“I toast that creation with a glass of my famous 725-wine punch.” — Jonathan Hoefler.

Above: Average Font by Moritz Resl and Face Variations by W. Bradford Paley

[Editor’s note: Ross initially posted this text as a comment but I felt it required the space and prominence of a new post. — SC]

Some of the following simply reiterates what Stephen has already observed, but I think it is worth reinforcing from a slightly different perspective.

Firstly, let me address the statement:

Font buyers rely on providers more than ever before. Those who provide quality and transparency will lead this new market and medium.

I certainly hope this will be the case soon. Currently, providers use a few approaches to address the quality issue. One approach is to leave the optimization up to the foundry or licensing designer. This is obviously the least expensive and most profitable approach in the short term — profitable for the third party provider, that is, probably not for the smaller foundry. Another approach is to develop some sort of “autohinting”. From what I’ve seen this is at best a stopgap that provides somewhat adequate results some of the time, and would be what I consider only a first step, perhaps suitable for fonts that you knew were only being used at larger sizes, or as a basis for manual improvements. If I could generalize, the main point of weakness is that most automated routines only recognize obvious features of glyph anatomy (eg. stems, and to a lesser degree vertical alignments) but are mostly incapable of recognizing relationships, which is a core principal of TrueType hinting; the rasterizer has to be explicitly instructed that the counter of an ‘e’ shouldn’t collapse and should have white inside of it, unless told otherwise using Delta instructions. Autohinting can only say there is a top stroke, a middle stroke, and a bottom stroke, and that the top and bottom are in alignment zones. In fact, it doesn’t really know that the middle stroke is in the “middle”, it just knows its a stroke, and it doesn’t know anything about the relationship between the top and bottom. And so on.

I see some mention of rendering quality — how one provider’s approach bests their competition — but I see little actual sensitivity to the quality. For the provider’s own websites, where they can chose the best option (one would hope they would, at least), they chose fonts which are not optimized and have obvious, easily remedied issues. Not the best advertising, but at least its truthful, I suppose.

Even with those who really do know better, you see rather odd examples. Stephen pointed out Monotype’s FontsLive site, which doesn’t show examples below 24px (ppms?).

Webfont at FontsLive.com with ClearType rendering.

On this page they are promoting the quality of their webfonts, but if you look at the first ClearType example, it very much looks like it is not even hinted (vis. 36px and below). It doesn’t surprise me that it isn’t hinted, but that they are using it as an exemplar of their webfonts. This illustrates a couple of the issues I already mentioned: the “provider” is pushing a service without adequately addressing quality issues, which in turn aren’t seen as affordable to the original foundry because the original foundry’s/designer’s slice of the pie doesn’t warrant the expense. So the complaint that they are only showing larger samples is a valid one. It’s a bit of a snow job, but in this case they can’t even pull that off because the problems manifest themselves even at display/headline sizes. (The second Copperplate example has the same problems.) Fortunately, their collection of fonts for text are well chosen because they are well hinted, but the distinction can be blurred, especially in cases where something that could be a “text” font is categorized as “headline” because its unhinted.

So now we have webfonts, and they’re spilling out into the wild faster than they really should. Well, actually, they aren’t really all webfonts, they’re just marketed as such. What are the discussions about quality taking place in foundries, distributors, and third party providers? What steps are they taking towards addressing the quality issues? Do they care? The one positive thing with webfont services is that the fonts are served, rather then installed, and so when a better quality version becomes available there isn’t some onerous install and upgrade procedure to deal with.

It also doesn’t help to skirt the issue by placing blame, or making excuses or predictions that are not demonstrably accurate. Saying its Microsoft’s fault because their rendering is “crappy” is specious. The (TrueType) rendering is fine, as long as the (TrueType) font has a suitable level of instructions. There are more fundamental reasons why MS have chosen to retain this relationship between the rasterizer and the font, some of which has to do with the global nature of their market. Whether or not Windows rendering is better then OSX rendering can be debated subjectively. This debate has no affect on the existing and near-future market that the font and design industries have to serve, where actual OS proportions should rule the decision-making process. Windows XP may well be anachronistic, but it so happens over 50% of users happen also to be anachronistic, and an additional 40% of people are using other flavors of “crappy” rendering systems. That’s approximately 90+% of users out there using “crappy” “anachronistic” software, and as suppliers of content to those systems we have to do the best we can.

The same goes for the argument that in a couple of years we will all have 300ppi screens. Well, maybe, but I wouldn’t count on it. We will have more high resolution devices (mostly mobile devices), but again we are looking at the bigger picture when producing content for the web. I won’t go into it in great detail, but it is considerably more difficult to manufacture say, a screen that is 70 square inches (such as a laptop) then it is to manufacture a screen that is 5 square inches (such as the iPhone). Manufacturers have to be able to produce volumes of screens at an attrition rate that does not impact efficiency (ie. if you have to chuck half the panels because they have dead pixels, it doesn’t make financial sense). This end of the industry doesn’t seem to move nearly as fast as the other components. Screen resolution has been nearly fixed for the last decade, with most devices hovering around the 100ppi mark (+/-10ppi). So this argument is fine, if you don’t mind not releasing any webfonts for the next 10 years (or however long it will take for high-res screens to be the norm) — otherwise you’re not really doing any good to our end customer’s experience.

Which brings us to the solution end of things.

I don’t think foundries realize yet the “damage” they’ve done by saturating the market with libraries full of fonts not-yet-ready-for-screen. [...] But nonetheless, type-designers, get busy with it! — Angus Shamal

Right. Easier said than done. There are only a handful of people on the planet who do TrueType hinting professionally. FontLab certainly has the basic tools available, if you know how to use them or are willing to learn. So that’s one hurdle. The other is time and/or money. Hiring a third party to do your hinting is an option if you can find someone with the time and if you can afford it. It is highly specialized and is priced accordingly. But the more basic issue — regardless of the form of the investment in hinting — is whether that investment translates to a reasonable return for the originating foundry or designer after all the distributors and “providers” have taken their cut. It seems to me a more coordinated effort may be a better option and that all parties involved carefully consider the quality of the product being released, and collectively find a solution to deal with the issue.

Ross Mills is a type designer and co-founder of Tiro Typeworks. He has been involved in the design and production of multilingual and specialist typefaces for Microsoft Corp., Linotype Library, Apple Computer, the Government of Nunavut and others.

Now that web designers suddenly face the challenge (and delight) of choosing fonts from an ever-growing selection, we thought it’s a good time to recommend some basic principles for making wise type choices.

The slides from each of our four quick presentations are below, as well as audio generously provided by SXSW. If you’re short on time and feel like you know the fundamentals, skip ahead to the second half of the session — I think the Q&A is as useful as our prepared stuff.

Of course, an hour is hardly enough time to deliver what one can get from the first day in a good Type 1 course, and as I listen to the audio I cringe at all the crap I missed or said poorly, but I think we did a decent job of introducing some concepts that will launch young designers more confidently into the new typographic web.

If you attended the panel and have any questions that you didn’t get answered or simply need help finding the right font, feel free to contact me here or on Twitter: @typographica or @font_id.

Slides

Audio

Or view the slides at full screen to autoplay the audio.

Resources

Related Links

• Photo of the panel by Ashley Bischoff
• Typedia: Type News, Webfont Alternatives
• Practical Examples: Typekit, Fonts in Use
• Helvetica in U.S. Retail
• Frutiger in Airports, Heathrow
• Hoefler & Frere-Jones webfonts?
• Hinting: Peter Biľak, Tim Ahrens, Microsoft, Beat Stamm
• Test webfonts before you buy
• Serving Typekit font weights and styles to Internet Explorer
• Readability
• Recommended typefaces here at Typographica
• FontFonter
• Combining typefaces: four techniques from H&FJ, with Helvetica, sans/serif
• Kerning, the game
• WebFont Loader (announcement)
• Font vs. Typeface
• Font identification resources
• Type Camp!

Recommended Books

• “The Elements of Typographic Style” (Bringhurst), Applied to the Web
• “Thinking With Type” (Lupton)
• “Detail in Typography” (Hochuli)
• “Stop Stealing Sheep” (Spiekermann, Ginger)
• more

Webfont Providers

• Typotheque
• Typekit
• Webtype
• A comparison of Typekit and Webtype
• FontShop
• Fontdeck
• Fontspring
• MyFonts
• Fonts.com Web Fonts
• Google Web Fonts (free)
• Font Squirrel (free)

Typefaces Used and Mentioned

• FF Meta Serif (Typekit)
• FF Tisa (Typekit)
• National
• Trade Gothic
• DIN Next Rounded (alt: FF DIN Round)
• Adobe Garamond (Typekit)
• Skolar (Skolar)
• Proxima Nova (Typekit)
• Chaparral (Typekit)
• Hellenic Wide (Typekit)
• Georgia
• Lucida Sans/Grande
• Titling Gothic
• League Gothic (Typekit)
• Founders Grotesk
• CamingDos (Typekit
• Bauer Bodoni
• Myriad (Typekit)
• Bello (Typekit)
• Le Monde Journal (Typekit)
• Facit
• Mrs Eaves
• Verdana
• FF Milo Serif
• Futura (alternatives)
• Times New Roman (alternatives)
• Gill Sans (alternatives)
• Trade Gothic (alternatives)
• Helvetica (alternatives)
• Museo Sans (Typekit)
• Benton Modern RE
• Minion (Typekit)
• Frutiger

Our Favorite Typefaces of the Moment

• Tiffany: Founders Grotesk, Tiempos
• Jason: Chaparral, Titling Gothic
• Frank: National, Minion
• Stephen: anything from Commercial Type

The most common explanation is that type design is a “technical” profession. This is rubbish. Yes, font production does involve some programming, but, as a whole, doesn’t type design have much more to do with the patience required by classic female handcrafts, like needlework and knitting?

My guess is that the real answer is found in gender-specific socialization, both in general society and in the type design scene itself.

In Germany, women and men are still not treated equally. Young boys are rewarded much earlier in life, and for much less, than most young girls. Being born as a boy — and therefore a son and heir — is for many parents an achievement in itself. They project this sense of worth on their son. Everybody is already proud of him, by default.

As a daughter, you have to prove that you deserve being rewarded. Yet even a concerted effort may not lead to a positive reaction from adults. The girl also isn’t worthy of the same support because she won’t carry the family’s name.

Looking at type design as a working process, you must eventually decide when the typeface is finished. For most designers it’s difficult to find an end and be satisfied with the result. Then you add the expectations of others, amplified by the gender gap. Women constantly think they could do better. It’s never enough, they could get judged, they have to please, etc.

There are many of women who have great type designs tucked away in their drawers. They don’t dare to show them to the public.

The same is with women on the stages of type conferences. For most guys, public speaking is less of a problem. They are used to show off with every little bit they produced, knowing they will get rewarded — and if not, well, it’s no big deal.

I have the impression that this imbalance in our upbringing is stronger in Germany than elsewhere in the Western world. It could be one reason why some great female designers with German or Swiss roots had to get out and become successful abroad.

Another aspect is networking, which is still a male thing, and which women typically aren’t taught. They tend to be solitary fighters, which of course has a negative effect on their careers.

Later, if that career does progress, our social structure simply makes it very difficult for women to combine the time working on a typeface with having a family, given the mother’s traditional role as primary caregiver. You find a lot of over-qualified female designers doing production for type foundries, which gives them a financial security in their beloved profession.

One more sad truth: as a lesser known woman, the (male) type scene just doesn’t take you seriously. You are just a “student” who fancies the cool “boys”. You can sit down and listen to them, but you won’t be asked to give your opinion on “serious” type issues. This attitude may seem prehistoric, but honestly, I’ve heard it often.

The solution? Women should be aware of self-censorship, be less hard on themselves, and continue to maintain a high standard of quality without hiding in their chambers. (And some guys shouldn’t jump on stage at the drop of a hat. These changes alone would enhance the quality of some type events.)

I had to do this too. I pushed myself to give lectures and presentations and face the reaction of other type designers. And now, I like it a lot.

Verena Gerlach was born in Berlin and studied Visual Communication at Kunsthochschule Berlin Weissensee. Shortly after finishing art school in 1998, she founded her own studio (fraugerlach) for graphic design, type design and typography. Gerlach has lectured in type design and typography at designakademie berlin from 2003–2009 and gives lectures and workshops about type- and graphic design all over the globe.

Like Simon Daniels said so prophetically over a year ago, the war (over formats and security and delivery) is over. It’s time to win the peace. Now we’ve got to build some fonts.

Building the fonts is the part of this story that so few anticipated or dared to face. It’s the hard part. So hard, in fact, that some font manufacturers skipped the process altogether, simply releasing their print-optimized fonts as “webfonts” without the significant changes required to make them read well on screen. To me, this is akin to shipping software that is bug-ridden at best. Still, the tech media touts the “thousands” of new fonts now available for web use. Most of what consumers read is about how many fonts you can get and how they are served, but not so much about how they look and read.

Now that the painful reality of poorly hinted fonts is sinking in, web designers are realizing that there is little value in choice alone. In fact, having the choice between thousands of fonts that work only at certain sizes on certain screens isn’t much of a choice at all.

Things will get better. Display pixel density will improve. Windows users will upgrade, replacing GDI with DirectWrite. But this evolution will be slow, and we can’t do much to speed it up.

What we can do is push the evolution of font makers and services. Next time you’re shopping for type, don’t just look for your favorite face as a webfont. Ask for more:

1. Demand fonts that render well for the bulk of all web users, not just those on Mac OS X or Windows 7, but also the poor saps on Windows XP who still represent more than half of the browsing population. High quality releases like Web FontFonts, Fedra Sans Screen, and FacitWeb demonstrate that this can be done.

2. Demand comprehensive previews that show fonts in multiple sizes in all the most common rendering environments: Core Text (OS X), DirectWrite, GDI ClearType, and GDI Standard. Typekit and MyFonts have made valiant efforts here, but the experiences fall a bit short.

3. Demand transparency from webfont providers about the limits of their products. Fonts should be clearly marked when they don’t perform well at certain sizes or in certain operating systems. Webtype and Typekit lead buyers to fonts that work especially well for text. It’s a good first step. FontsLive offers a “minimium recommended size” which would be laudable if it wasn’t so suspect (you can’t even sample their fonts below 20px).

Choosing typefaces for print is fairly clear: you see what you’ll get. Webfont quality, on the other hand, is hidden behind a veil of browsers, operating systems, and end user settings. Yes, there are good webfonts out there, but finding and testing them is a struggle. Font buyers rely on providers more than ever before. Those who provide quality and transparency will lead this new market and medium.

Update: David Březina points out that IE7 switches ClearType on by default. So while there are many Windows XP users out there, most of them have upgraded to IE7 and aren’t seeing non-ClearType rendering in their browser. In this case, ClearType in Win XP would then be the harshest common render mode to test against.

Update, Oct 19, 2011: Since this article was published MyFonts and Fonts.com Web Fonts have joined Typekit in providing screenshots to reveal how their fonts perform in various browser, OS, and (in the case of Fonts.com) render engine environments. I commend these retailers for their transparency.

In early 2004 I was living in Stockholm, one foot in graphic design, the other (and my heart) firmly planted in the world of type. Hours were spent updating Typographica with industry news, typographic sundries, and occasional gripes and whines that, if you’re generous, could be called “critiques”.

Often, those critiques were lofted at FontShop. Erik and Joan Spiekermann’s creation was an institution with an important history, a unique regional franchise concept, and a premium collection of typefaces including their own FontFont library. Yet the brand, a well known and loved leader in Europe, wasn’t nearly as vital in the US.

More visibly, the business was late to the e-commerce party. FontFont.com was sorely in need of an overhaul. FontShop.com, despite an excellent visual refresh by Punchcut, was technically behind the competition. Meanwhile, others were beginning to reap the benefits of blogging and social media. FontShop wasn’t ready.

That was when I got a call from Joan. She invited me to Berlin for a day of brainstorming with Punchcut’s Jared Benson. I gawked at FontShop’s archives, shelves of rare type books and heirlooms of a company whose offices once sat at the foot of the Berlin Wall. We visited Spiekermannpartners where Erik was as charming and brilliant as his talks and interviews. It was there that I first saw a vintage Braun hi-fi and learned about a guy called Dieter Rams. We chatted about typeface specimens and office layouts. I was a kid in a candy store. Cue the Wonka music.

The Berlin trip resulted in a job essentially of my own creation. We tossed ideas on the board and I picked the stuff that suited me. It was my introduction to a hiring philosophy that seems logical but is sadly rare: find people you trust and let them do what they do best.

With the self-appointed title of “Glyph Pusher”, I joined the San Francisco office where I worked with gifted and driven folks to rebuild FontShop.com, revive Font magazine, bring in new foundries, and publish regular newsletters, blogs, and podcasts. I was around for the creation of the last printed FontBook, a pioneering webfont strategy, and FontStruct, the kind of purely creative venture that only a company with FontShop’s culture has the guts and vision to build.

Six years later, FontShop is a global force in design. With a curated type collection and a trusted brand, it’s reasserted itself as the font retailer for creative professionals.

The toughest part of leaving an organization like this one is leaving the people. I’m grateful for the example and support of all FontShop’s brilliant souls, particularly for:

Joan and Erik’s courageous enterprise and their faith in my contribution to it,

Petra Weitz’s kind heart and deft management,

Yves Peters, the original überfontgeek who paved my way,

the classy Jürgen Siebert, my model of marketing,

Jared Benson and Zara Evens’ work that set the tone for our online identity,

Mai-Linh Truong, who generously lent me the keys to FontBook,

Mike Schawel’s drive and motivation,

Jason Chapin’s lifesaving code,

our skillful web developers who coped valiantly with my strange fontish requests while constantly teaching me something new,

Conor Mangat’s design wit and typographic prowess,

Ivo Gabrowitsch’s camaraderie on the other side of the pond,

Ivan Bettger and Theresa dela Cruz’s tireless hours on the thankless job that is customer support,

First Officer Michael Pieracci’s cheery disposition and stellar office orchestration,

and my creative team — Wes Wong, Calliope Gazetas, Chris Hamamoto, and Michelle Nguyen — who all demonstrated a typographic literacy rare among young designers.

I’m proud of our work. Now I’m itching for something new. What’s next is uncertain, but what’s obvious is that Typographica deserves more attention. So, expect that. And something else. I’ll let you know as soon as I know. Rest assured, it will involve type. It’s in my blood.

The intention of creating an entire alphabet from a few shapes is a design challenge — problem solving at its purest. For those with minimalist tendencies, the temptation is to strip away all the decoration and produce a simpler form. With software such as FontStruct and Font Constructor — which allow the user to quickly assemble a font from a set of geometric elements — this approach is now easier and more accessible than ever.

Luckily for those who make a career from type design, the Latin alphabet is not simply a collection of modular elements. A purely geometric solution in a short passage of text, with a certain combination of characters, may work, but once set in several lines of text the faults are much easier to spot. A typeface composed of strict geometric rules can lose subtle details and relationships between white space and stroke widths that have developed over centuries. Quirky characters that look great in isolation can snag the eye when repeated in a block of text.

Attempting to apply exactly the same set of rules to each letter is similar to handing out the same size clothes to a random selection of adults. Some will have excess baggy sleeves, others will be skin tight, and some will barely squeeze over their heads. To solve this problem the pattern has to be adjusted for each character, without losing sight of the overall design. As you make adjustments to the new characters, these changes echo back through the letterforms already designed. For example, if you started drawing a font created from a simple set of circles and lines, this may work perfectly for ‘a’, ‘b’, ‘c’, ‘d’, ‘e’, but then throw in a ‘v’ or ‘z’, or even an ‘s’, and you meet a dilemma. Should the letter be squeezed into the current template or adjust the template for the new letters? It’s best to start with a group frequently used within the English language such as ‘a’, ‘d’, ‘e’, ‘i’, ‘n’, ‘p’ and ‘s’, and later try diagonals such as a ‘v’ or ‘x’ to test the design.

This is not an argument against all geometric or modular typefaces, but simply some guidance on how to make them more readable, work effectively and be visually consistent.

Balance

This is an example of a typeface created some years ago, based on a very strict grid of squares and circles. Many characters look quite presentable, but these few look particularly top heavy. Both counters of the ‘8’ are identical in size, but optically the top looks bigger. The ‘5’ has a squared-off counter on the top half, which creates larger area of white space than the bottom — making it look ridiculously unstable.

Widths

By cutting and pasting modular elements it’s common to make many characters the same width, but this creates widely different white spaces inside each character. Take the ‘b’ and ‘h’ for example — the squared-off counter of the h makes it appear much larger than the ‘b’s.

The Joins

At the point where two strokes meet or cross each other, the join is liable to “clog up”. A typical example above, shows a circle attached to a vertical line to create a ‘b’. A heavy area appears where the curve tries to pull away from the straight. By trimming a little from the inside, it pushes the curve down in the right direction.

The ‘S’

The ‘S’ is a difficult character to get right, it relies on a careful balance of two open counters both horizontally and vertically. The classic “cut and shut” technique of pushing two semi-circles together leaves a tell-tale kink in the middle. This meeting point has to carefully smoothed out to give the impression of one long stroke.

Stroke Widths

The horizontal and vertical strokes should not be the same thickness. If they are, the horizontal strokes will look heavier. An example above shows how a visually monolinear typeface such as Futura, has subtle adjustments to the horizontal strokes to make them appear even.

Overshoot

Unfortunately, lining up straight and curved edges using guidelines does not work. In the above example, the circle is the same height as the two squares, but appears to be significantly smaller. To compensate for this optical illusion, the curve needs to increase in size so it seems level with the horizontal lines.

Spacing

Spacing can be a huge challenge to those new to type design, and only gets easier with practice. The example above shows rounded and straight shapes, all equally spaced apart. However, the two squares appear much closer than the two rounded shapes. By adding extra space to the straight edges and less to the curved shapes a good balance can eventually be achieved.

These examples are only an outline of the issues you will face when designing type, but will draw your attention to the most common mistakes. A strict set of rules at the beginning can produce some very interesting ideas, but they need to be flexible. This will not only to make your type work better, but will help differentiate yours from the others being churned out every day. The simplest rule to remember is: trust your eye more than the grid.

Ian Moore works as a full-time graphic designer and in his spare time as a type designer for The Colour Grey. This is an updated version of an article originally posted on Design Assembly. It’s been re-edited and expanded for Typographica.

Panelists
• Moderator: Kent Lew type designer, SOTA Board Member
• Ted Harrison, FontLab type design software vendor
• Bill Davis, Ascender (font vendor)
• David DeWitt, Monotype Imaging (font vendor)
• Christopher Slye, Adobe type designer
• Shu Lai, ShuDesign web designer
• Ivo Gabrowitsch, FontFont font vendor
• John Hudson, Tiro Typeworks type designer
• Bryan Mason, Typekit web font service provider
• Garrick Van Buren, Kernest web font service provider
• Frank J. Martinez, Esq. copyright attorney

Maybe we should have cut the 30 seconds of relaxed jazz at the beginning, but I find it an amusing counterpoint to the urgency and heat of the discussion. It beats the more obvious “Ride of the Valkyries”.

You can also have a look at Typographica’s Twitter stream which I filled with a play-by-play and a bit of commentary from the event. Anyone got a script that will take a selection of Tweets and post it reverse order for posterity?