Website design is inarguably one of the most influential aspects of your company’s brand. It provides (hopefully) an interactive and engaging platform to tell more about what your company does and why that service or product is important to your target audience.

But what about the typeface?

Typefaces can be finicky. There are quite a few different types of serifs to choose from, such as Old Style, Didone, Slab, and Glyphic, among others, and it is important to choose one that fits your brand. It is also important to consider that choosing a serif typeface can also enhance readability, allowing readers to easily move through the text on the page. You have to pick the right one with the right look because typefaces convey the same emotion, sentiment, and attitude that words can — and because of that, your typeface choice can greatly impact how your users perceive your brand. Choose Comic Sans and there’s no way anyone is taking your brand seriously (unless your target audience includes young whippersnappers) — conversely, nailing your typeface choice will bring users in and keep them. Your company’s typeface choice is a telling indicator of your company’s style and personality, which is why it is critical that you choose the right typeface for your company.

Check out this list of 21 serif typefaces and how they work for brands:

21 SERIF TYPEFACES WE ADORE

1. Georgia

Serif Font: Georgia

www.alistapart.com

Juxtaposed next to a sans serif title and heading, A List Apart wisely chose Georgia for the body text. Georgia is a charming, friendly typeface that is unassuming, easy to read, and web-safe. It doesn’t compete for attention with the title, and it keeps readers moving along the page.

2. Leitura News

Serif Font: Leitura News

www.thegreatdiscontent.com

Making its debut in 2007, Leitura News is an excellent choice for body text, providing a crisp, modern spin on traditionally old-school serif typefaces. The Great Discontent uses Leitura News in the body, which is an excellent choice for a site that is inevitably text heavy.

3. Cheltenham

Serif Font: Cheltenham

www.nytimes.com

The New York Times has been using the Cheltenham family of typefaces since 2003, using various weights and variations for different parts of the online paper. When they initiated the change, the newspaper wanted to appear traditional but not old fashioned, and they also wanted to increase legibility. Mission accomplished!

4. Savoy

Serif Font: Savoy

http://www.vogue.com

The Vogue site has a lot going on, but the Savoy typeface in subheads and body copy helps keep the text from competing with bold headlines in sans serif typefaces. It’s orderly, has a sense of ornate detail (which makes sense for the fashion-focused brand), and absolutely conveys style. This is a typeface for brands focused on a stylish appearance that’s also easy on the eyes.

5. Grad

Serif Font: Grad

www.few.io

Few is a design agency that carefully interjects snippets of Grad throughout a mostly sans serif dominated design. Taking a unique approach, Few uses Grad sparingly but in bold places — including headlines and the menu. The design is elegant but bold and certainly appropriate for use as a headline.

6. Plantin

Serif Font: Plantin

www.monocle.com

Plantin is a typeface that speaks volumes about it style with its style. This serif typeface is a great pick for websites that want to convey authority, seriousness, and classic taste with each character, just as Monocle has done. Check out this font in the captions and section titles.

7. Sentinel

Serif Font: Sentinel

www.purplerockscissors.com

Dependable, hard-working, and versatile — this typeface screams it. Sentinel is a typeface that makes up for other typefaces’ shortcomings (lack of italics, for example), but it isn’t just a fixer. It’s a worker. This typeface works well as a heading and as body text; it’s legible and bold. It’s whatever you want it to be. Purple Rock Scissors uses Sentinel in their headings.

8. Adobe Caslon Pro

Serif Font: Adobe Caslon Pro

www.newyorker.com

This typeface communicates what you need it to communicate — ideal for print work and commonly used in magazines, this typeface leads readers through each article while remaining unassuming yet visually appealing. It’s a typeface that quietly says, “Hey, read me. I’m a credible source.” The New Yorker uses this typeface predominantly in the body copy throughout the site.

9. Guardian

Serif Font: Guardian

www.theguardian.com

Guardian is a typeface choice that provides an extensive character set that works in small sizes and text heavy areas. An excellent choice for newspapers or magazines, this typeface makes it comfortable for readers to consumer large chunks of information at a time. The Guardian has really committed to this  typeface. It is used through its entire site.

10. Eames Century Modern

Serif Font: Eames

www.nexttomestudios.com

Eames Century Modern is refined, practical, and easygoing. It doesn’t compete for attention; instead, it works with layouts and design. Next To Me Studios puts Eames to work in both the headline and body copy, adding easy-to-read finesse and style.

11. Parkinson

Serif Font: Parkinson

www.rollingstone.com

