4 ms·
He has a point that many interface designers will appreciate and others rankle at as nit-picking. But I was struck by the irony of this particular observation
by inopinatus 13y ago
He has a point that many interface designers will appreciate and others rankle at as nit-picking.
But I was struck by the irony of this particular observation being made via a blog that uses a body typeface with ever-so-slightly but definitely too-narrow tracking (letter spacing). Or maybe the kerning data is off. I would have it loosening by about 1/200em overall, with the most noticeable improvement becoming apparent on adjacent vertical strokes.
EDIT: the samples of this face, "Oxygen", that I see at the creator's site (Vernon Adams) don't suffer from the same issue so perhaps something has gone awry in the conversion to WOFF.
- eridius 13y agoI noticed the exact same thing. It was rather annoying. For example, in the word "like" (as in "And here's what it would look like fixed") the "li" had joined into a single shape.
- austenallred 13y agoTo be fair, the number of users that read his blog vs. the number of users that use Facebook is a little bit different, and the amount of attention that should be devoted to each should vary accordingly.
- minimaxir 13y ago"His blog" is the template for the entire Posthaven network.
- deleted 13y ago[deleted]
- garry 13y agoThanks for the feedback! I'll look into this. I'd been wondering about that myself.
- alanh 13y agoYes, and his blog’s title uses an ASCII straight quote in lieu of an actual apostrophe. Before that, Posterous’ default template had tiny, light grey, non-subpixel-antialiased text for body copy. It was excruciatingly hard to read. I never understood that; the point of a blog is to making reading and writing easy, but Posterous only ever cared about the “writing” side of that, it seemed. (This point is further illustrated by the obnoxious headers Posterous blogs had. By far the most visually noisy part of a Posterous post page was the call-to-action at the top: Sign up for Posterous, yourself!) Actually, Garry, I’m pretty curious about this. What was the reasoning behind that small grey body text? I’m sure I am just being naïve here. Please enlighten me.
- arnorhs 13y agoThe real irony lies in the fact that Facebook has these "issues" and it doesn't stop them from raking in millions of users, but the perfect (well, almost) typography of Posthaven's site does not seem to be helping (I am aware of the unfair comparison). Perfect typography does not dictate the success of your product.
- ollysb 13y agoI've never found a way to fine tune the letter-spacing using css, the smallest unit seems to be 0.07em which is usually too much. Would love to know how to do it if it's possible.
- alptrv 13y agotext-rendering: optimizeLegibility; may help in some cases
- leephillips 13y agoIs this safe to use now? If I recall correctly this crashed some browsers not too long ago, and could cause some extreme rendering glitches, such as text disappearing.
- alptrv 13y agoUhm, didn't know about that it never happened to me
- eclipticplane 13y agoUsually you don't want to change letter spacing. It should be part of the font itself. By changing it via CSS letter-spacing, you alter the font's built-in spacing. This is particularly noticeable with letter combinations with very tight kerning, like 'AV' or 'WA' or 'li li' or 'ni in'. While most web fonts do not have the vast kerning tables that a professional typeset font will have, the built-in kerning is usually leagues above what you can accomplish with letter-spacing.
- anotherbadlogin 13y agoNot to mention that the selected font has no crossbars on the capital I. Such fonts should be avoided, always and everywhere. It's stupid not to distinguish between a capital I and lower-case L.