Typography dives

Every few months one of my favourite type foundries or digital typography distributors (large or indie) will have a sale. This makes type nerds like me very happy.

Many of the high quality, expensive typefaces I have in my collection I bought on sale. So whenever there’s a chance for me to grow my collection without spending too much, I always take a good look to see what’s on offer.

Even if I don’t end up buying anything during these sales (which is what usually happens) I do end up taking a dive – sometimes a deep dive – back into the world of typography.

Screenshot of an email that reads, “Spring sale is on! Foundry-wide sales up to 75% off. March 20-26. Spring is here and our sale is blooming! Our foundry-wide sales, with 50 top foundries participating is on till tomorrow only. We’re featuring 10 top foundries every day. Let’s get straight to it! Happy shopping!”. The email is signed “ILT” (which stands for I Love Typography).

Diving into Times New Roman, of all things

Last week, for example, I ended up downloading and trying out a bunch of indie typefaces – some free, some pay-what-you-like.

One of the typefaces I came across was PT Astra Serif, which is a drop-in replacement for Times New Roman that’s been released under the SIL Open Font License (OFL).

Digital poster with “PT Astra Serif” written in big text in the centre. A line below this reads, “Regular, Italic, Bold, and Bold Italic” in regular, italic, bold, and bold italic font.

Why on earth did someone create an OFL version of Times New Roman? Especially when there are a bunch of open-license alternatives already available, like:

Well, it turns out PT Astra Serif was created for Astra Linux. That’s a secure version of the Linux operating system that the Russian Federation has been developing and deploying over several years in order to replace Microsoft Windows. And so the creation of this OS-specific typeface that will be compatible with what the rest of the world uses makes sense.

Now I don’t use Times New Roman anymore. And if I had to write a formal document that required this specific style of typeface, I already have a couple of typefaces that I would use instead.

But since PT Astra Serif was created by Paratype, a type foundry I quite like, I wondered: just how does PT Astra Serif compare to Times New Roman and my current alternatives? And thus began a fun, semi-deep dive into these Times New Roman alternatives that I will document in my next post.

So yay for typographic nerdiness, type sales, and the resulting deep dives into things that will never affect my day-to-day but are fun to explore nonetheless :)

Why the excitement?

You’re probably amused by how excited I am about finally being able to use Chaparral on this website (the typeface, not the California shrubland ecoregion the typeface is named after).

I get it. Most people aren’t typeface nerds.

So I thought I’d explain how, ever since I stopped using ‘web safe’ typefaces when I moved to the Squarespace platform in 2013, I’ve been wanting to use Chaparral for this website’s body text.

But then I realised that, instead of telling you, I could show you.

Here are all the site-header images I’ve created for insanityworks.org since I migrated it to Squarespace. Even the first header image I created was an attempt to use the closest alternative to Chaparral available at the time.

Graphic titled ‘Journey to using Chaparral on my website’. The graphic shows five site-header images that have the phrase “Insanity Works” in white text overlaid on a photo. Each of these images uses a different typeface, and most of the images have a call-out pointing to them. The first image (from 2013) uses the Coustard typeface and its call-out reads, “1. Coustard was one of the early alternatives to Chaparral that I tried (note the similarities)”. The second image (from 2014) uses Oswald and its call-out reads, “2. Switched to using Oswald (the headings typeface) instead”. The third image (from 2019) uses Merriweather Sans, but has no call-out and the typeface name as the word ‘Test’ written next to it. The fourth image (from 2019) is in Merriweather and its call-out reads, “3. Tested the sans option, but then settled on the original (serif) Merriweather”. The fifth and final image (from 2023) is in Chaparral and its call-out reads, “4. Finally able to use Chaparral!”.

Basically, this whole decade has been a journey to Chaparral. And after ten years of wanting to do something, I am finally able to do it. That is why I am so excited to be where we are now :)

Happy days!

The last twenty-four hours have been very exciting for me. At least in terms of typography.

That’s because, years and years after falling in love with the Chaparral typeface, I finally get to use it on my website! That and Myriad, which is the typeface I’m now using for the headings and navigation.

