The Elements of Typographic Style Applied to the Web
“For too long typographic style and its accompanying attention to detail have been overlooked by website designers, particularly in body copy. In years gone by this could have been put down to the technology, but now the web has caught up. The advent of much improved browsers, text rendering and high resolution screens, combine to negate technology as an excuse.”
Richard Rutter begins a project long overdue: bringing typographic standards from the print world, to the web.
Christian Palino is a designer and educator living in San Francisco. After years of consulting with IDEO and Adaptive Path for clients ranging from the Department of Health and Human Services to Bonnaroo, he's now the Director of Design at OpenTable. Christian currently teaches Interaction Design at CCA and has previously taught at IUAV University of Venice, Domus Academy, and the Interaction Design Institute Ivrea.
Is this being done with Bringhurst’s permission, and/or the publishers’? The project sounds like a neat idea.
As far as I can see, there isn’t much text republished from Bringhurst’s book. It’s mostly an application of his principals in the web environment.
Yeah, but doesn’t one need permission from the copyright holder to reproduce any amount of text in another form? Bringhurst’s chapter headings are text, too. Maybe I’m being too picky…
I agree Dan, to reproduce anything, no matter how much, in principle infringes on the copyright. Not to mention the title or feeling of the text intended to relicate Bringhurst.
There is a © symbol noting that Bringhurst extracts are his, but then again they are not marked very well.
On a blog Rutter is running is the following:
I should also add that Robert Bringhurst has nothing to do with the site. I wrote to his publishers nearly a year ago to explain my intentions and ask permission to use the extracts, but I got no reply. I think it amounts to ‘fair use’ anyway, but I thought it polite to ask.
>to reproduce anything, no matter how much, in principle infringes on the copyright.
I’m not a lawyer, but this is not accurate.
For a start, only text, and not ideas, is copyrightable. Also the quoted statement ignores the ‘fair use’ clause, with the author of the web site appeals to.
The ‘arrangement’ of the text or story I believe falls under copyright,but it isn’t obvious at all what the lines are between copyrightable arrangement of text and non-copyrightable ideas.
You’re right William, I was generalizing. Just thinking in addition to copyright about intellectual and/or emotional property rights (which would apply to ideas).
Anyway, all this is certainly an issue for Rutter, and not so much for us—hopefully he and Bringhurst will be square in some fashion.
Well, hopefully Rutter can keep going. I’d love to have a clear, concise, and technical typography resource to point web designers to. Something to keep an eye on.
Glad to hear you think this should be a useful resource – thanks.
I was interested to hear your thoughts on the copyright issues. They concern me too, but like I said I did write to the publishers (a paper letter rather than email) detailing exactly what I was hoping to publish, but I got no reply.
The design is supposed to feel somewhat like the book, and I’m glad that’s been recognised, but there’s nothing actually the same. Even the type treatment is different, apart from the heading which uses Minion as in earlier editions of the book.
I do quote liberally from the book and I suppose I’m taking a risk that it may overstep the fair use boundaries (I hope not but I’m no copyright lawyer), but I hope that the educational context, obvious attribution, non-commerciality, and publicity for the book will not annoy the author and publisher too much.
I recommend you write the publisher again, just to be on the safe side. Most publishers are notoriously unresponsive to these kinds of things, often requiring several letters before they respond. I’ve worked in publishing for a number of years now, and this looks like the kind of thing for which a permissions fee would be appropriate. You’re better off settling with them up front rather than waiting for them to find it and possibly refuse permission.
A great resource though, and I look forward to seeing it expanded.
> this looks like the kind of thing for which a permissions fee would be appropriate
Possibly, but since Richard does not seem to be doing this for profit, it might be a stumbling block.
Perhaps they would be interested if there was a link to Amazon where people could buy the hard copy version of the book.
> Bringhurst’s chapter headings are text, too. Maybe I’m being too picky…
I, for one, don’t think you’re being too picky, Dan.
> I recommend you write the publisher again, just to be on the safe side.
Richard, while I applaud your website and efforts, I agree with Mandy. Maybe you could send the publisher an e-mail this time, with a link to your website. Perhaps you should try to contact Bringhurst as well. He wrote and designed the book, after all.
I am no authority on copyright issues, but my father was a lawyer. You clearly have good intentions, since you have set passages from the book in italics to set them apart from your own words, and have placed a copyright notice at the foot of each page. However, I feel that perhaps you should indicate even more clearly that your project is based on Bringhurst’s book. For example, when you first see the banner of your site’s homepage it is not clear that you were inspired by the book – it might help if you set the book’s title in italics. (I know, I know – your banner is set the same way as the book’s cover, but you can’t tell that from just looking at the website. Think about someone who is not even remotely familiar with the book coming across your website.)
I think that you should give every possible indication that you are acting in good faith. Italicizing the title may sound like a subtle thing to do, but it probably won’t seem subtle to a lawyer. You could also place a small text somewhere on the banner (or homepage), a statement of purpose, explaining that what you are doing is based on Bringhurst’s book – again, so that even a first-time visitor to your site, one who might not be familiar with the book, can know right from the start what’s going on. Your bibliography page has some of this info, as Stephen mentioned, but it’s tucked away, not at the opening, which is what everyone sees.
Only an expert can tell you, and probably for more than you want to pay, what exactly is fair use. Quite aside from the question of what is legal, involvement of Bringhurst, if he were willing, would be a great enhancement to your project.
> I feel that perhaps you should indicate even more clearly that your project is based on Bringhurst’s book…
Actually, I have to take that back: I was looking at your website on an older browser – horrors! – and therefore missed the link to your Introduction page, where you explain everything quite nicely. So, my apologies, Richard. As for the legal stuff, William is right: only an expert can tell you.
Copyright is not only control over financial reward it is control over distribution. If Robert prefers his words/ideas in print form then that is his choice (as it would be any person who had copyrighted their intellectual property). Any reproduction requires explicit permission (doesn’t matter if you are not doing it for profit, the owner maintains control, that is the whole point of copyright).
I had applied Bringhurst to my first Movable Type blog for kicks. I lost a lot of the auto-formatting when I moved over to Textpattern but have been slowly planning on re-implementing them.
On this page, you can see under point 4.2 how I implemented small caps for example.
I’m sure the blog you mentioned is very interesting, but it has been rendered too small for me to read, and by someone who used pixel dimensions in the style sheet, rather than ens or some other scalable process, effectively blocking me out of it.
Gerald, you are absolutely spot-on. Copyright is principally concerned with controlling reproduction and distribution of IP. Profit is a separate issue.
Regarding fair use: to the best of my knowledge, portions of a work quoted under fair use can only be for the purposes of review, criticism and educational use, and the rule of thumb for the amount you can quote is 10 percent. I’m not an IP lawer either but have advised collegues and clients in disputes, and on the whole my points have won on merit.
Back on topic–I put together this page set in Georgia at 10 pt on 18 pt leading. The main difference between the way I’ve used Georgia on that page, and the way Georgia is used on most webpages, is the addition of letter spacing. The technique did not start as an attempt to simulate the even-toned antiqua style of 15th/16th century typography, but a way of increasing readability by ‘blurring’ the word pictures.
Okay–some people will think ‘blurring’ can only make things harder to read. Not so. The generous leading helps separate the lines (obvious), but spreading the letters out makes a bigger improvement. The word pictures or bouma become clearer and more distinct (especially on the low resolution of computer screens) and help control matter contrast. Compare the ease of reading to a page set in Georgia at the same point size without letter spacing. Try reading it from more than six feet away from the screen, and back even further; a long-sighted friend of mine can read it from a distance of 12 feet across the room.
One of the boons of this method is to free you from viewing the screen at close range. I’ve set long HTML documents of pithy text that can be read in a more relaxed attitude, sitting back comfortably, because for once you’re not squinting and straining to make out the word forms. The relaxing part induces an immersive reading state.
Good typesetters know that an off-white page color makes type more readable on-screen by contrast reduction, and less than 100% black ink has the same effect. The ‘blurring’ effect of letter spacing does the same thing again–a means of reducing contrast. I’ve tried this with 100% black type on a 100% white page and its still an improvement on Georgia ‘out-of-de-box’. I think much of the readability gain also comes from both the visual characteristics and the psychological impact of even tone.
This technique works with any good grid-fitted serif font (fonts made to perform perfectly on-screen at small sizes) as well as sans serifs, altho not as effectively. Another example using the same settings can been seen by clicking on my name at the end of this post (sorry I don’t mean to self-promote here).
Can somebody please summon Hrant and ask him “Is this thing Jim is doing any good?”
If life calms down a bit in my house I might get to finally put up the ST website proper in January 2005, which will use more advanced techniques.
The original Italian and Venetian printers were onto a good thing. Its a shame supply-and-demand and economies of scale, and the fashion for tight setting burried their invention.
Long live Bringhurst.
Could you elaborate on your last paragraph?
“The original Italian and Venetian printers were onto a good thing. Its a shame supply-and-demand and economies of scale, and the fashion for tight setting burried their invention.”
Curious as to what you mean by this.
I stress that this is conjecture and a personal view, not an accepted interpretation of history gleaned from established writings on type.
It’s a theory as to how and why the even-toned letter-spaced typography of early Italian area printers gradually gave way to tighter and tighter setting, if the well-known historical examples are anything to go by.
Economies of scale and supply and demand. Factors like the cost of paper and commercial pressure to stay competitive affect the way printers go about their business. Its reasonable to speculate that these pressures may have driven print houses to save costs (and remain profitable) by using less paper; printing a given amount of text on less paper would demand tighter letter spacing, producing books with higher word-count per page and fewer pages. Such editions would have been lighter in weight and cost less to ship to remote markets, again helping to preserve profit.
Another factor may have been the dynamics of the paper market. A large paper manufacturing industry simply did not exist until moveable type created the demand for it. As printing spread across Europe, demand for paper rose and its price plummeted–economies of scale. This would have reduced paper costs for printers, but their margin would soon have been eroded by competition with each other until it became necessary to economize again with tighter spacing and less paper. Competition between paper suppliers may have driven the market price of their product–and their profitability–to rock bottom at various times, necessitating price fixing and price increases, with a follow-on effect forcing printers to either increase the price of their services or preserve viability by cramming more words onto fewer pages.
Newspapers, with their practical need for high word density, came along at the beginning of the 17th century. The popular, cheap, disposable medium–the antithesis of finely crafted books–must have had some bearing on what was perceived by readers as acceptable quality in printing. If you’re used to looking at newsprint every day, your expectations may be diminished, such that a book with slightly better printing won’t be found terribly lacking in quality–until you compare it to a real book.
The Syndrome. What I’m driving at is the basic syndrome that occurs in most manufacturing industries. A new invention or technology comes along that everyone wants, and thru commercial competition and the dynamics of mass-marketing the product is continually cheapened by reducing its quality to meet demand and negate ever-shrinking margins wrought by competition.
Clone Wars. The PC clone industry is an extreme example. Vicious price wars in the 1990′s slashed the retail margin on PCs to 5 percent around 1995, forcing retailers to offer appalling standards of service, while the overwhelming demand for personal computers forced manufacturers to make machines as cheaply as possible–very flimsy constructions compared to the original IBM PC.
Fashion. Once the style or appearance of a thing becomes established, ie: fixed in people’s minds, we get used to seeing it that way, in the particular guise we’ve seen it for…as long as anyone can remember. After that, anything different to the established look is perceived as odd, or somehow ‘wrong’, when from a chronological perspective it’s only different, or unfamiliar compared to the status quo. That’s a generalization, but you get the idea: When tight-set printing became established practice it became ‘standard’, and the early letter-spaced style ‘fell out of fashion’ because mainstream printers were no longer exposed to it. That’s not to say that quality letter-spaced typography fell into disuse or ceased to be practiced at any point. Aldine-style book production never died. Rather, it merely fell out of mainstream use and was relegated to the hands of devotees.
It’s very convenient for me to say, “When tight-set prrinting became established practice”, but when, exactly, did this supposedly happen? At what point(s) in history did type become tighter set? I don’t expect anyone to just take my word for it and swallow everything that follows from that premise.
Syndrome shift points. The 1957 Dover edition of Nesbitt’s History and Technique of Printing contains specimens of the even-toned, letter-spaced setting of the 15th & 16th century eg: Jenson, Manutius, the Ratdoldt specimen, Estienne’s 1532 roman, Plantin’s Biblia Polyglotta, the original ‘Garamond’ of the Egenolff Sheet. One exception from that era is the tight-set De-Colines roman of 1536.
Specimens for Great Primer and Fell Roman c. 1670 exhibit moderate spacing characteristics–looser than Caslon, but tighter than Jenson, Griffo et al.
Nesbitt page 131 shows Caslon Old Face roman reproduced from specimens issued by Caslon & Co, with garish tight spacing and miserly leading; the text on page 130 says the specimens were “…printed in 1923–1924 with types produced from the original punches and matrices of the eighteenth century firm of William Caslon and Son.” Assuming those matrices and type bodies were not modified to obtain closer fit, the spacing seen in the sample should be representative of the Caslon’s original matrices. That gives a syndrome shift date of around 1734. We could test that by comparing the 1923–1924 specimen against Caslon’s first specimen sheet of 1734–if anyone has a facsimile image please post it.
Given the huge influence of Caslon, distributed as the standard font of the British Empire, it was the Microsoft-forced TNR of its day, and as type folks who are into this stuff know, very pervasive. But fashions are neither all-encompassing nor all-pervasive. Baskerville and Bodoni resisted in the 18th century with their own superior, sensible designs resting on old style metrics.
I can’t cite many examples from the 19th century since I don’t have a useful collection to hand, but most written sources agree that lettering arts in the 19th century are barely worth speaking of. The industrial revolution had much the same effect of facilitating a reduction in the quality of typography and lettering arts as the digital ‘revolution’ is exerting in some circles of graphic design and type design today.
By the 20th century tightly-fitted revivals like Stemple Garamond and Bembo were designed to be tightly-set, as was Cloister roman. If I pick books at random from the library in my office, the tracking values in 9 out of 10 are as tight as a fish’s arse. In a dictionary, newspaper or a magazine I accept and expect tight setting according to their nature and function. But fiction and non-fiction books are for reading, and ought to be set accordingly.
The status quo. In short, it’s a syndrome we’re living in, entrenched for over a century. Bunched-up type is simply accepted as ‘normal’ and perpetuates itself largely unquestioned. Happily some mass-market books exist outside the syndrome, but they are the exception. Four centuries ago printed books were beautiful and much easier to read. In the intervening time the proliferation of printing and the market forces accompanying it must have played a role in getting us to where we are now.
If I’ve relied on Nesbitt too much and anyone has information that could poke holes in the view I’ve constructed, please go ahead. I’m up for discussion and debate.
Thanks for your curiosity Gerald. :^) We’re drowning in information these days and its reassuring to find people who question the veracity of at least some of it. I’m the curious kind, very spritual at heart, but I have a skeptical mind.
> January 2005
Uh, January 2006!
Notify me of follow-up comments by email.
Notify me of new posts by email.
Typographica is a review of typefaces and type books, with occasional commentary on fonts and typographic design. Edited by Stephen Coles and designed by Chris Hamamoto. Founded in 2002 by Joshua Lurie-Terrell. Relaunched in 2009 by Coles and Hamamoto.
Set in Bureau Grot by Font Bureau and Turnip RE by David Jonathan Ross, both served by Webtype, and JAF Bernini Sans by Tim Ahrens.
Brought to you by this month’s nameplate sponsor, FontShop, MyFonts, FontFont, Wordpress, Fused, and the letter B. Read our editorial policy.
Fonts In Use
Type at work in the real world.
The Anatomy of Type
A book by the editor of Typographica about the finer details of typefaces.
Lettering on vintage cars, appliances, and other objects.
Fleurs Coiffeur Liqueur
Lettering on storefronts.