{"id":650,"date":"2007-12-03T01:23:18","date_gmt":"2007-12-02T16:23:18","guid":{"rendered":"https:\/\/regex.info\/blog\/2007-12-03\/650"},"modified":"2007-12-03T01:23:18","modified_gmt":"2007-12-02T16:23:18","slug":"robert-bringhursts-the-elements-of-typographic-style","status":"publish","type":"post","link":"https:\/\/regex.info\/blog\/2007-12-03\/650","title":{"rendered":"Robert Bringhurst&#8217;s <i>The Elements of Typographic Style<\/i>"},"content":{"rendered":"\n\n<p>From <a href=\"http:\/\/www.amazon.com\/dp\/0881792063\/masteringregu-20\">The Elements\nof Typographic Style<\/a> (third edition):<\/p>\n\n<table class='q' width='75%'><tr valign='baseline'><td><span\nclass='qo'>&#8220;<\/span><\/td><td><span class='q'>\nIn <span class='nobr'>a world<\/span> rife with unsolicited messages, typography must often draw\nattention to itself before it will be read. <span class='nobr'>Yet in order<\/span> to be read, it\nmust relinquish the attention it has drawn.<\/span><span class='qc'>&#8221;<\/span><span class='pp'>&mdash; page 17<\/span><\/td><\/tr><\/table>\n\n<p>For the four-and-a-half hours in the bullet train on my trip to see <a\nhref=\"\/blog\/2007-11-30\/648\" class='quiet'><span class='nobr'>a friend<\/span><\/a> the\nother day, <span class='nobr'>I brought<\/span> with me this excellent book by <a\nhref=\"http:\/\/en.wikipedia.org\/wiki\/Robert_Bringhurst\" class='quiet'>Robert\nBringhurst<\/a>.<\/p>\n\n<p>When most people read a book (or <span class='nobr'>a sign<\/span> or the classifieds or <span class='nobr'>a menu<\/span>\nor...) they don't give even the slightest thought to the typography &ndash;\nthe shapes of letters and punctuation, and their layout relative to each\nother and to the page as <span class='nobr'>a whole.<\/span> Yet, since the typography is responsible\nfor 100% of the information you get from the printed word, its clearly\nextremely important to think about when writing. Even when writing <span class='nobr'>a simple<\/span>\nweb page like this, the writer makes may typographic decisions: how to\ndistinguish paragraphs, when\/if to use italics or bold, etc.<\/p>\n\n<p>I was enthralled by the first edition of this book while working on the\nfirst edition of <a href=\"\/book.html\">mine<\/a> back in the mid 90s,\nnot only because of its information content, but also due to Bringhurst's\nwriting style. <span class='nobr'>He is also<\/span> <span class='nobr'>a poet,<\/span> and while <span class='nobr'>I don't<\/span> have much stomach for\npoetry (see my thoughts <a\nhref=\"\/blog\/2005-04-12\/11\">here<\/a>), that aspect of his\nnature lends <span class='nobr'>a wonderful<\/span> lilt to his typographic writing.<\/p>\n\n<p>It's a completely different kind of <span class='QO'>&#8220;<\/span>great writing<span class='QC'>&#8221;<\/span> than, say, Bill\nBryson (about whom I've written <a\nhref=\"\/blog\/2007-04-24\/435\">here<\/a> and <a\nhref=\"\/blog\/2007-05-11\/451\">here<\/a>), or <i>Light &mdash;\nScience and Magic<\/i>, the clearly-written book on photographic lighting <a\nhref=\"\/blog\/2007-10-31\/618\">I've posted about<\/a>. So,\nhere are some examples of Bringhurst's writing...<\/p>\n\n<p>While discussing how the design of each letter in <span class='nobr'>a font<\/span> can\nvisually bond &ndash; or not &ndash; to other letters, he brings up...<\/p>\n\n<table class='q' width='75%'><tr valign='baseline'><td><span\nclass='qo'>&#8220;<\/span><\/td><td><span class='q'>\n...other unserifed faces, such as Helvetica, in which nothing more than\nwishful thinking bonds the letters to each other.\n<\/span><span\nclass='qc'>&#8221;<\/span><span class='pp'>&mdash; page 32<\/span><\/td><\/tr><\/table>\n\n\n<p>In talking about how to use whitespace, he writes...<\/p>\n\n\n<table class='q' width='75%'><tr valign='baseline'><td><span\nclass='qo'>&#8220;<\/span><\/td><td><span class='q'>\n\nLists, such as contents pages and recipes, are opportunities to build\narchitectural structures in which the space between the elements both\nseparates and binds. <span class='nobr'>The two favorite<\/span> ways of destroying such an\nopportunity are setting great chasms of space that the eye cannot leap\nwithout help from the hand, and setting unenlightening rows of dots (<i>dot\nleaders<\/i>, as they are called) that force the eye to walk the width of\nthe page like <span class='nobr'>a prisoner<\/span> being escorted back to its cell.\n\n<\/span><span\nclass='qc'>&#8221;<\/span><span class='pp'>&mdash; page 35<\/span><\/td><\/tr><\/table>\n\n\n<p>Of title pages, he says...<\/p>\n\n<table class='q' width='75%'><tr valign='baseline'><td><span\nclass='qo'>&#8220;<\/span><\/td><td><span class='q'>\n\nIt is not enough, when building <span class='nobr'>a title<\/span> page, merely to unload some big,\nprefabricated letters into the center of the space, nor to dig <span class='nobr'>a few<\/span> holes\nin the silence with typographic heavy machinery and then move on. Big type,\neven huge type, can be beautiful and useful. <span class='nobr'>But poise<\/span> is usually far more\nimportant than size &ndash; and poise consists primarily of emptiness.\nTypographically, poise is made of white space. Many fine title pages\nconsist of <span class='nobr'>a modest<\/span> line or two near the top, and <span class='nobr'>a line<\/span> or two near the\nbottom, with nothing more than taut, balanced white space in between.\n\n\n<\/span><span\nclass='qc'>&#8221;<\/span><span class='pp'>&mdash; page 61<\/span><\/td><\/tr><\/table>\n\n\n<p>In talking about the blank pages one often finds before the first page\nand after the last...<\/p>\n\n<table class='q' width='75%'><tr valign='baseline'><td><span\nclass='qo'>&#8220;<\/span><\/td><td><span class='q'>\n\n<span class='nobr'>A brief<\/span> research paper may look its best with no more space at the\nbeginning and end than is provided by the standard page margins. <span class='nobr'>The same is<\/span> rarely true of <span class='nobr'>a book,<\/span> whose text should generally be, and should seem\nto be, <span class='nobr'>a living<\/span> and breathing entity, not aged and shrink-wrapped meat.\n[Some short books] can begin directly with the title page. Otherwise, <span class='nobr'>a\nhalf<\/span>-title is customary, preceding the title page. <span class='nobr'>It is equally<\/span> customary\nto leave <span class='nobr'>a blank<\/span> leaf, or at least <span class='nobr'>a blank<\/span> page, at the end of <span class='nobr'>a book.<\/span>\nThese blanks provide <span class='nobr'>a place<\/span> for inscriptions and notes and allow the text\nto relax in its binding.\n\n<\/span><span\nclass='qc'>&#8221;<\/span><span class='pp'>&mdash; page 72<\/span><\/td><\/tr><\/table>\n\n<p>Yet, he goes on to note...<\/p>\n\n<table class='q' width='75%'><tr valign='baseline'><td><span\nclass='qo'>&#8220;<\/span><\/td><td><span class='q'>\n\n<span class='nobr'>A wad<\/span> of blank leaves at the end of <span class='nobr'>a book<\/span> is <span class='nobr'>a sign<\/span> of carelessness, not\nof kindliness toward the readers who like to take notes.\n\n<\/span><span\nclass='qc'>&#8221;<\/span><span class='pp'>&mdash; page 73<\/span><\/td><\/tr><\/table>\n\n<p><i>Kerning<\/i> is the subtle adjustment of space between specific pairs\nof letters to create <span class='nobr'>a more<\/span> pleasing result. Compare the letter placement\non these three lines:<\/p>\n\n<img loading=\"lazy\" decoding=\"async\" src=\"\/i\/KernedATT.gif\" width=\"230\" height=\"175\"\nid=\"iKernedATT\"\nstyle=\"margin: 15px 0 15px 4em; padding:20px; background-color: #EEFFEE\"\/>\n\n<p>The first line is unkerned, so each letter takes up its default amount\nof space. <span class='nobr'>In the others<\/span>, the letters have been <span class='QO'>&#8220;<\/span>tucked<span class='QC'>&#8221;<\/span> into each other to\nvarying degrees. <span class='nobr'>It might<\/span> not seem important in this large display of\njust four characters, but it can make <span class='nobr'>a big<\/span> difference in the overall\n<span class='QO'>&#8220;<\/span>feel<span class='QC'>&#8221;<\/span> of <span class='nobr'>a book,<\/span> for better or for worse...<\/p>\n\n<table class='q' width='75%'><tr valign='baseline'><td><span\nclass='qo'>&#8220;<\/span><\/td><td><span class='q'>\n\nComputerized typesetting makes extensive kerning easy, but judgment is\nstill required, and the computer does not make good judgment any easier to\ncome by.\n\n<\/span><span\nclass='qc'>&#8221;<\/span><span class='pp'>&mdash; page 33<\/span><\/td><\/tr><\/table>\n\n<p>Indeed. Kerning can be particularly important with letter-punctuation\nand punctuation-punctuation pairs, so <span class='nobr'>I did<\/span> a <i>lot<\/i> of detailed hand\nkerning in my punctuation-heavy <a href=\"\/book.html\">book on\nregular expressions<\/a>. <span class='nobr'>It's one of<\/span> the reasons that my book garners an\ninordinate number of <span style='font-family:times; padding-right:2px'>&#8220;<\/span>it's beautifully typeset<span style='padding-left:2px; font-family:times'>&#8221;<\/span> comments. (<span class='nobr'>I mean,<\/span> really,\nhow often do you ever see comments about <span class='nobr'>a computer<\/span> book's typesetting, and\nat that, <i>complimentary<\/i> comments?)<\/p>\n\n<hr style='width:10em; margin:20px auto 20px 0' align='left'\/>\n\n<p>Most people never notice typesetting in what they read, and that's as it\nshould be because good typesetting is the kind that doesn't get noted\nconsciously, but instead subconsciously guides and sooths the reader. <span class='nobr'>One only needs<\/span> to see poor typesetting to bring this to mind, such as any page\non MySpace, or Wired Magazine. (<span class='nobr'>I read<\/span> <span class='nobr'>a few<\/span> issues of Wired back in the\nmid 90s, but although <span class='nobr'>I enjoyed<\/span> the content, their typography and page\ndesign &ndash; such as bright red lettering on bright blue paper &ndash;\ncaused me to become physically ill after just <span class='nobr'>a few<\/span> minutes. <span class='nobr'>I decided<\/span> that\nthe content wasn't worth <span class='nobr'>a headache,<\/span> so <span class='nobr'>I quickly<\/span> stopped reading it.)<\/p>\n\n<p>As much as I enjoy Bringhurst's book, <span class='nobr'>a few<\/span> things bother me about it. <span class='nobr'>He uses tall<\/span>, thin pages and <span class='nobr'>a tight<\/span> binding, so you have to really work to\ncrack the book and hold open. <span class='nobr'>It's not as<\/span> bad with this third edition as it\nwas with the first, for which I'm thankful, because <span class='nobr'>I kept<\/span> getting cramps\nwhen reading the first edition until <span class='nobr'>I concocted<\/span> <span class='nobr'>a way<\/span> to use <span class='nobr'>a coat<\/span>-hanger\nto jam open the book to the page <span class='nobr'>I was<\/span> on.<\/p>\n\n\n<p>About footnotes he says...<\/p>\n\n<table class='q' width='75%'><tr valign='baseline'><td><span\nclass='qo'>&#8220;<\/span><\/td><td><span class='q'>\n\nLong footnotes are inevitably <span class='nobr'>a distraction<\/span>: tedious to read and wearying\nto <span class='nobr'>look at.<\/span> Footnotes that extend to <span class='nobr'>a second<\/span> page (as some long footnotes\nare bound to do) are an abject failure of design.\n\n<\/span><span\nclass='qc'>&#8221;<\/span><span class='pp'>&mdash; page 68<\/span><\/td><\/tr><\/table>\n\n<p>I agree completely, but I don't think what he's done is much better. He\nputs <i>side notes<\/i> into the generous outer margins he's put on each\npage. <span class='nobr'>The problem<\/span> is that there's nothing but vague proximity to tie the\nnote to its text, so <span class='nobr'>I often<\/span> find myself reading right past until <span class='nobr'>I realize<\/span>\nthat <span class='nobr'>I haven't<\/span> looked at any sidenotes recently, and turn back the pages to\nsee whether there were any.<\/p>\n\n<p>Perhaps even worse, when I do find <span class='nobr'>a sidenote<\/span> this way, <span class='nobr'>I can't<\/span> scan the\ntext for what it relates to because he does not use note markers. Thus, <span class='nobr'>I actually<\/span> have to read and comprehend the text just to find the part related\nto the note. Ugh.<\/p>\n\n<p>As I said, <span class='nobr'>I really<\/span> enjoy his writing style, but sometimes it gets in\nthe way of understanding. For example, <span class='nobr'>I have no<\/span> idea what this is supposed\nto really mean:<\/p>\n\n<table class='q' width='75%'><tr valign='baseline'><td><span\nclass='qo'>&#8220;<\/span><\/td><td><span class='q'>\n\nIn <span class='nobr'>a badly<\/span> designed book, the letters mill and stand like starving horses\nin <span class='nobr'>a field.<\/span> <span class='nobr'>In a book<\/span> designed by rote, they sit like stale bread and\nmutton on the page. <span class='nobr'>In a well<\/span>-made book, where designer, compositor and\nprinter have all done their jobs, no matter how many thousands of lines and\npages they must occupy, the letters are alive. They dance in their seats.\nSometimes they rise and dance in the margins and aisles.\n\n<\/span><span\nclass='qc'>&#8221;<\/span><span class='pp'>&mdash; page 19<\/span><\/td><\/tr><\/table>\n\n<p>It sounds pretty and all, but it seems meaningless in any kind of practical\nsense.<\/p>\n\n<p>One final comment in case Mr. Bringhurst is reading. I've seen books\nwith their edition labeled with <span class='QO'>&#8220;<\/span>version<span class='QC'>&#8221;<\/span> (e.g. <span class='QO'>&#8220;<\/span>version 2<span class='QC'>&#8221;<\/span> instead of\n<span class='QO'>&#8220;<\/span>second edition<span class='QC'>&#8221;<\/span>). When this is done on <span class='nobr'>a book<\/span> related to computer science,\nit's childish and clich&eacute; enough to make me cringe. <span class='nobr'>For other<\/span> types\nof books, it's only worse. <span class='nobr'>For a book<\/span> with the style and grace of <i>The\nElements of Typographic Style<\/i>, the <span class='QO'>&#8220;<\/span>version 3.1<span class='QC'>&#8221;<\/span> on the cover is almost\npornographically out of place. What on earth were you thinking?<\/p>\n\n<hr style='width:10em; margin:20px auto 20px 0' align='left'\/>\n\n<p>I don't want to end my post talking about the book's few shortcomings,\nbecause it's truly an excellent resource and an enjoyable read. <span class='nobr'>Its target<\/span> audience is much larger now than when the first edition came out in 1992,\nbecause there's <span class='nobr'>a lot<\/span> in there even for someone whose typesetting is\nlimited to writing web pages.<\/p>\n\n<p>And I'll end with a shout-out to Ken Lunde, who wrote the most-excellent\n<a href=\"http:\/\/www.amazon.com\/dp\/1565922247\/masteringregu-20\">CJKV\nInformation Processing: Chinese, Japanese, Korean &amp; Vietnamese\nComputing<\/a>. <span class='nobr'>It's Ken who<\/span> first sent me <span class='nobr'>a copy<\/span> of <i>Elements of Typographic Style<\/i> back in\n1995, and now <span class='nobr'>I notice<\/span> Ken's name in the <i>Afterword to the Third\nEdition<\/i>. Thanks Ken!<\/p>\n\n<style type=\"text\/css\">\n  \/* 650 *\/\n  #post650 table.q { margin-top:10px; margin-left:2em }\n  #post650 span.q  { font-size: 105% }\n  #post650 span.qo { font-size:200%; line-height:0; position:relative; bottom:-0.25em; font-family:roman }\n  #post650 span.qc { font-size:200%; line-height:0; position:relative; bottom:-0.25em; font-family:roman }\n  #post650 span.pp { margin-left: 2em; color: #888; white-space: nowrap }\n\n<\/style>\n\n","protected":false},"excerpt":{"rendered":"<p>From The Elements of Typographic Style (third edition):<\/p> \" In a world rife with unsolicited messages, typography must often draw attention to itself before it will be read. Yet in order to be read, it must relinquish the attention it has drawn.\" -- page 17 <p>For the four-and-a-half hours in the bullet train on my trip to see a friend the other day, I brought with me this excellent book by Robert Bringhurst.<\/p> <p>When most people read a book (or a sign or the classifieds or a menu or...) they don't give even the slightest thought to the typography &ndash; [...]","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/regex.info\/blog\/wp-json\/wp\/v2\/posts\/650"}],"collection":[{"href":"https:\/\/regex.info\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/regex.info\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/regex.info\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/regex.info\/blog\/wp-json\/wp\/v2\/comments?post=650"}],"version-history":[{"count":0,"href":"https:\/\/regex.info\/blog\/wp-json\/wp\/v2\/posts\/650\/revisions"}],"wp:attachment":[{"href":"https:\/\/regex.info\/blog\/wp-json\/wp\/v2\/media?parent=650"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/regex.info\/blog\/wp-json\/wp\/v2\/categories?post=650"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/regex.info\/blog\/wp-json\/wp\/v2\/tags?post=650"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}