Wait. Something changed?

Before today I was using the excellent Merriweather for this website’s body text and Oswald for the headings and navigation.

Both those typefaces are free and open-source, and both are available through Google Fonts – which is the font collection you could pick from when building a site on Squarespace (the platform this website is running on).

Graphic showing two blocks of text side-by-side. The block on the left has the heading ‘Old’ and uses the Merriweather (body text) and Oswald (heading) typefaces. The block on the right has the heading ‘New’ and uses the Chaparral (body text) and Myriad Condensed (heading) typefaces.

I’d always thought about updating the typefaces on this site, but (a) I love Merriweather and (b) I didn’t want to go through the hassle of trying to see if there was anything better than Merriweather on Google Fonts.

Then last night I discovered that Squarespace now offers the full suite of Adobe Fonts to choose a typeface from, and so here we are :)

The decision about which typeface to use for headings and navigation was pretty easy too. I had a bunch of good options to choose from, like Proxima Nova, League Gothic, Brandon Grotesque, and Alternative Gothic (which both Oswald and League Gothic are reworkings of, by the way).

I ended up going with Myriad because (a) it’s a gorgeous typeface (basically a copy of Frutiger) and (b) both Myriad and Chaparral were created by Carol Twombly (in 1992 and 2000, respectively) when she was a type designer at Adobe. As you can see from the graphic above and, indeed from this website, the two pair really well.

Why is this a big deal to me?

This change in typeface is noteworthy because the only reason I started using Merriweather in the first place was because it is the closest free, high-quality alternative to Chaparral that was available on Google Fonts all those years ago. But now I get to use the typeface I wanted to use all along!

I am particularly pleased that, with just this small change, the vibe of this site has gone from “modern and sturdy, but also warm and readable” to “subtly classy, but also friendly, lively, and readable”.

Yay!  

My favourite typeface pairings

Having talked about my favourite typefaces, I figured I’d also talk about how I pair those typefaces when using them in various projects.

Here I’m talking mostly about pairing body text and heading typefaces for reading (like on websites or in PDFs) and for writing (like when writing blog posts like these in Microsoft Word).

How do you pair typefaces?

Select your body text typeface and then for the heading typeface choose between harmony and contrast…

Harmony

  • Use the same typeface and maybe pick one with a different weight (eg Regular for the body text and Extra Bold for the headings).

  • Pick a typeface from the same superfamily (eg body text in Source Sans and headings in Source Serif), though this isn’t guaranteed to be the best option in every scenario.

  • Stick to the same broad design classification, ie organic (friendly, warm, human) or mechanical (geometric, stiff, regular). Contemporary typefaces sometimes mix features so this works best with older typefaces.

  • Pick a typeface from the same type designer or type foundry. This doesn’t always work with large foundries like Linotype and Monotype, but works with smaller ones like Hoefler&Co.

  • Pick a typeface with the same mood, vibe, or feel.

Contrast

  • Pick a typeface from a different category, ie serifs with sans serif (or semi-serif).

  • Pick a neutral typeface that doesn’t change the vibe of the body text but still provides a visual difference.

  • Pick a typeface that maintains or enhances the vibe of the body text. If your body text is sharp and angular pick something equally (or even more) sharp and angular. This works best if your body text typeface has a distinct or strong character.

  • Pick a typeface that creates its own vibe if the body text you’re using is somewhat neutral, meaning it doesn’t have a distinct or strong character.

  • Pick a typeface that creates design tension. Don’t change the vibe (unless you really know what you’re doing), but you can change the feel. To use an analogy: don’t change cuisines in the middle of your meal, but you can pair something soft with something crunchy.

Whatever you do, do not pick typefaces that are only slightly different from each other. This ends up looking wrong.

(FYI, the Font Matrix is an incredibly useful concept when it comes to pairing typefaces.)

Acquiring these typefaces

I’ve included links to all the typefaces mentioned below in case you want to purchase them or download the free ones:

  • Paid typefaces are in orange with a dollar sign next to them.

  • Default or free typefaces are in blue with a Windows, Mac, or download icon next to them.

