Typography can make or break your design: a process for choosing type

This content has been archived. It may no longer be accurate or relevant.

From freeCodeCamp:

One of the most important skills you can learn as a designer is how to choose type. This is because text is one of the primary ways designers can communicate with users. Typography can make or break a design.

There’s a beauty and complexity to typography. Some people devote their entire careers to type. Thankfully, their work is well documented, so we have tons of online resources for typography.

This article is designed to serve as a starting point for helping you learn how to choose type for your designs. It will encourage you to explore fonts and font combinations beyond those you’re familiar with.

. . . .

[I]f you are designing a greeting card that’s illustration heavy, choose a font that fits the style of your illustration. Harmonize your type with the rest of your design.

. . . .

After determining the purpose of your design, identify your audience. This step is crucial because age and interest will influence your font options.

After clarifying the purpose of your design, identify your audience. This step is crucial because information about your users such as age, interests, and cultural upbringing could influence the decisions you make for your type.

For example, some fonts are more appropriate for children. When learning to read, children need highly legible fonts with generous letter shapes. A good example of this is Sassoon Primary. Sassoon Primary was developed by Rosemary Sassoon and based on her research into what kind of letters children found easy to read.

. . . .

 Other fonts are more appropriate for seniors. Senior-friendly fonts use readable sizes, high contrasting colors, and avoid scripts and decorative styles.

. . . .

 Armed with research and inspiration, you are ready to choose your type. When it comes to choosing type, keep the following principles in mind: readability, legibility, and purpose.

. . . .

Choose fonts that are conventional and easy to read. Avoid highly decorative fonts in favor of simple and practical fonts. Also, be mindful of the purpose of a font. For example, some fonts are more suited to be headers rather than body text.

Link to the rest at freeCodeCamp

PG immediately thought about fonts used on book covers when he saw this. Lots of examples at the OP.

