Slashdot Mirror
The Math of Text Readability
An anonymous reader writes "Wired magazine has an article that explains The Law of Optical Volumes, a formula for spacing the letters on a printed page that results in maximum readability. Wired's new logo (did anyone notice?) obeys the law. Unfortunately, Web fonts don't allow custom kerning pairs, so you can't work the same magic online as in print. Could this be why some people still prefer newspapers and magazines to the Web?"
True, PDF documents have kerning in them, but the hinting used to display glyphs in PDF documents on a 70 to 120 DPI screen without blurring the crap out of the glyphs distorts the spacing balance.
Having all the typefaces look *exactly* right is one of those things that only printers really care about. Don't get me wrong, it's worth the trouble, for the *printed page*.
But on the web? I don't think anyone would really notice or care that much. Plus, it'd be hard to achieve, since you can't rely on all machines rendering fonts at the same resolution, and you can't rely on fonts actually being present on all machines, and you can't rely on all the *versions* of a typeface actually being the same across different platforms. None of this is news. The web was designed to sort-of deal with these problems. Or at least, ignore them.
Someday, when we're all running ultra-high-res displays, and someone releases a shitload of completey free (as in beer and freedom), high-quality fonts (I think this is the biggest issue, personally), then we'll all see the same nice fonts on our computers.
"When the atomic bomb goes off there's devastation...but when the atomic bong goes off there's celebraaaaation!"
The concept of WIRED magazine and its associated web site being interested in readability seems ludicrous.
Consider their track record of using tiny type, garish color schemes, and layouts that I find difficult to characterize, making it nearly impossible for anyone with any of a number of (even slight) impairments to their eyesight (including especially presbyopia - the lack of accommodation that accompanies middle age) to read their publications comfortably - or even at all.
I've often thought that this was done deliberately, to repell all but young readers, as part of targeting their circulation on the perceived avant-garde youth of gen-Y and beyond.
Now they're modifying their logo for readability. ORLY? Is their target demographic aging enough that this is now a problem? Are readers deserting them due to headaches just as they graduate into serious spending money? Or are they just playing around with another art/layout fad?
If they were really serious about readability I'd expect them to be modifying other aspects of their magazine and site layout. But TFA shows that is not happening. So I'll go with "fad".
Bantam Dominique roosters crow a four-note song. Once you've heard it as "Happy BIRTHday" you can't NOT hear it that way
The main reason why it is much harder to produce a good looking font on a screen is due to the low dpi factor of screens. In print, you can get a much higher dpi and as such some fonts like Times look great. But on the screen they look like crap because the screen only has so much resolution. You can play a few tricks with current lcd technology and anti-aliasing but compare it to anything in print and there's no comparison.
I certainly wouldn't mind higher resolution displays to display crisper fonts. And no, I'm not talking about running Windows at 3200x2400 so I can fit 4 1600x1200 browser windows on the screen, but rather so that my 10pt font looks much sharper. Then, maybe then I wouldn't have to read a blurry pdf on the screen or be forced to zoom in so the fonts render clearer.
That law can't be right, because it would mean that the correct kerning wouldn't depend on the letters at all. Give each letter a nominal bounding box, and use this box for spacing. The "before" area is the area between the letter and the left edge; the "after" area is on the right. The area between two letters is the total of the first one's "after" area and the second one's "before" area. If you want the area to be a particular constant, adjust all the left edges so that all of the letters have half that constant as their "before" areas, and adjust the right edges so all the letters also have half that constant as their "after" areas. Obviously, then, all of the spacing is perfect by the law, regardless of the letters involved. (Okay, so I'm ignoring different heights of adjacent space; there's more height in the area in "ll" than "mm", but that translates to constant space removals between adjacent right and left ascenders or descenders.)
But correct kerning depends on the letter pairs, with some examples mattering a lot, and some being less important. So this law, as stated, is clearly wrong. Correct kerning takes into account the fact that "AV" has room to overlap vertically, while "VV" and "AA" don't, so the particular shapes actually matter. Any possible good rule has to be non-linear to account for this, and certainly trickier than the rule given. I suspect that there isn't a good rule known (other than "get sombody with a good eye to adjust it"), or fonts would just have a "crowdedness" parameter, and the rendering engine would use the rule and the parameter to generate ideal kernings for all pairs of characters on the fly.
I think you miss the point of this HTML thing. It's a markup language, not a display language. For that we have PDF and Display Postscript. I don't want that much font controll in the language because your exacting layout isn't going to work on my 320*240 (or smaller) portable display anyways.
There are 4 boxes to use in the defense of liberty: soap, ballot, jury, ammo. Use in that order. Starting now.
White space, fonts and text density are minor concerns to me (intense reader for decades). Computers are fine for relaxed reads, but for long texts, the medium's just wrong: I prefer paper books.
... intense focus and keeping my circulation moving ... and so I find PDF manuals distasteful. Books: Grab, flip open, crawl inside... quickly, wherever. Maybe it's long habit, but considering the e-book flop, I 'spect I'm part of a majority.
Computers breaks my study habits
"You must try to forget all you have learned. You must begin to dream." -- Sherwood Anderson
The space between letters on my screen generally has a lot of anti-alias grey pixels, and even subpixel-rendering-derived colored pixels, in it. It's not empty.
One approach would be to apply this sort of kerning logic to a font in a completely analog way (like one would in print), assuming an infinite-resolution display, and then use antialiasing and subpixel-level antialiasing to squeeze more resolution out of the screen.
Nonetheless, text looks better when lines fall evenly on a pixel boundary -- if a line is one pixel wide, for instance, I'd rather have column 10 illuminated fully than a mix of columns 10 and 11 dictated by the kerning algorithm and provided by the antialiasing code.
Zelaous application of the kerning rules would result in nearly all characters falling halfway between two pixels. Antialiasing makes diagonal lines look smooth, and it's wonderful for that, but I don't want all my text looking like it's displayed on an LCD at non-native resolution.
Interestingly, The GIMP has two modes for its text tool -- one that makes some compromises on "the exact shape and spacing dictated by the font" in order to *improve* readability once you quantize distance by sticking the characters in pixels. I find this mode is far more readable for small characters than the one that doesn't.
Have you noticed that Wired's 'NEW' logo uses an almost monospaced font (ie: the kind used on old manual typewriters aka 'Courier' - where every character was the same width, hence the lowercase i with very large serifs to take up the space effectively)? Only the W is of a different width, but they've balanced it by using a slab-serif I and then balanced the useage of that amongst the sans-serif face by also including a slab-serif E so that it doesn't stand out in your subconcious. Such is the way of kerning... it's not mathematical at all, it's all in the 'feeling'. It's a purely aesthetic exercise and as has been quite rightly pointed out in the comments, a font that is perfectly kerned at 12pt becomes odd-looking when scaled up to a display size (even scaling to something like 120pt would show it) - hence some type families including a 'display' version specifically kerned for use at larger sizes. Typography... it's all in the whitespace y'know ;)
I think you miss the point of this CSS thing. It's a style defining syntax, not a markup language. It exists to put a Style - you know, the "middle S" - on top of a generic markup language. Your tiny device should a) treat styles in a way appropriate for its capabilities, or b) suck it.
Now, if people would just use HTML as intended, and use CSS as intended, my tiny little devices can ignore the web browser CSS and render the HTML in a way appropriate for their screens. Some people will know aobut tiny little devices, and will design CSS to help make things readable on tiny little devices, because they care about such things. I'll turn that crap off, because I think web designers with a print graphics background should not be allowed near my computer. And we'll all be happy, because separating content from presentation is a good thing.
...is that nobody seems to care about margins.
In so many websites (and yeah, Slashdot, I'm lookin' at you) every square inch of screen space seems to be cram-jam full of content, pictures, navigation menus, adds, sidebars, logos...
Stop. Please... just stop.
150 Opening BINARY mode data connection for slashdot.sig (129323052 bytes).
There ARE PDFs.
Yes, I want to be picky.
The key is to not define the size of the margin but the size of the block of text. Readability is dependent on the relationship between the width of the block of text and the vertical spacing between lines. Wider lines need wider gaps to keep your eyes from getting lost on "carriage returns." (of course there are other aspects as well, but this is big until your lines get absurdly wide)
The point of the article is that current fonts don't have enough kerning, not thar there is none at all.
Good lord, you must be kidding! The one thing I do fault MS for, and the reason I used to avoid their systems if at all possible and now do again is precisely because they don't know the first thing about fonts and typesetting.
When a formatted multi-page document changes layout merely because you print to a different printer, even within the same brand (HP III to HP II for instance) it indicates serious problems with how you're handling fonts and layouts. Yes a pure text document will change layout under certain circumstances under windows with an application that handles fonts, like, say, Word.
This is extremely annoying when you're creating a document for publishing on blue-line paper.
The cesspool just got a check and balance.
You seem to be using non breaking spaces for a purpose different from its intended one. Non-breaking spaces are designed to be used—well...—when you want to disallow a line break at a space, in situations like "A. U. Thor" or to keep words together where it'd be awkward to have them separated—a good typographer will not let a short word like 'a' be left alone at the end of a line but join it with a non-breaking space to the word following it, for example.
You probably want U+2001 EM QUAD and friends.