And, in case you’re wondering, the text I’m showing in the graphics below is from an anecdote I shared about a work trip to the Gold Coast ten years ago.

Serifs

TT Jenevers

TT Jenevers is one of my favourite typefaces. It works great in text but also works as a display typeface, so I usually pair it with its own Extra Bold weight. If I want an interesting contrast, I’ll pair it with Fact (a modern remake of Frutiger). But if I want something neutral, I’ll pair it with Helvetica.

Graphic showing the typeface TT Jenevers (paid) paired with TT Jenevers Extra Bold (paid), Fact (paid), and Helvetica (default on Windows and Mac).

Mercury

Mercury is designed by Hoefler&Co and I pair it with another one of their typefaces, usually in this order: Whitney (vibe = elegant, modern), Ideal Sans (vibe = warm, human), or Verlag (vibe = classic, art deco).

Graphic showing the typeface Mercury (paid) paired with Whitney (paid), Ideal Sans (paid), and Verlag (paid).

Stempel Garamond

Stempel Garamond is one of my favourite Garamonds and I usually pair it with Fact (a modern remake of Frutiger). If I want something more friendly, I’ll pair it with Gill Sans Nova (a modern remake of Gill Sans). But if I want something fancy, I’ll pair it with Jost* (a modern remake of Futura).

Graphic showing the typeface Stempel Garamond (paid) paired with Fact (paid), Gill Sans Nova (paid, but versions also available on Windows and Mac), and Jost* / Futura (free to download and default on Mac).

Charter

For Charter (which also has an ITC version) I tend to stay neutral and solid, and so I usually pair it with the Extra Bold weight of Public Sans (or Libre Franklin). If I want to be even more neutral, I go with Neue Haas Unica. Or sometimes I go with Inter (which is a remake of Roboto that’s optimised for user interfaces).

Graphic showing the typeface Charter (free to download) paired with Public Sans Extra Bold (free to download), Neue Haas Unica (paid), and Inter (free to download).

Vollkorn

Vollkorn is a down-to-earth typeface, so I don’t pair anything fancy with it – that’s why I usually go with Inter (a modern remake of Roboto) or sometimes Roboto itself. Though if I want a more lively vibe, I go for Neue Haas Unica (a friendlier version of Helvetica).

Graphic showing the typeface Vollkorn (free to download) paired with Inter (free to download), Roboto (free to download), and Neue Haas Unica (paid).

Crimson Pro

Crimson Pro is a contemporary, Garamond-inspired typeface and so I tend to match it with Fact, a contemporary Frutiger-inspired typeface. If I want something more neutral and geometric, I go with Inter (a remake of Roboto). If I want something lively, I go with Neue Haas Unica (a friendlier version of Helvetica).

Graphic showing the typeface Crimson Pro (free to download) paired with Fact (paid), Inter (free to download), and Neue Haas Unica (paid).

Source Serif

Source Serif is inspired by typefaces like Fournier and I almost never pair it with anything other than Source Sans, which is its equivalent in the Source superfamily. If I had to pair it with something else, I’d go with something neutral like Helvetica or Roboto.

Graphic showing the typeface Source Serif (free to download) paired with Source Sans (free to download), Helvetica (default on Windows and Mac), and Roboto (free to download).

Sans serifs

Ideal Sans

Ideal Sans is one of my all-time favourite typefaces. It’s from Hoefler&Co and I pair it with another one of their typefaces, usually in this order: Sentinel (vibe = classic + contemporary), Whitney (vibe = elegant, modern), or Verlag (vibe = classic, art deco).

Graphic showing the typeface Ideal Sans (paid) paired with Sentinel (paid), Whitney (paid), and Verlag (paid).

Whitney

Whitney is also one of my all-time favourite typefaces. It too is from Hoefler&Co and so I pair it with another one of their typefaces, usually in this order: Mercury (vibe = friendly, compact), Verlag (vibe = classic, art deco), or Whitney Narrow (vibe = elegant, modern).