Rolling Stone is an iconic magazine that needs an iconic typeface, and that’s where Parkinson comes in — used in headlines to contrast the sans serif subheads and in the body copy. Stylistically, the typeface speaks rock and roll, but its practical use as a magazine typeface is overtly apparent. It’s easy to read and works well in large blocks of texts.

12. Stanley

Serif Font: Stanley

www.stjameslondon.co.uk

Inspired by the New York Times and named for its creator, Stanley’s angular serifs provide a modern and fashionable look for the London publication St. James. At larger sizes, as a headline, the poster weight makes a big statement, while the angles become subtle almost upscale editorial at subhead weights.

13. Freight Text Pro

Serif Font: Freight Text Pro

www.medium.com

Freight Text Pro is highly adaptable and offers options within the typeface family for varying degrees of intensity. On Medium, Freight Text Pro is used in the byline and in the body copy.  It’s a typeface that goes with the flow in a way that works for designers and websites alike.

14. Exchange

Serif Font: Exchange

www.wired.com

Exchange is easy to read and easily recognizable as the Wall Street Journal’s print typeface of choice. It gets down to business for business folks. You can also see Exchange getting down to business on Wired.com.

15. Zizou Slab

Serif Font: Zizou

www.fastcodesign.com

Simple and effective, Zizou Slab works well in modern designs, despite having a conventional origin and classic look. Fast Company exclusively uses this traditional serif typeface as a means to convey information on current and innovative business trends throughout the body copy of the site.

16. PT Serif

Serif Font: PT Serif

www.the-american-interest.com

Functional with a nice aesthetic appeal, PT Serif is a practical typeface that has just the right amount of flair — not too fancy, not too boring. The American Interest uses this typeface in subheadings and in the body copy, letting readers flow through the copy on their site.

17. FF Meta Serif Web Pro

Serif Font: FF Meta

www.trentwalton.com

FF Meta is a typeface with gusto! This is a contemporary serif typeface that has a multitude of uses from smaller paragraph type to headings. Trent Walton uses this typeface everywhere.

18. Harriet

Serif Font: Harriet

www.thedissolve.com

Harriet is a working typeface that incorporates both romantic, traditional style and contemporary capabilities. The Dissolve is an example that combines both styles effortlessly with its typeface choices, and specifically so by using Harriet in headings and in body copy.

19. Jubilat

Serif Font: Jubilat

www.stuffandnonsense.co.uk

With a business brand like Stuff and Nonsense, using Jubilat couldn’t have been a better choice. It’s a whimsical typeface that still maintains a practical sensibility.

20. Skolar

Serif Font: Skolar

www.elliotjaystocks.com

Skolar is for scholars, obviously. It’s a powerful typeface that practically reeks of a library — the typeface is classic, refined, and inconspicuous, allowing users to truly take in the information they have been presented. Elliot Jay Stocks, who is kind of a big deal, uses this typeface for all the copy on his site, like a genius. I’m not sure if it’s the typeface or his impressive resume, but something makes me like this guy and his site.

21. Adelle

Serif Font: Adelle

www.happycog.com

Adelle is a multi-purpose typeface that works exceptionally well in large blocks of continuous text, as evidenced in the Happy Cog site’s body copy. It allows readers to read the text without being interrupted by the typeface’s style — this typeface is pretty subdued but still has classic character.

SERIF FONTS ARE SPECTACULAR!

Serif typefaces are a fantastic functional choice. They can be easier to read than their sans serif counterparts (both on screen, thanks to improved visibility, and in print), and they often convey a sense of traditionalism or classic style appeal. We found these typefaces to truly have their own style and place in the serif world.

What do you think — did we miss any?

Comments
  • What about vintage fonts? sites like agence-belle-epoque.fr, deluxejoulu.fi, or goglazed.com that want to preserve a vintage design, use fonts that mimic the hand writing.
    However, by far my favourite font from your list is FF Meta Serif Web Pro, it’s probably the most easy to read and doesn’t bother my eyes if I read for a long time.
    Nevertheless, font is important, but you can’t compensate with font if you don’t have style in writing.

  • Great list! It’s always a struggle trying to find that right font pairing to complete a design and without it the design never feels quiet right!

  • RubyJewelHeart

    Esmeralda Pro

  • Becky

    What serif font was used for the text here about the various serif fonts?

    • Al Boulley

      Mercury ScreenSmart.

  • Brooke S.

    Source Serif Pro is another solid choice!

  • BirdyDIY

    Everyone here missed the Lyon Typeface by Kai bernau