The small matter of fonts

Let’s talk about fonts for a minute. I’m in the middle of redesign work for a couple of sites, including the Chronicle, which is going to get a facelift in a couple months. The question I have for you is this one: serifs or sans-serifs?

You font nerds out there — who also happen to read the paper online — already know that we use a font stack that looks something like this:

font-family: ‘Helvetica Neue’,Helvetica,sans-serif;

This means that the majority of our viewers on OS X will see us in some form of Helvetica since that font is installed on Apple computers out of the box. Many on Windows platforms will view us in Arial or some such sans-serif.

The stylesheet is set to give the headlines a line height of 1.125 ems, which I feel is a good line height for that font at most headline sizes. Headlines are rendered in #29527a, in case you wanted to know the precise color we use.

For me, right now, that means the top story headline on the Chronicle site winds up looking something like the picture on the left. Your browser and OS’s rendering of the headline may vary.

The real question at hand is whether to move to a serif headline font. And if so, which one to use. Most news websites out there us a serif font in some capacity, whether it’s the body text or the headlines. Serifs just make the type look newsier, and I think we’re going in that direction for the Chronicle (newsier font, that is, for all you jokers who would say that we’re headed toward newsier content).

Plus, I think a font change shows the reader that this is a significant visual update. It will cue them in to be on the lookout for other changes made to the site without us having to explicitly tell them what has changed — at least not in some sort of lightbox popup or modal dialogue or what have you.

My options for a serif font have so far been pared down to two: Georgia and PT Serif.

Georgia

Georgia is great because everybody has it already. It’s installed by default on both Windows and Macs, meaning the site’s going to look similar on both platforms. You can read all about Georgia here, including the fact that it was designed specifically for the computer screen, which makes it a very suitable typeface for digital applications.

The downsides to Georgia are that everybody uses it and that it displays numbers so that most of them hang beneath the baseline. This can look weird.

PT Serif, on the other hand, is available from Google and other online font purveyors for free. It has a little bit different feel that Georgia, and it’s a tad bit more readable at smaller sizes. Plus, it doesn’t hang the numbers beneath the baseline. (I have converted the headlines of this blog into PT Serif for the moment.)

Downsides are that it would either have to be pulled in from Google or Typekit or it would need to be embedded on the site. The first option slows down loading of the page and might hit snags on older browsers. The second option is just another thing to add to my to-do list.

So, that’s all I have to say about fonts right now. We’re going to serifs, but I don’t know exactly when or exactly which font. I welcome your input and suggestions for other potential fonts that I could look at. Leave your suggestions in the comments or get in touch with me at [email protected]

12 Replies to “The small matter of fonts”

  1. I am pleased that you care so deeply about this. It remains that your design is already one of the best going. A serif font is a likely disappointment.  The paper must present its stories quickly. That is the sole reason for sanserif fonts.

    I am delighted to learn that someone knows fonts. There used to be a tabloid called “U & Lc.” Sure wish that it were around today. There is so very much to learn!

    In the meantime, my thanks for the fine job that you do.

    1. Thanks for reading and commenting, Jack. 

      I’m not sure what you mean by serif fonts being faster than sans-serif fonts. Serif fonts are typically regarded as far more readable and scannable than sans-serifs. Could you explain? 

      Oh, and I’m not the truest font geek. Remember, we’re in the business of publishing. We have all sorts of layout people who love fonts even more than I do. In fact, I get the unlucky circumstance of being limited in which ones I can choose to use, whereas they can use any of the fonts we own since they’re being printed. 

  2. PT Serif!

    It has little curved and spatial nuances that make it more appealing visually and not as shapey/blocky as Georgia. Point in case, just look at the uppercase J and Q or PT Serif versus Georgia.

    Plus Georgia’s numbers are atrocious, that awkward looking “2” and the descenders of the other numbers is enough to drive a typographer mad. PT Serif has a common baseline and nice curves. 

  3. I am glad that serifs are coming back in — I remain convinced that they are far more readable than san-serif which has always seemed to me a classic triumph of form over function. I’m not too charmed at the idea of one more thing having to download onto my computer every time I look at the Chron on-line since I’m on a Mac so I guess my vote would be for Georgia. But have to ask, what’s wrong with Times? I’ve always found it to be the most readable way to get more type in less space.

    1. To my eye, Marjorie, Times and Times New Roman look too narrow at smaller sizes. The characters don’t have enough weight to them, and the words they spell out feel squished onto the line.

  4. Sorry, I disagree on your downsides for Georgia. I like the text figures, and the familiarity is a plus–I don’t think you want your typeface to stand out. Familiarity is also more important for reading speed than serif or sans.

    For headlines in Georgia, bold feels too heavy; let the size and color suffice to distinguish them. For body text, I find Georgia more readable than PT Serif at a given font size. 

    By the way, font nerds will want to check out the kerning game http://type.method.ac/ and the type pairing game http://www.typeconnection.com/

    1.  I don’t think we’re going to be changing the body text this time around. It’s going to stick in there with Helvetica Neue.

      Generally, I’d be agreeing with you on keeping the headlines non-bold. The problem is that when the headlines are set in Georgia and not bolded, they aren’t differentiated enough (to my eye) from the body text visible in the teases on the homepage (as one example).

      The characters at the current sizes are too skinny for the color to make much of a difference — and we are going to be sticking to that particular shade of blue for headlines. So, I’d be forced to take the font size up.

      Normally that wouldn’t be too big of a deal, except that with the news site, the heds are changed everyday. Larger font sizes can make the heads break in funny places or run to more than two lines, which doesn’t look good either. (And no, I don’t sit there at night updating every story until I’m happy with how the text breaks.)

      At any rate, I’m still very much on the fence about Georgia and PT Serif. I’m leaning toward Georgia, mostly because of the load time hit the site would take from pulling in a Google font. (It’s noticeable, even on my test pages, which have no ads on them to slow things down otherwise.)

  5. Pingback: fatcow uk review

Comments are closed.