Graphic showing the typeface Whitney (paid) paired with Mercury (paid), Verlag (paid), and Whitney Narrow (paid).

Fact

Fact is a contemporary Frutiger-inspired typeface that I like to pair with TT Jenevers (Extra Bold). If I want something more straightforward I pair it with its own Extra Bold weight. If I want something classic, I pair it with Crimson Pro, a contemporary, Garamond-inspired typeface.

Graphic showing the typeface Fact (paid) paired with TT Jenevers Extra Bold (paid), Fact Extra Bold (paid), and Crimson Pro (free to download).

Fira Sans

Fira Sans is a “wider, calmer” (and free) version of FF Meta, at least according to Erik Spiekermann who created both those typefaces. I like to pair it with TT Jenevers, a Dutch-style serif due to its asymmetrical shapes and ovals that don’t have a uniform slant angle. You’d think this pairing wouldn’t work because they both have their own strong personalities, but the modern Fira Sans works nicely with the classical TT Jenevers. If I don’t want that modern/classical contrast, then I use Merriweather instead – another modern, legible, web-first typeface with its own character. But if I want to go a little more neutral, but still highly legible, I go with General Sans (which I now use wherever I would have otherwise used Montserrat all those years ago).

Graphic showing the typeface Fira Sans (free to download) paired with TT Jenevers Extra Bold (paid), Merriweather (free to download), and General Sans (free to download).

Source Sans

Source Sans is inspired by typefaces like Franklin Gothic (Linotype have their own version of this, which they named Trade Gothic). I almost never pair it with anything other than Source Serif, which is its equivalent in the Source superfamily. If I had do pair it with something else, I’d go with a modern serif like Merriweather or Noto Serif.

Graphic showing the typeface Source Sans (free to download) paired with Source Serif (free to download), Merriweather (free to download), and Noto Serif (free to download).

General Sans

General Sans is a compact (but still readable) geometric typeface that isn’t spiky and expressive like Futura but also isn’t neutral and boring like Roboto. That said, I usually pair it with Jost*, which is a modern remake of Futura. If I want contrast, I go with the matching bigness and orderliness of Noto Serif. But if I want a more interesting contrast, I go with Gill Sans Nova, which is an old-style/geometric hybrid that’s full of character.

Graphic showing the typeface General Sans (free to download) paired with Jost* / Futura (free to download and default on Mac), Noto Serif (free to download), and Gill Sans Nova (paid, but versions also available on Windows and Mac).

Avenir Next LT

Avenir Next LT is a more versatile and fleshed-out version of the original Avenir; while Avenir itself is a more humanist take on the geometric typefaces Futura and Erbar. (I use Avenir Next LT when I want a more geometric version of Whitney but I don’t want something as sharp as Jost*.) I usually pair Avenir Next LT it with Zilla Slab, which brings a nicely contrasting futuristic vibe. If I want something more grounded, then I pair it with Sentinel. Though sometimes I find the best pairing is with Avenir Next LT itself.

Graphic showing the typeface Avenir Next LT (paid, but also included with Microsoft Office since 2019) paired with Zilla Slab (free to download), Sentinel (paid), and Avenir Next LT (paid, but also included with Microsoft Office since 2019).

Slabs

I don’t use slab serif typefaces enough to have a favourites list, but these are the three I use most often:

  • Zilla Slab, an open-source typeface from Mozilla and the one I’ve used in the headings of all the graphics above.

  • Roboto Slab, an open-source typeface from Google that I don’t use often, but is good to have when I need it.

  • Sentinel, which I’ve mentioned above but am including here for completeness’ sake.

Final thoughts

I hope the three of you who made it all the way to the end of this post found it interesting and maybe even useful :)

Since you did make it here, please comment below and tell me what your favourite typeface pairings are and what you use them for. I’d love to know.

FYI, I usually write my blog posts in Microsoft Word with body text in Ideal Sans and headings in Sentinel. But this one I wrote with body text in TT Jenevers and headings in TT Jenevers Extra Bold.

