In this article, I’ll present 24 font stacks used by major online newspapers based in United States and in France. I’ll compare the American and European typography under this respect and, hopefully, I’ll get to some conclusion.
What are font stacks
Font stacks are lists of font family names; they live in stylesheets; their members are comma separated; their purpose in life is to prioritize the typeface choice when a browser displays a page. Generally, it is considered that a good font stack contains four elements: the ideal typeface, the alternative, the common and the generic. For instance:
This font stack will tell the browser to look into the system’s font library for Sansation; if this font isn’t installed (and it probably isn’t), the browser will look for Gil Sans; then, for Arial; finally, if the system’s font library doesn’t contain any of the specific fonts declared, it will resign and display the page using the generic sans-serif.
Implementing font stacks it’s a great usability technique. But, like any other usability feature, using it means compromise. A designer will have to review all the all the typographic versions declared in the list of typefaces and unhappily to be aware that most users will only have access to the downgraded versions of his / her work.
The survey
The initial hypothesis of this survey was that font stacks are highly dependable on a website’s niche. A website addressed to designers is more likely to use uncommon typefaces then a site addressing to a general audience; symmetrically, an online newspaper is expected to use dull and flat font stacks. Being quite sure that the hypothesis will be verified, I decided to add another hypothesis, namely that there is a difference in the use of fonts between the American and European typographical tradition (in a web environment). Anyhow, given the uniformity of resources, this difference shouldn’t be radical.
Libération
In the first instance, I’ve chosen the survey’s subjects. The selection was based on two criteria: traffic and notoriety.
American newspapers: New York Times, Washington Post, New York Post, Los Angeles Times. Daily News, The Boston Globe, Chicago Tribune, Detroit News, Boston Herald, USA Today, The Washington Times, The Philadelphia Inquirer, and The Wall Street Journal.
French newspapers alphabetically: 20 minutes. Courrier International, France Soir, L’Equipe, L’Humanité, Le Figaro, Le Monde, Le Nouvel Observateur, Le Parisien, Libération et Métro.
My main interest was to identify the general font-family declaration under the body selector. Occasionally, I was interested in the typefaces of specific elements, but I didn’t do it systematically; in many cases, headings or asides use the main family; in other cases, I was discouraged by the poor condition of the stylesheets. As a general remark, I’ve read some really bad stylesheets. Yuk.
In order to keep a neutral manner of presentation, I’ll structure the list according to the font declarations and not to the newspapers names.
The font-family declarations
Sans serif familiesArial, sans-serif: used by Le Monde and Métro;
Arial, Helvetica, sans-serif: used by Los Angeles Times, The Boston Globe, Detroit News. USA Today, The Philadelphia Inquirer, The Wall Street Journal, L’Equipe, Le Nouvel Observateur (without a general declaration under the body tag);
Arial, Helvetica, Clean, sans-serif: used by Chicago Tribune and 20 minutes;
Helvetica, Arial, sans-serif: used by The Washington Times;
Arial, Verdana, Helvetica, Tahoma, sans-serif: used by New York Post.
Arial, Verdana, Tahoma, sans-serif: used by Boston Herald;
Arial, Helvetica, Verdana, Geneva, sans-serif: used by Daily News and Le Monde;
Arial, Geneva, Helvetica, sans-serif: used by Le Parisien;
Verdana, Arial, Helvetica, sans-serif: used by Libération;
Geneva, Arial, Helvetica, sans-serif: used by L’Humanité;
“Lucida Grande”, “Lucida Sans Unicode”, sans-serif: used by Le Courrier International;
“Lucida Grande”, Verdana, Geneva, Arial, Helvetica, sans-serif: used by Le Figaro;
Serif fonts
Georgia, serif: New York Times and Le Monde (for the content);
“Trebuchet MS”, serif: France Soir;
“Georgia”, “Times New Roman”, Times, serif: The Boston Globe (font stack for the content).
Sans serif headingsArial,Verdana,sans-serif: Los Angeles Times;
Arial, sans-serif: Chicago Tribune;
Arial Black: Boston Herald;
Arial Narrow, Helvetica, Arial, san-serif: The Washington Times;
‘Trebuchet MS’, Verdana, sans-serif: Le Figaro;
Serif headings
Georgia, “Times New Roman”, Times, serif: The New York Times, Daily News, The Philadelphia Inquirer, Libération;
Georgia, serif: Chicago Tribune;
Georgia, “Century Schoolbook”, “Times New Roman”, Times, serif: The Wall Street Journal;
Other font families, used for minor elements
Tahoma, Arial, Verdana: Boston Herald;
Tahoma: The Philadelphia Inquirer;
‘Century Gothic’, Trebuchet MS: L’Equipe.
Remarks
- as you can see, most of the font stacks presented aren’t too different from the Dreamweaver defaults;
- some of them are really curious, calling first a very common typeface and then a more unusual one;
- generally, online newspapers stick to web-safe fonts;
- the French newspapers, without being more creative, are more relaxed in using fonts (we could even see some bizarre choices, such as ‘Trebuchet MS’, serif.
- none of the websites reviewed uses @font-face rules or sIFR / Cufón embedding.
Conclusion
I definitely prefer printed newspapers’ typography. The sad conclusion of this survey is that none of these online newspapers takes advantage on the benefits of font stacks. I don’t think that the web will kill the print, but, under the current circumstances, it will sure kill an awesome and secular typographical tradition.
I sometimes wonder how much did those newspapers pay for their websites design.
PS. Photo by Mark D. Martin.
Share this article