Typography Spacing Research

by jashmenn • 14 years ago

109 22 14 years ago

exolxe• 14 years ago

Wow, this is pretty intense. I'm a designer, but even for me it's almost too dense. Would be really if there was a cheat sheet with the main takeaways.

evoxed• 14 years ago

Interesting. I haven't attended TypeCon in a couple of years but last time I went algorithmic kerning was a fairly hot topic amongst event-goers and some of the people giving talks. Machine kerning is still sort of looked down upon as far as I can tell (in the design world) but as a practical tool it's great that people are working on it and it has certainly improved many times over.

It looks like a great article and I'm looking forward to going over it fully to see if there's anything really new but overall it looks quite clear and covers at least a few things that I've tried (maybe less than successfully) to describe to others.

aston• 14 years ago

The tl;dr of this article is that the author summarizes some really interesting leads on automated letter spacing, but so far hasn't come up with a winner. There are a number of loose ends in there that might be interesting for others to pick up and run with since he's made much of his code available.

Most promising to me is the concept of bubble kerning, which not only appears to work in the limited testing the author does here, but also meshes with my intuition about how to space letters.

dfc4• 14 years ago

His Crimson Text font is very attraactive:

http://aldusleaf.org/crimson.php#download

_fn• 14 years ago

Google WebFonts serves his font here: http://www.google.com/webfonts/specimen/Crimson+Text

I've been using it on my blog for a while.

crazygringo• 14 years ago

Wow, what a beautiful site, and beautiful typeface (reminds me a great deal of Minion, which was chosen to set The Elements of Typographic Style).

And an absolutely fascinating investigation. It's almost like the famous quote of not being able to define something (pornography), but knowing it when you see it. [1]

Typography, with its rhythms, is almost the purest example of this. It's so easy for a good designer to kern, set linespacing, etc. until it "looks right" to your eye. But I wouldn't even know where to begin to try to translate this into an algorithm -- because it's not just about spacing between letters, but having that spacing be harmonious as well with the structures within letters (like the horizontal rhythm of an "m").

I personally suspect it's something close to trying to equalize the "area" between adjacent letterforms, but the problem is that depending on angles, case, etc. that "area" is a "blob" we feel, not an easy calculation. I wouldn't be suprised if the best approximation involves some kind of fuzzy-bitmap blobs, rather than any hard of hard exact calculations.

I look forward to reading more research results!

[1] http://en.wikipedia.org/wiki/I_know_it_when_I_see_it

dfc4• 14 years ago

The "famous quote" is about obscenity, not pornography.

CrankyPants2• 14 years ago

The most famous opinion from Jacobellis, however, was Justice Potter Stewart's concurrence, holding that the Constitution protected all obscenity except "hard-core pornography." Stewart wrote, "I shall not today attempt further to define the kinds of material I understand to be embraced within that shorthand description; and perhaps I could never succeed in intelligibly doing so. But I know it when I see it, and the motion picture involved in this case is not that."

verroq• 14 years ago

Am I the only that thinks "Wow people actually give a shit about this?". It seems comical how much people are willing tolerate this typographical circle jerk disguised as "designing".

I for one, cannot take this guy seriously when the title of his post isn't even antialiased (funnily enough with no kerning present). Or when he commits binary and swapfiles into his git repository.

dfc4• 14 years ago

"Am I the only that thinks "Wow people actually give a shit about this?". It seems comical how much people are willing tolerate this typographical circle jerk disguised as "designing"."

A lot of people care about the finer points of typography. If you really want to see some "circle jerking disguised as designing" take a look at a book by this nutjob named Donald Knuth:

Digital Typography by Donald E. Knuth (Stanford, California: Center for the Study of Language and Information, 1999)

"Or when he commits binary and swapfiles into his git repository."

Committing binary files is such an atrocious act. I for one am glad that github does not condone such immoral acts by showing the difference between images.

martinced• 14 years ago

By your logic we'd still all be reading books as they were typeset hundreds years ago (hint: they're pretty dense and definitely not convenient to read) and we'd all be driving while trying to decipher poorly typeset roadsigns (which is very, very dangerous).

All it takes is a few researchers to actually care, research, blog, write papers about the subject and then we all benefit from that research.

Regarding the goold old "eat your own dog food" logical fallacy... By your logic, an engineer should not be allowed to do research, say, on electrical cars if he isn't himself driving an electric car. Sounds pretty extreme to me ; )

idan• 14 years ago

A fantastic deep-dive. If you want to know just how deep you can take the craft of presenting beautiful type, this is a great example.

mh-• 14 years ago

Misspelled letters within the first twenty words of an otherwise-excellent article about letterfitting. :)

lucb1e• 14 years ago

Am I the only one where the typeface on the site bugs? Or perhaps it's supposed to look like this, but it's really hard to read. Windows 7 with Chrome, no uncommon setup.

Is's really ironic how most typography blogs have this problem. Same problem occurs on Linux too by the way, which I run on my desktop (this is a laptop). No localized issue.

anonymouz• 14 years ago

I also find it hard to read (on Firefox in Linux). For example in "snugly should" in the first paragraph the space between "s" and "n"/"h" seems way too big. In general, the spacing varies wildly and the text looks very uneven. Not sure what causes this and if it's supposed to look like this though.

hayksaakian• 14 years ago

Sidebar renders poorly on my nexus 7.

http://www.imgur.com/1z5Vv.png

The math was quite interesting though.

tambourine_man• 14 years ago

Fixed positioning + allowing zoom is not a good idea.

emanuer• 14 years ago

Considering that humans are the judge of what constitutes as a well spaced font, one should look at the workings of the human brain. It turnes out we already know the algorithm employed by the visual cortex for edge detection, the _Gabor filter_ http://authors.library.caltech.edu/2653/1/MALjosaa90.pdf

Also Wikipedia has a fantastic overview for the Gabor filter: http://en.wikipedia.org/wiki/Gabor_filter

Of the approaches mentioned in the original article, "wavelet" masks, are the ones closest to the calculation done in the V1. A quick search on http://scholar.google.com for "Gabor space visual cortex" uncovers that much research was dedicated to this topic.

Crake• 14 years ago

This was really interesting! It's great to see someone taking a quantitative approach to design. Art schools would never teach an algorithmic approach to kerning, but for the programmers/artists who are smart enough to learn it, a breakthrough permitting effective use of this approach would be invaluable.

Typography Spacing Research

Related Stories