Screenshot showing the top of this blog post as it was written in Microsoft Word using the typefaces TT Jenevers for body text and TT Jenevers Extra Bold for headings.

Note: The Windows, Office, and Mac icons used in the graphics above are by ‘Pixel perfect’, ‘Pixel perfect’ and ‘Freepik’, respectively. Also, if you’re interested, these are the typefaces that come preinstalled with Microsoft Windows and Apple macOS.

4 Jan 2024 update: In the ‘Charter’ section (and the ‘Pairing serif #4: Charter’ graphic) I swapped Trade Gothic (a paid typeface that is, however, downloadable for free on Windows) with Public Sans (a free and open-source typeface).

14 Mar 2024 update: I only recently realised that Avenir Next LT has been included in Microsoft Office since 2019, so I’ve now added my favourite pairings for this typeface as well.

26 Mar 2024 update: Since I added Avernir Next LT as the seventh sans serif typeface on this list, to balance things out I added Source Serif as the seventh serif.

Journey to my favourite typefaces

I have used and played around with many, many typefaces (and their fonts) over the years. These are my current favourites.

Graphic titled ‘Typefaces I like and that I use more than others’ that shows several typefaces categorised under the headings: ‘Sans used frequently’, ‘Sans used when needed’, ‘Sans used when infrequently’, ‘Mono for text, coding apps’, ‘Mix used on our websites’, ‘Serif used frequently’, ‘Serif used when needed’, ‘Serif used when infrequently’, ‘Serif used for reading’, ‘Slab used as needed’.

How did these become my favourites?

I started, like almost everyone does, by using the default typefaces that come with operating systems and word processors.

Not long after, however, I got into typography in a big way. I bought books, did a lot of online learning, and played around with dozens of typefaces and fonts. I used to build and manage websites for a living, so this was partly professionally motivated.

Over time I upgraded to the more interesting, versatile, and practical typefaces listed above. I thought I’d take this opportunity to share some of the mini typographical journeys I took along the way.

Typeface or font?

Before we continue, there is one thing I should clarify:

  • Typeface = the design of the letterforms and accessories (ie numbers, punctuation)

  • Font = the actual item that produces the letterform, meaning everything from the 12-point piece of metal that gets inked and punched into a piece of paper all the way to the digital file that contains the code for, say, ‘Helvetica Neue Italic’.

To use a book analogy: This Is How You Lose the Time War is the typeface while its hardcover, paperback, EPUB, and PDF versions are its fonts.

Most people’s introduction to typefaces is via the fonts installed on their computer though, so non-design folks tend to use the two words interchangeably. I will not.

Mini typographical journeys

Arial: default typeface in Microsoft Word on Microsoft Windows

Graphic titled ‘Upgrading sans #1 - Arial’. The graphic contains four boxes, grouped by default/free typefaces and purchased/paid typefaces. The four featured typefaces are Arial, Avenir Next LT, Whitney, and Inter.

TOP LEFT: Arial is a well-designed and incredibly useful typeface, and I still use it every day at work (though not by choice). It is, however, a boring default that it is now considered the most neutral of typefaces.

TOP RIGHT: Once I became aware of other, more interesting typefaces, I immediately gravitated towards Avenir as the typeface I’d much rather use instead. Unfortunately, Avenir costs several hundred dollars. Fortunately, Avenir Next has been included as part of Microsoft Office since 2019 and so I now have access to a really good version of this typeface.

BOTTOM RIGHT: Not long after I fell in love with Avenir, I discovered Whitney and fell in love with that even more. Whitney is more practical and versatile than Avenir (at least for my purposes) and is also conveniently packaged for office applications (eg Word and PowerPoint). It costs a lot less than Avenir but is still a decently priced typeface. So yay for getting a bonus at work and treating myself to something nice :)

BOTTOM LEFT: More recently I came across the free and open-source typeface Inter, which is an excellent, more interesting alternative to Arial. (Inter is a version of Roboto that’s been optimised for interfaces, by the way. So a good alternative to this would be Roboto itself.)