27 thoughts on “Typography can make or break your design: a process for choosing type”

  1. Shimatta! I do apologize, I misread your statement and took it to mean the opposite. I am in agreement with you and USAF.

    Al the contrite

  2. Sorry, Tom, I’m with USAF on this one. Calling font families fonts is bone laziness, the kind of unthinking verbal shortcut that gives us ATM machines, because people don’t remember (or don’t care) that the M stood for machine.

    Font and typeface are still perfectly good and clear and distinct names for different things, we do them a disservice slurring them together.

    And look at me, defending fonts when I just argued they have no place in my reading. Hmmmm.

    • It may be lazy and it may be imprecise but… language evolves and in practical terms what uses see in their applications is “font” more often than “typeface”. If you want to communicate with the lazy masses you’ll get better results faster using terms they are familiar with.

      Most users think in terms of “font name” (Times New Roman), style (bold, italic, etc), and size because that is how they use them.

      Is that worth fighting over?

      Blame software developers. 🙂

    • Sorry, Al, I am not actually disagreeing with USAF. I am disagreeing with Peter Spenser, who evidently still thinks that a font is restricted to a single point size. USAF quoted the dictionary meaning – emphasis added:

      Each font of a typeface has a specific weight, style, condensation, width, slant, italicization, ornamentation, and designer or foundry (and formerly size, in metal fonts).

      Beginning with phototypesetting, and since with digital type, a single font can be scaled to any arbitrary size, and scaling it does not make it into a different font.

      USAF and I would appear to be in 100% agreement, and I am not at all sure what you think you’re disagreeing with me about.

  3. Font
    noun
    a set of type of one particular face and size.
    ORIGIN late 16th cent. (denoting the action or process of casting or founding): from French fonte, from fondre ‘to melt.’

    Typeface
    noun
    In typography, a typeface (also known as font family) is a set of one or more fonts each composed of glyphs that share common design features. Each font of a typeface has a specific weight, style, condensation, width, slant, italicization, ornamentation, and designer or foundry (and formerly size, in metal fonts).

  4. I find it a bit sad that a site that is supposedly giving out professional-level advice seems to make the same mistake that amateurs do: the equating of font with typeface. “Garamond Premiere Pro” is a typeface. “Garamond Premiere Pro 12-point bold italic” is a font.

    • In electronic typesetting, ‘Garamond Premier Pro bold italic’ is a font, which may be reproduced (identically) at different sizes. Even typefaces with optical sizes (a sadly small minority at present) use only a handful of instances to cover all the options.

      Robert Slimbach’s designs for Adobe, for instance, typically use four or five optical sizes. His Arno family, for instance, comes in caption, small text, regular, subhead, and display sizes. (He also designed Garamond Premier Pro, which has no ‘small text’ size.) Arno Pro 11-point regular italic is the same font as Arno Pro 13-point regular italic, but not the same font as Arno Pro 11-point small text italic. Arno Pro 100-point regular italic would still be the same font as the 11- or 13-point version of the same design – should anybody be silly enough to blow the regular font up to that size instead of using the display version.

      Those who learned the technology and terminology of Linotype and other hot-metal machines may deplore the current terminology, but they have not a leg to stand on. The reason hot-metal type had a separate font for each point size was that each size had to be individually designed and machined – not because point size in itself is enough to differentiate one font from another.

  5. Choosing which fonts to use, while important, is only the beginning. I would say that it’s the easier part, because because there are some simple and easily understood guidelines for selecting fonts, depending on where they appear: the body of the book, headers such as chapter titles, as a title on the title page or on the cover, etc.

    More difficult is arranging the type. All too often, that’s where a DIY cover falls down. The indie in question manages to select an appropriate and attractive image for the cover and then ruins it by just slapping the type down wherever and at whatever size. A shame.

    Maybe it’s time for me to share the link to my cover design post again. It’s been a while, and the post has a bunch about arranging type, including placement and alignment.

    http://jmney-grimm.com/2012/10/cover-design-primer/

  6. Put me down for the “don’t care about typography as long as its readable” category. Actually, for work product we are very specific, because the state historic preservation division prefers a small set of fonts/styles.

    On my own, I want conventional legibility, I’m reading for content and enjoyment, not for the artfulness of the presentation. I want to be blissfully unaware of the font. Every time some typo-schmo decides that they need to change the fonts, or worse, change and lock the fonts, they GET IN THE WAY of the reading and enjoyment.

    Not that I can’t appreciate fine artsy typography, I just don’t want it on anything I have to read… keep it for the decorative art displays instead.

    TL,DR: I hate typographers for the same reason I hate UI designers. Their whole purpose is to screw up the interface to keep themselves employed…

  7. Does anyone here pay for fonts? or know of a good resource? I did a search and the results were overwhelming.

    • What are you looking for?
      Good free (creative commons) fonts or commercial fonts?
      For ebooks, website, or personal use?

      There’s a whole world of fonts out there.

    • There are many really nice free-for-commercial use fonts at Font Squirrel and DaFont. I usually go to Font Squirrel to add fonts to Photoshop/WORD. Just make sure to read the license…so as not to step on copyrighted toes.

    • I always go with MyFonts, as you can pay for the font licenses — print vs. web vs. e-book — so you know it’s all on the up and up. You can also preview swashes and look at full character sets before you buy.

  8. When I’m doing an ebook I discourage the use of embedded fonts for the body font. It’s a waste of time and file size, and sometimes the fonts don’t include all the necessary characters. Readers have their preferences. Best to let them choose.

    For print I look for a nice, rounded font family with good readability AND printability. My favorites are Garamond Premiere Pro and Adobe Caslon Pro. On those rare occasions I have to use Word to generate something, I go with either Bookman or Georgia. They print well and are easy to read in a pdf. Many fonts included with Word look wimpy and pallid in a print-on-demand book, so experiment. Create test pages, export them as pdf files and print them.

    But covers? Sky’s the limit there. Sometimes finding just the right font takes longer than actually putting the cover together. Worse than shoe shopping.

    • That used to be a bone of contention in the early days of ebooks; publishers and book designers railed against reflowable ebooks for “losing” all their formatting and typography work and consumers griping over pdfs and locked epubs that got in the way of readers controlling presentation, especially font size.

      In fact, one of the drivers behind DRM-cracking and its acceptance among honest consumers was the ability to unlock ebooks to be able to control presentation.

    • Jaye, thanks for the tips. I made a comparison between “comes with” Garamond and your Garamond Premier Pro, and it’s surprising how much difference there is. I’m definitely switching for my next books. (But I wish there were a version without the over-tall lower case “L”.)

        • Well, you’ve made me look now… 🙂

          I’ve been comparing comes-with Garamond to Garamond Premier Pro, and comes-with Baskerville Old Face with Libre Baskerville (the only one I can get temporarily for free while I look at these).

          In both cases, the “more modern” offering of what purports to be “the same thing” is instructive:

          1) Hoping for website usage not just print
          2) A lessening of the distinction between thick and thin strokes within (almost) the same letterforms, probably to create (3)
          3) A stronger overall weight and contrast
          4) And some odd issues (14.5 point in Libre Baskerville = 18 point in Baskerville Old Face and other similar fonts).

          Overall, your recommendations above make comes-with Garamond look thin and faint, if still stylish. I like the finesse of the older versions, but contrast matters… And Georgia shares much of the same weight/contrast feature with these more modern versions of classic typefaces.

          Garamond Premier Pro for me — thanks for the tip.

    • Inside for an ebook is user-configurable, so I don’t think choosing correct fonts is a real issue there.

      Book covers and promotional materials developed for the web and email are where I think this may really apply.

      • Although, I got to say, when someone clicks on SEE INSIDE when checking out an ebook for sale, I got to think it helps if it’s formatted well with nicely chosen fonts.

  9. What was old is new again.

    “For example, some fonts are more appropriate for children. When learning to read, children need highly legible fonts with generous letter shapes.”

    “Other fonts are more appropriate for seniors. Senior-friendly fonts use readable sizes, high contrasting colors, and avoid scripts and decorative styles.”

    I was once one and are now the other, and have always wished others didn’t try to impress me with the many ways they could make things harder to read.

Comments are closed.