Slashdot is powered by your submissions, so send in your scoop

 



Forgot your password?
typodupeerror
×

The Math of Text Readability 282

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?"
This discussion has been archived. No new comments can be posted.

The Math of Text Readability

Comments Filter:
  • Web Volumes??? (Score:2, Informative)

    by Slugster ( 635830 ) on Thursday April 19, 2007 @07:15PM (#18806033)
    Well there IS pdf's, if you wanna be that picky......
    ~
  • by Temeraire ( 913731 ) on Thursday April 19, 2007 @07:33PM (#18806239)
    I have actually written software to kern text (for the sign-making industry) and can testify that kerning is not an exact science. Yes, one needs to even up the areas of white space between letter, but then one needs to bias the calculations in favour of the tops of the letters. And then make some allowance for any white space inside the letters, and .... and .... and ..... Spacing that is correct for 12-point type on paper would be quite wrong for a huge 3D sign on the side of a building, and so on.
          For perfection, there is no substitute for the human eye. The algorithms used by our brains to unscramble text are very complex.
  • by rh2600 ( 530311 ) on Thursday April 19, 2007 @08:07PM (#18806537) Homepage
    Web fonts don't have custom kerning pairs

    Whilst true, this is a bit misguided.

    First things first - web fonts, and print fonts are the same. Fonts are fonts. Some are better than others and include more default kerning pairs than others. But rest assured, Georgia, Arial etc have got kerning pairs (for print and screen) and hinting information (for screen).

    Type rendering engines *do* support kerning pairs, that the typographer who designed the font decided to create and embed in the font file. There are a bunch of patterns that are used to expose badly spaced pairs that typographers use when checking these spaces and fixing them.

    Custom kerning for print is actually font independent and is done in the print design app of choice. Print design uses these same font files and their kerning pairs, and print designers won't custom kern large blocks of text, unless of course they want to spend 3 days per page of content. Print designers do often kern large headings and logotypes where any subtle problems are (literally) magnified and are obvious to the reader. Online designers do this in a number of ways, but typically resort to using an image (because the logotype font isn't likely to be on the end users computer anyway). CSS does give you the ability to create custom kerning pairs if you would want it, through a mixture of text-indents, spans and margins but its not very clean.

    So the author if this piece is correct, but a little misguided and not being particularly fair on "the web". ;)
  • Re:It's Maths (Score:3, Informative)

    by geekoid ( 135745 ) <dadinportlandNO@SPAMyahoo.com> on Thursday April 19, 2007 @08:13PM (#18806587) Homepage Journal
    No,its Math.
    Deal.
    oh wait, this contradicts me:

    http://dictionary.reference.com/browse/math [reference.com]

    wait, no it doesn't.
  • FWIW (Score:3, Informative)

    by Dausha ( 546002 ) on Thursday April 19, 2007 @08:15PM (#18806609) Homepage
    http://webtypography.net/ [webtypography.net] This link goes to a way of implementing Elements of Typology online; which is supposed to improve readability. Its interesting in that it sort of goes against the common idea with screen size and web text. The common idea, as I understand it, is that we should not worry about the 800X600 and use as much screen real estate as possible. Then, text columns can stretch as wide as my 19" monitor will let them. The problem is, that works against readability. The "optimal" is about 4.5". I use 37em for text body width, and that seems to work.
  • by Anonymous Brave Guy ( 457657 ) on Thursday April 19, 2007 @08:17PM (#18806627)

    If you're referring to METAFONT-style fonts, then there is some supplementary information you can encode in the font file to indicate kerning between specific pairs, and also some moderately flexible ligature support. It's nowhere near as powerful as what you can do with Opentype, but suffices for reasonable quality when setting Roman alphabet languages. It can also be adapted, if you try hard enough, to support more complicated scripts like Devanagari. The nastiest limitations for that sort of work usually involved the number 256, IIRC.

    The TeX engine itself does some spacing work as well, but more in the areas of punctuation and whitespace for justification than inter-letter spacing. (This is why you have to be careful when using a . character as something other than a full stop, if you want typographically correct results.) If you want something interesting built on top of TeX, look up Han The Thanh's thesis on microtypography and have a play with PDF(La)TeX.

  • Re:latex (Score:4, Informative)

    by Anonymous Brave Guy ( 457657 ) on Thursday April 19, 2007 @08:31PM (#18806751)

    The irony, of course, is that the latest versions of Windows support Opentype pretty comprehensively, the latest fonts from MS support some Opentype features, pretty much all of the serious, commercial, professional-grade fonts you can buy these days come as Opentype (at least from sources like Adobe), Opentype features are far more powerful than anything in the TeX/METAFONT world, yet Microsoft were too busy revamping their UI again to add support for these features in Word 2007. So much for BillG's claims about readability on the screen being important.

  • Re:Um, no. (Score:2, Informative)

    by porpnorber ( 851345 ) on Thursday April 19, 2007 @09:00PM (#18806995)
    The thing I find amazing about this discussion is that the Slashdot audience, often (in part if not in whole) so well-informed, appears here so utterly ignorant. Folks, to take a random example, twenty years ago I used to subscribe to a journal called Visible Language. Google tells me that it's still there, at http://www.id.iit.edu/visiblelanguage [iit.edu] . It's far from the only source on such information. Yes, there is a research community on these topics. The research has been done. It was done, for print, centuries ago; it was done, for the screen, decades ago. It is something that matters, sure, to nerds as to anyone who reads. But how quite does it get to be news, now? Because someone at Wired recently half-remembered what he learned in a typography class at school?

    So ja, sure, 'equal areas' is just an informal approximation, it's what you remember of the idea, informally, once your school days (or whatever other days they were when you read up on typography) are somewhere in the distant past. It doesn't mean there's no theory to it; it doesn't mean there's no well-researched and well-documented theory of it. It just means that it's one of those, OMG, pre-Internet topics that's tricky to Google for, and nobody, either here or at Wired, dropped by their local library recently to check it out in detail. Or, equally possibly, that it didn't seem worth the effort to explain in more depth when the purpose of tfa was, frankly, just to be cute.

    As to why our on-screen typography pays little attention to such well-known ideas, I somehow suspect it's a combination of the cowboy programmer syndrome so pandemic in web technology and the distinct possibility that some corporate baboon somewhere has a patent-lock on 'text that doesn't look like crap'....
  • by twistedcubic ( 577194 ) on Thursday April 19, 2007 @09:14PM (#18807095)
    This probably isn't the reason, but in math, the general term used for the capacity of an object, regardless of its dimension, is "volume". And so "length" refers to the volume of a 1-dimensional object, and "area" refers to the volume of a 2-D object.
  • by OECD ( 639690 ) on Thursday April 19, 2007 @09:54PM (#18807449) Journal

    I'm just running an incredibly modern-futuristic computer here, but my computer arranges letter closer together and further apart depending on their shapes... is that different from 'kerning'?

    Related, but more different than not.

    There are monospaced fonts, where each letter takes up the same amount of space regardless of shape, so xxx and iii are the same width. Then there are proportional fonts, where the letters are as wide as the rectangle it takes to contain them, so xxx is much wider than iii. This is what you're thinking of.

    Kerning takes it a step further. A proportional font that doesn't have some kind of hinting (and a program that can read/implement that) will still put too much space between the letters VA, while one that does will allow the V and A to 'invade' each other's rectangle. It can get quite complex with all the different glyphs (letterforms) that have to work with each other.

    I'm mystified as to who would say computers can't do this, since I use them to do exactly that every day. It really has more to do with the fonts and applications (and possibly the OS) you are using.

  • Too simplistic (Score:4, Informative)

    by WillAdams ( 45638 ) on Thursday April 19, 2007 @10:16PM (#18807611) Homepage
    As David Kindersley's experiments have shown, it's more about the interplay of light and dark as perceived by the human eye than mere physical measurements.

    See his _Optical Letter Spacing For new printing systems_ for a more detailed system and account --- but as Dr. Charles Bigelow has stated, no system fully accounts for all subtleties of all designs and the perceptions of the human eye. Co-designer of the Lucida superfamily, and having worked out the spacing system used for the Optima capitals sandblasted into Maya Lin's Vietnam Veterans' Memorial and newly placed as a profesor at RIT he's well-worth pying attention to.

    William
  • by Ranger ( 1783 ) on Thursday April 19, 2007 @10:38PM (#18807793) Homepage

    ...is that nobody seems to care about margins.

    I agree. Whitespace is very important. I prefer to have decent margins and padding when I create web pages and I tend to use san-serif fonts for readablity. Also fixed-width is very important too. It's harder to read wide columns. Another good place to start is A List Apart [alistapart.com], but there are other good resources as well.

  • by LBArrettAnderson ( 655246 ) on Friday April 20, 2007 @12:33AM (#18808583)
    AAAAAAAAAA
    VVVVVVVVVV
    VAVAVAVAVA

    no it doesn't. It looks like it might when you just look at the two letters together... but it's just an illusion. (see above example).
  • Probably a bad idea. (Score:2, Informative)

    by hedora ( 864583 ) on Friday April 20, 2007 @12:47AM (#18808667)
    Personally, I'd be upset if web designers had precise control over font rendering. I've overridden Firefox's default fonts with ones that I prefer, and regularly use ctrl + and ctrl - to adjust font sizes. It's better to have a fluid, customizable presentation layer for on-screen reading. Otherwise, we'd probably be using PDF instead of HTML.

    Also, I feel like we already have plenty of free (freedom) fonts, and high quality renderers; kerning for desktop computers was solved in the 80's. (Antialiasing was huge and recent though.) Anyway, I'd like a 300 dpi display, and resolution independent rendering will make them practical. Today's models have the resolution of a dot matrix printer in draft mode... No mater how good the font renderer, it's going to look lousy compared to a modern printer or a book.
  • If you want OpenType goodness in LaTeX, use XeTeX. Apparently it's in Debian/Sid[*] now that Etch has been released, via TeXLive 2007; I've been using it manually compiled against TeXLive 2005 for some time now. It has far and away the best OpenType font support I've seen on anything running on GNU/Linux; it's somewhat at the level of Mac OS X's stuff (except it uses backslashes instead of mice and OpenType instead of AAT or ATSUI or whatever Apple calls their font format).

    [*]: (Of course, you can run it on other operating systems; it's developed for Mac OS X so you can get binaries from the developer, and other distros may or may not include TeXLive 2007 now that teTeX is being phased out.)

    Of course, if you use XeTeX it means you don't get pdfTeX's microtypography thing. So we come back full circle: I want something that does both! (Apparently the working version of pdfTeX, called luaTeX, is meant to add OpenType font support to pdfTeX (eventually), but because it'll be done in a completely different way from XeTeX, whether special font features will be supported automatically is a different matter.)

    Oh, also, you're getting it backwards. LaTeX sits on top of XeTeX and pdfTeX, not the other way around. XeTeX and pdfTeX can do wonderous things with or without LaTeX as plain (pdf|Xe)TeX or (pdf|Xe)ConTeXt. LaTeX needs an update so that modern packages can do modern things.

    Gosh! Confusing.
  • by Anonymous Coward on Friday April 20, 2007 @03:08AM (#18809183)
    Dude..
    VA
    Highlight one and look at the other.. unless you're drunk (like me) :P

    If you're using lynx you're SOL :P Maybe?
  • by Pieroxy ( 222434 ) on Friday April 20, 2007 @03:59AM (#18809355) Homepage
    The parent's point is that a line of 10 Vs is as wide as a line of 10 As. So if a line of 5 "VA" is as wide, it basically means they don't invade each other. Do you mean to say those three lines are not the same width on your system ?

    Then it just means one thing: You might look at two different fonts... Because your systems (OS, Browser) might just be different...
  • Geeks not nerds? (Score:3, Informative)

    by Duggeek ( 1015705 ) on Friday April 20, 2007 @11:26AM (#18812149) Homepage Journal

    I'd use mod points, but I'm a designer (Web and print) and this has to be set straight. Besides, who on /. actually reads TFA to comprehend these posts?

    Waa-aay back on the early printing presses, characters were steel/pewter “shots” and held together with molten lead. The shots were lead-alloy and would break-away from melting the pure lead once the print-run was complete.

    The letters each occupied a rectangular space, since the shots were forged from rectangular molds. When the shots were fitted together on a line, they would have a specific amount of space between them which was largely based on their overall size. (the shots were three-dimensional, and therefore, actually had volume)

    For the common, body-text type, the rectangular spaces (proportional to a letter's width) were enough to make the type readable. However, with larger type in the masthead, headline or other large type, the space between letters could sometimes lead to a confusing appearance. The larger letters were often made of wood, not metal, so the spaces would be cut-away near the corners. The notches that resulted made the angular letters (e.g., like ‘VA’ or ‘WAY”) fit-together more closely, and yet would not lose any space when placed next to letters that occupy the full rectangle. (such as with ‘AMV’, ‘MAN’, or ‘OMG’)

    Since only the corners of certain letters were trimmed-away, it came to be known as “cornering”, which in-time became the vernacular we know today, kerning. Presumably, some Northern European dialect gives us the word we now use.

    So many people confuse kerning with a system called tracking and think the two are one and the same... NOT so! While each is a name for a system to determine the visible space between letters, they do it in fully different ways. In a nutshell, tracking [wikipedia.org] applies to a full typeface and is applied to all text at the same time. (as if to increase/decrease the size of the letter-shots themselves) Whereas kerning [wikipedia.org] only applies to the space between two, specific letters.

    In that light, you may have already guessed that kerning is not widely used with body-text (like the text you're reading now) and tracking is used instead. For instance, the next time you read a fully-justified column, (aligned both left and right sides) notice how some lines appear “stretched” or “compressed” when compared to others. Tracking is the mechanism for making justified text.

    Where you'll find kerning most often is in mastheads, corporate logos, and occasionally in article headlines. Working with only two letters at a time is a tedious process, so it's generally reserved for when fewer letters are displayed at a larger size.

    The very logo for Slashdot (top of this page) is a fair example of kerning; the letters are almost touching, but the same effect can not be done so precisely by simply adjusting the tracking of the same text. (even the slogan, “NEWS FOR NERDS, STUFF THAT MATTERS” is kerned just a bit)

    What amuses me the most in this thread is the number of people claiming they can compare the effects of tracking or kerning from one poster to the next. Are you all using the exact-same font on your browser? (Slashdot posts appear in the default font for your browser--go ahead, test it!)

    With the obvious variety of platforms represented here, I'd safely say “no”. Unless you're in the same room, looking at the same PC monitor, you can't make any comparisons. While the page reads the same, I'm sure it appears just-a-bit-different on my screen than it does on yours. There's no proof there.

    Besides “Optical Volumes” does sound just a bit cooler than “Optical Areas”.

One man's constant is another man's variable. -- A.J. Perlis

Working...