Helvetica: default typeface in Microsoft Word on Apple Macintosh

Graphic titled ‘Upgrading sans #2 - Helvetica’. The graphic contains four boxes, grouped by default/free typefaces and purchased/paid typefaces. The four featured typefaces are Helvetica, Frutiger Next, Fact, and Inter.

TOP LEFT: Helvetica, the digitised and slightly upgraded version of Neue Haas Grotesk, is another excellent typeface. But, like Arial, it is now an overused default. (FYI Arial and Helvetica are not the same typeface. [1])

TOP RIGHT: Helvetica is used frequently for signage, but for that purpose I much prefer Frutiger. Frutiger, however, is expensive. Also, its has different revisions and interpretations, each with its own strengths and weaknesses.

BOTTOM RIGHT: Fact is an excellent typeface inspired by Frutiger that costs a lot less and is much more versatile (it has 96 styles and supports 100 languages). It is also on sale these days in case you are interested.

BOTTOM LEFT: Inter (a version of Roboto that’s been optimised for user interfaces) is a great alternative to both Helvetica and Frutiger, and it is also completely free.

Trebuchet MS: my favourite default typeface for creative uses

Graphic titled ‘Upgrading sans #3 - Trebuchet’. The graphic contains four boxes, grouped by default/free typefaces and purchased/paid typefaces. The four featured typefaces are Trebuchet MS, Montserrat, Whitney Narrow, and Ideal Sans.

TOP LEFT: With Arial and Helvetica out of the way, let’s talk about my favourite default typeface: Trebuchet MS [2]. This is a friendly sans serif font that I love to use when writing, and for the longest time it was my default email typeface. Trebuchet MS is also a “web safe font”, meaning it is universally installed across all browsers and devices. Unfortunately, it had its heyday on the web in 2009 and it is quite limited by modern font standards (its bold isn’t particularly bold, for example).

BOTTOM LEFT: Enter Fira Sans, a lovely, comprehensive, well-designed typeface that is much better than Trebuchet MS in all ways. This is my current typeface of choice when using Google Docs.

BOTTOM RIGHT: Lovely as Fira Sans is, I think Whitney Narrow is nicer. When I’m not using Google Docs, I use Whitney Narrow instead of Fira Sans.

TOP RIGHT: The one downside to Whitney Narrow is that it isn’t as rounded and friendly as Trebuchet MS, which brings us to the typeface I use most often these days: Ideal Sans. In fact, I’m writing this post in Microsoft Word using Ideal Sans right now.

Tahoma: my favourite default typeface for professional uses

Graphic titled ‘Upgrading sans #4 - Tahoma’. The graphic contains three boxes, grouped by default/free typefaces and purchased/paid typefaces. The three featured typefaces are Tahoma, Fira Sans, and DIN Next LT.

TOP LEFT: Back in the 1990s when I used Trebuchet MS for all my creative work, I used Tahoma for all my professional work. (Tahoma is basically a narrower, more tightly spaced version of Verdana.)

BOTTOM LEFT: But this too I replaced with the more friendly and full-featured Fira Sans.

BOTTOM RIGHT: In some situations, though, I use DIN. Originally created for road signage, it actually works well in text-dense designs and infographics. In fact, my resume is in DIN.

Verdana: the most legible web safe sans serif typeface

Graphic titled ‘Upgrading sans #5 - Verdana’. The graphic contains three boxes, grouped by default/free typefaces and upgraded/free typefaces. The three featured typefaces are Verdana, Open Sans, and General Sans.

TOP LEFT: Like Trebuchet MS and Tahoma, Verdana was designed as a typeface to be used on computer screens. And, like those two, it is also a core font for the web. I like Verdana. It isn’t particularly friendly or elegant, but it is my typeface of choice for email.

BOTTOM LEFT: Verdana might have been incredibly popular on the web in the 1990s and 2000s, but in the 2010s that crown was taken by the more elegant Open Sans. I like Open Sans too, but OMG is it overused.

