Graphic Design: One Space or Two After a Period

Recently, I have seen two rather long Facebook discussions on whether one should use two spaces after a period or one. I learned to type on a manual typewriter in seventh grade, where I was taught the two spaces after a period rule. I clearly remember, the teacher and the class repeating, “period, space space, period, space space” when learning how to type. And if you’d asked me just two years ago, I would have said “Two Spaces!” loudly and clearly. But things have changed. I’ve been studying graphic design – learning the Adobe Suite slowly, first In Design, and now Illustrator. But I have also been buying and reading books on graphic design – in an attempt to learn whatever rules there might be to good verses bad web design and graphic design in general. It’s not my very first time trying to learn something about the mysterious world of design. I took a graphic design class in college – well, half of one to be precise – half the class was photography and the other half was design. And it was… well, I liked the graphic design half, but I found it incredibly frustrating as well. I often felt like the class was in a foreign language that I didn’t speak. Part of that may have been the inexperienced teacher, part of my confusion was certainly me – that was my first year at a major university (I started at my local community college). But the result was I had the feeling that I enjoyed graphic design, but I didn’t “get it”, if you know what I mean. I’m doing so much better in my classes now – both learning the programs, and learning design from the books and websites I’ve been reading.

Also, I’ve been writing this blog for nearly a year now, since August of 2014, and I’ve noticed that the “one space after a period” rule really makes a difference. And that difference is because of responsive design and how text flows in a blog post or on a website. I’ve actually cleaned-up some older blog posts to remove extra spaces. And I usually go through a post before I click “publish” to check for extra spaces. I’ve seen some pretty bad results when I’ve slipped back into my “period space space” habit. And it’s worth the clean look to take the time to fix it.

In her section on preparing a manuscript for print, Ellen Lupton has this to say, “Word spaces are created by the space bar. Use just one space between sentences or after a comma, colon, or semicolon. One of the first steps in typesetting a manuscript is to purge it of all double spaces.” Lupton, p. 210.

She also explains, “Design is as much an act of spacing as an act of marking. The Typographer’s art concerns not only the positive grain of letterforms, but the negative gaps between and around them. In letterpress printing, every space is constructed by a physical object, a black piece of metal or wood with no raised image. The faceless slugs of lead and slivers of copper inserted as spaces between words or letters are as physical as the relief characters around them.” Lupton, p. 91.

Lupton, Ellen. Thinking with Type A Critical Guide for Designers, Writers, Editors, and Students, 2nd Ed., Princeton Architectual Press, New York (2004, 2010).

Another graphic designer, Robin Williams (no not that Robin Williams), simply references other books, “If you haven’t already, I strongly recommend you read The Mac is not a typewriter or The PC is not a typewriter. If you are still typing two spaces after periods, if you are underlining text, if you are not using true apostrophes and quotation marks …, then you seriously need to read one of those books.” p. 86, The Non-Designer’s Design Book (2nd Ed.), Peachpit Press, Berkeley, CA (2004)

Even style manuals recommend a single space. The APA Style Manual has this to say about manuscript spacing:

“Space once after all punctuation as follows:

  • after commas, colons, and semicolons;
  • after punctuation at the ends of sentences;
  • after periods that separate parts of a reference citation; and
  • after the periods of the initials in personal names (e.g., J. R. Zhang).

Exception: Do not space after internal periods in abbreviations (e.g., a.m., i.e., U.S.) or around colons in ratios. – APA Style Manual

Publication Manual of the American Psychological Association, pp. 290-291, Section 5.11 Spacing and Punctuation (5th Ed.)  American Psychological Association, Washington, D.C. (2001)

And, surprisingly, the Chicago Manual of Style agrees,  “Word Spacing – one space or two? Like most publishers, Chicago advises leaving a single character space, not two spaces, between sentences and after colons used within a sentence [but see 14.121], and this recommendation applies to both the manuscript and the published book.” Section 2.9, p. 29, Chicago Manual of Style

Note that section 14.121 refers to correct punctuation and spacing in a Bibliography or Works Cited section – and as that section always has special rules, apart from prose and body sections of a work, and those rules are highly detailed – I’m not going to go into them. My advice is that when you are writing a paper for college, university, high school English, or publication – look it up, and look it up in the specific publication manual used for your particular situation – that is, your school, a particular journal, etc. Also, handy tip – have a copy of the publications or style manual handy, and continuously check your formatting. Never trust that your Word Processor will apply APA or CMS styling and formatting correctly.

The Chicago Manual of Style goes on to specifically recommend that all hard returns within a paragraph be eliminated and that one should never use the space bar to indent text – ever!