TOP RIGHT: If I do need to use a typeface like Verdana or the excellent Montserrat – both of which are a little overused – more often than not I’ll reach for General Sans. Where Verdana is big, with perhaps an overwhelming focus on legibility, General Sans is compact and geometric, but somehow doesn’t look condensed, which I think is cool.

Calibri: the newer default typeface in Microsoft Word

Graphic titled ‘Upgrading sans #6 - Calibri’. The graphic contains three boxes, grouped by default/free typefaces and purchased/paid typefaces. The three featured typefaces are Calibri, Source Sans, and Whitney Narrow.

TOP LEFT: In 2007 Calibri replaced Times New Roman as the default typeface in Microsoft Word. I used Calibri for a while, but I never fell in love with it. After all, its defining character trait is ‘friendly neutral’. By the way, starting in 2024, Aptos will by the new default typeface in Word.

BOTTOM LEFT: Almost immediately after Source Sans was released in 2012, I started using that instead of Calibri. Source Sans is a free, high-quality typeface from Adobe.  

BOTTOM RIGHT: And once I’d bought Whitney Narrow, that took over from Source Sans in most situations.

Times New Roman: the default serif typeface in Microsoft Word

Graphic titled ‘Upgrading serif #1 - Times New Roman’. The graphic contains two boxes, grouped by default/free typefaces and upgraded/free typefaces. The two featured typefaces are Times New Roman and Source Sans.

LEFT: I’ve used Times New Roman a lot over the years and let me tell you that I do not like it very much. Sure it has its uses, but I’ve never been a fan.

RIGHT: As soon as I got my hands on Source Serif, it was all over for Times New Roman.

Garamond: a more elegant typeface that had a terrible font

Graphic titled ‘Upgrading serif #2 - Garamond’. The graphic contains two boxes, grouped by default/free typefaces and purchased/paid typefaces. The two featured typefaces are Garamond and Stempel Garamond LT.

LEFT: I love the Garamond typeface, but the Garamond font that comes with Word is terrible.

RIGHT: The Linotype foundry has an excellent version of Garamond created originally by the Stempel Type Foundry in the 1920s. I snapped up Stempel Garamond LT when it was on sale once and I’ve never looked back.

Georgia: the most legible web safe serif typeface

Graphic titled ‘Upgrading serif #3 - Georgia’. The graphic contains four boxes, grouped by default/free typefaces and purchased/paid typefaces. The four featured typefaces are Georgia, Merriweather, Charter, and Mercury.

TOP LEFT: I like Georgia. It’s not particularly elegant or refined. But like Verdana, with its focus on legibility, it gets the job done. For years my personal website used Georgia for its body text typeface.

BOTTOM LEFT: I love Merriweather. Ever since Google Fonts came on to the scene, I’ve used Merriweather for my website’s body text typeface. Indeed, that’s the typeface you’re reading this in now. [UPDATE: This is no longer true.]

TOP RIGHT: When not publishing online, I will sometimes use Charter as my Georgia replacement. Charter is older than Georgia, and it was designed by Matthew Carter, the same type designer who created both Georgia and Verdana.

BOTTOM RIGHT: When I do need a truly excellent, versatile, and highly legible serif typeface, most of the time I’ll turn to Mercury.

Honourable mentions

I haven’t talked about monospace or slab serif typefaces; this post is long enough as it is. But a couple of quick shout-outs.

Two graphics, side-by-side. One is titled ‘Graphics’ and features the Zilla Slab typeface. The other is titled ‘Coding apps’ and features the JetBrains Mono typeface.

LEFT: Zilla Slab is a free and open-source slab serif typeface created by the Mozilla Foundation. All the headings in the graphics used in this post are set in Zilla Slab.

RIGHT: JetBrains Mono is my coding typeface of choice. I blogged about this a couple of years ago.

Two graphics, side-by-side. One is titled ‘Text apps’ and features the Berkeley Mono and JetBrains Mono typefaces. The other is titled ‘Reading apps’ and features the Literata and Bookerly typefaces.

LEFT: Joplin and Notepad++ are, respectively, my note-taking and text-editing apps of choice. I use monospace typefaces in both. Berkeley Mono is gorgeous and joy to work in. It is a paid typeface, but it’s worth it (I got it on sale when it first launched). JetBrains Mono I’ve already talked about above. It is a free typeface.

RIGHT: Literata is a free and open-source typeface commissioned by Google for its Google Play Books app. Bookerly is a proprietary typeface (though available for download) commissioned by Amazon for its Amazon Kindle e-reader devices and apps.

Two graphics, side-by-side. One is titled ‘Elegant neutral’ and features the Neue Haas Unica typeface. The other is titled ‘Modern slab’ and features the Sentinel typeface.

LEFT: Neue Haas Unica is an elegant hybrid of Helvetica, Univers, and Akzidenz Grotesk. I don’t use this style of typeface very often, which is why it hasn’t come up before, but I do really like this interpretation. Also if you don’t get it as part of a bundle like I did several years ago, Neue Haas Unica is pretty expensive. Which is why it’s much easier to recommend Inter or Roboto everyone. (They’re both free!)

RIGHT: I’m not a big user of old style, Clarendon-esque typefaces, but I do like Sentinel. If nothing else, it pairs brilliantly with Ideal Sans.

Final thoughts

So there you have it. More than you probably wanted or needed to know about why I use the typefaces I do. I don’t know if you had fun reading it, but I enjoyed living it and then telling the mini stories about it. And, of course, I enjoyed creating all those typography graphics since, frankly, that’s half the fun of writing posts like this :)

One last thing I should mention is that, when I bought Whitney a long time ago, I discovered that Hoefler&Co is my favourite type foundry. The folks there created Whitney, Whitney Narrow, Ideal Sans, Sentinel, and Mercury – all of which I’ve bought over the years. I’m pretty sure I’m going to buy more of their typefaces in the future. It’s nice when you find a bunch of designers who really float your boat.

May you find the type foundries, type designers, or even just a bunch of typefaces that bring you joy.

Footnotes

[1] Many people think that Arial is a copy of Helvetica. It is not. Arial is designed to be a drop-in replacement for Helvetica, yes, but it is technically a copy of the older-than-both Akzidenz Grotesk. When Helvetica was created, the designers hoped it would be as popular as Akzidenz Grotesk. More on all that here, if you’re interested.

[2] Trebuchet MS was also inspired by Akzidenz Grotesk.

Picking a typeface for writing code

Do you have a favourite typeface for writing code? (Assuming you write code, of course.)

If not, CodingFont is a brilliant website that will help you find your preferred coding typeface — tournament style!

The process is simple and elegant: you compare code written in two popular coding typefaces side-by-side, then you pick the one you prefer. Do this over and over again and, through the process of elimination, you’re left with the coding typeface you like the most.

In my case that’s JetBrains Mono. (Though I’m also happy to code in both Fira Code and Source Code Pro.)

I love typography and have literally spent days pouring over typefaces, comparing them closely, and then picking the ones I want to use in different scenarios. Like this comparison I did when I wanted to select a typeface for all the charts and diagrams I post on this blog:

Which is why all my charts and diagrams are now in Fira Sans or Ideal Sans. (Where they used to be in DIN Next or Open Sans.)

CodingFont lets you do this type of side-by-side comparison without any of the hassle. So, if you’re a coder – or even someone who regularly uses monospaced fonts – then this is totally worth a try.

Have fun!

How to Combine Typefaces

This is an awesome write-up by Douglas Bonneville in Smashing Magazine: 

Best Practices of Combining Typefaces

Creating great typeface combinations is an art, not a science. Indeed, the beauty of typography has no borders. While there are no absolute rules to follow, it is crucial that you understand and apply some best practices when combining fonts in a design. When used with diligence and attention, these principles will always yield suitable results. Today we will take a close look at some the best practices for combining typefaces — as well as some blunders to avoid.

Yes, it's from three years ago but I recently needed to send it to someone and, while trying to look for it, realized that I hadn't actually blogged about it back then. So I'm talking about it now really just for completeness' sake :)