“Spaces, tabs, and hard returns within paragraphs. A well-structured electronic document will never include more than one consecutive character space. To indent the first line of a paragraph or items in a vertical list, use the Tab key or your software’s paragraph indention features rather than the space bar. (Also eliminate any extra character space or tab after the final punctuation at the end of a paragraph; the hard return should follow the punctuation immediately.) To achieve hanging indentation for runover lines (as in a bibliography or index), use your software’s indent features – not hard returns and tabs or spaces [see 2.22]. A tab or a hard return (i.e., a paragraph break, generally made with the Enter key) should never appear within a paragraph. For prose extracts see 2.18; for poetry, see 2.19. Section 2.11, p. 60, Chicago Manual of Style.

Chicago Manual of Style The Essesntial Guide for Writers, Editors, and Publishers, The. (16th Ed.) University of Chicago Press, Chicago, (2010).

Why? Why the change? Well, it has to do with two things – proportional fonts verses fixed-width fonts, and responsive design. It also has to do with Kerning, and other design tricks of the final manuscript. Typewriters had fixed-width fonts. They had to, because each key manually struck the ribbon, so it had to move independently. The letter was in the center of the metal key, and a skinny letter, such as an i, took up the same amount of space as a wide letter like a w. Mechanically, the typewriter wouldn’t have worked otherwise. This is also why the qwerty keyboard was developed, it’s an arrangement of keys specifically designed so as a fast typist hits the keyboard, and the metal keys are raised to strike the ribbon and leave an impression of ink on the paper – the keys don’t stick together. If you’ve ever typed on a manual typewriter – you instinctively know this (when you learn to type on one, accidentally hitting two keys at once just happens – you unstick the keys and move on.) If you’ve only used a computer keyboard, or you don’t 10-finger type, it’s probably a bit of a mystery.

However, on a computer – most of the fonts are proportional, especially the most often used fonts (Times New Roman, Arial, Calibri, Baskerville Old Face, Garamond, Tahoma, etc.) That is to say, a skinny letter (i) takes up less space and a fat letter ( w ) takes up more. One of the few fixed-width fonts included on most any computer and in most any Word Processing program is Courier New – which is used specifically for times when a fixed-width font is needed, such as samples of software computer code in the midst of a technical report. The report will be set in a standard proportional font (at my job we used either Helvetica or Arial) but the code sections would be set apart and in Courier New.

If you want to test the difference type the sentence: The quick brown fox jumped over the lazy dogs, on a page in Microsoft Word or whatever word processor you like, then try changing the font – look at the spacing of the letters.  (If you want to make it very obvious, tack on “with the cat” after, “dogs” – the difference between the “w” and the “i” will be obvious.) If you want to see the difference, copy and paste the sentence again, and change the second sentence to Courier (or Courier New).

See below:

Proportional_Fixed-width_font_test

You can also see how much more space the fixed-width font takes, even at the same exact point size.

In professionally designed magazines, and books, as well as some websites, a graphic designer can use a program like Adobe InDesign and apply Kerning to adjust any awkward gaps or running together between letters or words due to the specifics of the actual text. Kerning is a mathematical way to adjust spacing (it’s applied by letter, but it can be used between words.) Kerning is often used in headlines, titles, logos that include words or names, or as I did in my InDesign class, when adding drop caps (capitals) to the first word on a page or in a paragraph. A drop cap is a large letter at the beginning of a word – often at the start of a page or chapter.

The second reason is responsive design. Not every screen is the same. You might read this blog post on a 17-inch widescreen monitor, similar to the one attached to my desktop machine right now; or you might read it on a 3 x 5 smartphone screen, or a 4 X 6 one, or a 7-inch tablet, 8-inch tablet, or 10-inch tablet. Apple’s introduced a smart watch. Laptops come in all different sizes – as do smart phones and tablets. Every single one of these devices has a different sized screen. If your initial website is set-up correctly, text should flow evenly and vertically so it can be read on any screen, no matter how big or how small. Other elements of the website should move around the main text. On a physically wider screen, text can stretch wider in horizontal space – but one should never, ever, ever have to scroll horizontally to read the text – but vertical scrolling is OK and expected. If your website is optimized to be responsive – the text will re-flow to fit the screen size. However, double spaces can, and do, mess up responsive design – resulting in messy text with extra indents. It can even give the impression of missing words.

So, change your habits – especially on-line use one space not two.

References

Amazon Link – Thinking with Type

Amazon Link – The Non-Designer’s Design Book (Note – this is the link to the 2nd edition, more recent editions are available)

APA Style Guide

Chicago Manual of Style (Note – website is subscription only)

Paperback and hardcover copies of the APA Style Guide and the Chicago Manual of Style should be available from Amazon.Com as well as any college or university book store.