Page titles on news article pages

Written by Adrian Holovaty on October 25, 2002

Ben e-mailed me a slew of questions regarding page titles on news article pages. (Page titles are the words displayed in the browser window's titlebar and in most search results). I'll attempt to tackle Ben's questions here and try to figure out a "best practice" for news sites to follow. Of course, feel free to chip in by posting a comment below.

First, here's my philosophy on exactly what titles on news sites should accomplish: A good news article page title succinctly explains the page's content -- and how that content fits into the big picture of the site.

So how can we accomplish this? First, let's look at what sites are already doing. Here are a number of different approaches, with a few example titles:

Headline only

Site name, headline

Site name, section, headline

  • boston.com/globe
    Boston Globe Online / Metro | Region / 5 candidates spar over gun control, taxes, housing
  • boston.com
    Boston.com / Latest News / Nation
  • villagevoice.com
    The Village Voice: Nation: Mondo Washington: Uncle Sam's Crude Solution by James Ridgeway
  • ajc.com
    ajc.com | News | Sniper suspects arrested
  • guardian.co.uk
    Guardian Unlimited | World Latest | Prosecutors Confer on Sniper Charges
  • news.bbc.co.uk
    BBC NEWS | Americas | Prosecutors prepare sniper charges

Headline, site name

Site name, headline, date

  • cnn.com
    CNN.com - Alabama police to seek death penalty for sniper suspects - Oct. 25, 2002

Site name, date, headline

Print publication name, site name, headline

  • sacbee.com
    The Sacramento Bee -- sacbee.com -- Prosecutors prepare case against sniper suspects; Alabama seeks death penalty

Whew. Not too much consistency throughout the industry. So which approach is best? Let's tackle the pieces of information one at a time:

Site name

Think about this from a user's perspective.

Say you bookmark a few New York Times articles about the sniper shootings. Then you bookmark a few articles on the same topic from the Washington Post, and a few others from USA Today and the BBC.

Now let's say it's a day later, and you'd like to go back to a particular one of those stories. Will it be easier to remember the story by its headline, or by its publication name? (Keep in mind these are all articles on the same topic, so it's likely they'll have similar headlines.)

I'm betting you'll remember the story by publication. A headline alone most likely wouldn't be enough to remind you which bookmark link to click.

Same goes for search results from an external search engine; a site name in the title gives extra context to a search result. It's not only good branding; it also helps give weight and credibility to a particular search result by disclosing the publication's name upfront.

Verdict: Yes, include it.

Site section

It may make sense from a navigational standpoint, but I think sections are better left out. If a headline is descriptive enough, the section is redundant.

Verdict: No, don't include it.

Date

Because the date (e.g., timeliness) is such an important part of a news story, I venture to say yes. But page titles can only be so long before they get unwieldy. For that reason, I'd advise to leave dates out.

An exception: Dates that are fundamentally tied to content. For example, something like a "Quote of the day" page. It wouldn't make sense to put the quote itself in the page title; rather, the date would work well.

Verdict: No, don't include it -- unless absolutely necessary.

Name of print publication

As I mention above, sacbee.com does this. I think it's redundant and a waste of precious title space. If a page's title already includes the site's name, there's absolutely no logical reason to include the print publication's name as well.

Verdict: No, no, no! Avoid this, as long as the page title already includes the site name.

Priorities

So, how does this fit together? I've determined all that really needs to be included in a news site's title page is the site name and headline. But which is more important?

For the answer to this question, look no further than Jakob Nielsen's "Marginalia of Web Design" and "Microcontent: How to Write Headlines, Page Titles, and Subject Lines." A snippet from the latter:

Make the first word an important, information-carrying one. Results in better position in alphabetized lists and facilitates scanning. For example, start with the name of the company, person, or concept discussed in an article.

Do not make all page titles start with the same word: they will be hard to differentiate when scanning a list. Move common markers toward the end of the line. For example, the title of this page is Microcontent: Headlines and Subject Lines (Alertbox Sept. 1998).

With that in mind, it appears the best solution is "headline, site name" -- the technique used by washingtonpost.com. That lets users scan a list of titles easily while retaining the site's name for purposes of branding and familiarity.

Before I finish, a few more points...

Internal search engines

One of Ben's questions was whether to optimize page titles for internal or external search engines. My answer: Do both. Optimize titles for external search engines, such as Google, but display just the headline for an internal search engine. After all, a decent configurable internal search engine should be able to display whatever you want.

An example of this technique is this very site. Results from my own search engine display blog entry headlines, while page titles are preceded with "holovaty.com." (Note that I'll be changing my site's title scheme shortly, in the spirit of following my own guidelines.)

Multi-page articles

It's important to differentiate page titles when an article is spread over more than one page. For an example of what not to do, check out this article:

Each part of the article has the same page title. It'd be better if the page number was included in the title.

Punctuation / character separators

Ben asks: "Is it bad to use hyphens or colons as separators since those often get used in story titles or archive pages?"

Excellent question. Here's a particularly exaggerated example of colon misuse:

Maneater: Steve Lippo: MU halftime: a grand tradition

I made that site's CMS, so, naturally, I'm super-qualified to pick on it. The site inserts "Maneater:" at the start of every article's title. For columns, it also inserts the columnist's name, along with another colon. Thus, when there's a colon in the headline, too, the amount of colons gets just plain silly. It becomes difficult to scan and hard to tell where the real headline begins. In hindsight, a better organization for this particular headline would be:

MU halftime: a grand tradition [Maneater]

I opted to use brackets instead of parentheses because parentheses tend to imply a relationship, while brackets are a bit more distant. Let's say I write an article about my favorite Web site, google.com, and it appears on cnn.com with the headline "My favorite Web site." With parentheses, following my guideline above would yield:

My favorite Web site (cnn.com)

The parentheses and word placement might lead a casual browser to believe my favorite Web site is cnn.com, when, in actuality, the article is about Google and happens to be published on cnn.com. See the distinction? Brackets imply less of a relationship:

My favorite Web site [cnn.com]

A pipe ( | ) could also be used. I'd like to hear some opinions on which character(s) is/are best.

Non-story pages

All my comments here apply only to story pages. Other pages, like news sites' home pages, are a whole different story. I'll tackle that issue in the future.

Comments

Posted by Ben on October 25, 2002, at 7:13 p.m.:

Well, you came to most of the same conclusions that I had on my own, but I would like to see any discussion to the contrary.

I am opting for the "Site Name: Headline" approach, because I think it works particularly will when it is small, such as the IHT. I would not do so if I were the Washington Post.

I've never seen (and probably won't ever see) an alphabetical list of news stories, and I think with such a small site name header, you don't lose much (if anything) in the realm of scanning headlines.

Posted by Anil on October 25, 2002, at 9:38 p.m.:

I'd have to make a tepid argument for section names, not because my employer uses them (our titles are so dysfunctional as to be useless much of the time) but because most websites use the "clever" print hed for a story, and the topic might be unclear without an explanatory subhed. That clarification can be provided by the section information.

Of course, the inscrutability of cleverness might be more of an issue for a weekly than a daily, since dailies trend towards much more functional and clear heds.

Posted by Julie on October 26, 2002, at 12:36 a.m.:

I'll throw in a second on both points. I think a brief (no sense using 'latest news' when 'news' will do) section name is very useful for providing context.

And I would put the site name first for two reasons. First, if you do include the section name, it helps give users a sense of the site's navigational structure. Second, putting a site name at the end only helps users distinguish between titles if they have bookmarked/are viewing many titles from the same site. I more often end up trying to distinguish bewteen titles from many different sources so having the site name first is extremely important. Plus, as you said, people will more likely remember a story by publication than by headline.

So my own recommendation would be.... site name | section | headline ...and I think either colons or pipes are fine but my own preference is for the pipe because it's cleaner visually (one single 'image' forming the symbol, not two).

I'm also a fan of short, keyword type headlines (ex. 'Sniper suspects arrested' not 'Arrests bring end to sniper slayings')... though I've heard pretty decent arguments for using the same wording as the story head.

Posted by Jackson on October 26, 2002, at 10:44 a.m.:

As a rabid bookmarker, I would prefer the TITLE (SITE) or TITLE [SITE] versions. As you mentioned, the most important thing is the topic (which can *hopefully* be gleaned from the title), but I also want to know where it came from.

I would agree that section names can be useful to provide context, but can become unwieldy if you aren't careful. For instance, if I navigate into a site like home->sports->baseball then the page title might be something gross like "localnews.com | sports | baseball | Why the heck can't the cubs win?". When I bookmark that page, it will probably be truncated in my bookmark drop-down to the point where I can't see the article title.

One solution would be to use only one section, maybe the top-most one, but I have a small problem with that too. By showing only one section, I confuse the structure of the site. If the page title is "localnews.com | sports | Why the heck can't the cubs win?" it looks like I coule navigate home->sports from localnews.com and find my article.

Posted by Ben on October 26, 2002, at 2:30 p.m.:

The issues that I have with having section names in titles:

1. The bookmark becomes unwieldy or gets cut off.

2. I question whether or not it really is helpful to the user. Does the browser title really help you understand a site's structure? Does it really help to know a news site's structure, especially when it's in static text in the title bar? I would say that issue should be solved by the page that shows up (with your headers, navigation, breadcrumbs, etc.) The topic of the article a user is looking for/at is also common knowledge. A user knows a Cubs story is in sports. But this leads me to my biggest issue...

3. Using hard categories to denote a particular story makes a story on the web adhere to the shortcomings of print. What is different and great about the web is that you don't *have* to find a permanent spot for something to fill a designated amount of printed pages.

Why is a story about the state's legislature debating about a sports stadium and ownership particularly a sports issue? Or an economics issue? Or a politics issue? I might have to comb through 3 sections of a newspaper to find the article I'm looking for. If a web site is based off that same mentality, I'll have the same problem finding the story.

So using the theory that stories should have no set category, the article could appear in multiple categories on the web site. If that is the case, I would not include the section in the title, because there would be multiple entry points. Someone who came in from "Door #2" and saw the article was labelled as "Door #1" would be confused.

That all make sense?

Posted by Nathan on October 26, 2002, at 4:06 p.m.:

First, I cannot agree strongly enough with putting the headline first, rather than the site name. Unlike Jackson, I am not a rabid bookmarker. But I am a rabid multiple-window-opener, and that justification for making, in Nielsen's words, "the first word an important, information-carrying one" hasn't been mentioned yet. Right now I have four browser windows open. Only the first two or three words of each browser window's page title are visible in the limited space on my Windows taskbar. In other words, if I open up three different stories from, say, boston.com, I won't be able to tell which window is which. If I have several stories from washingtonpost.com open, no problem.

Personally, I don't think section names are very necessary in news. But I would put "editorial" or "letter" or whatever on the page title of everything in my opinion section.

I agree with Julie that the page title headline should be rewritten to be short and snappy if the regular headline inside the page is wordy or doesn't put the main idea first or, as Anil mentions, is too "clever". Some examples of that: "Fright factor" or "Brother to brother," to steal a few from a Knight Ridder site today. Those just don't work on the Web.

Posted by Nathan on October 26, 2002, at 4:23 p.m.:

I forgot to mention this in my first comment: There are some sites that don't even use the headline at all. Unfortunately, the site I work for is also in this category.

Posted by Shayne on October 26, 2002, at 4:55 p.m.:

So far, my vote is leaning to Title | Site Name. It's efficient and makes sense. I would also like to suggest using abbreviated/shorter site names, if only to cut down on lengthy bookmarks.

The New York Times

nytimes.com

NYT

On internal search engines, it's not too difficult to fix the problem of returning results that don't follow this convention. The search engine displays the headline as a result, rather than the title tag. However, on Blogdex, Daypop, Google and other search engines, I prefer results to follow this structure:

NYTimes | At Least 67 Hostages and 34 Militants Are Dead After Raid

When I'm scanning through a list of search result headlines, this let's me immediately chunk the content by source, then by content. Perhaps this is because it's what I'm most familiar with looking at. It's almost a default standard. Most sites that do include their name in the title, put it first.

Pioneer Press | 10/25/2002 | Sen. Paul Wellstone killed in plane crash

BBC NEWS | Entertainment | Film | Actor Richard Harris dies

CNN.com - Senator, family members killed in Minnesota plane crash - Oct. 25, 2002

Wired News: Implantable Chip, On Sale Now

I'm not saying this makes it right, or that it's the best to do. It's just an existing convention. Now that I think about it, I think the date may be important to have in the title.

CNN | Senator, family members killed in Minnesota plane crash | 10.25.02

That's efficient as hell, and a ton of info. Might be worth the hassle to bookmarks, considering how many page views are driven to news sites via the network.

For the record: I've always preferred the bar | or pipe as a divider. I also like using the guillemets, which we are currently using on our blog:

Hypergene MediaBlog » Yes, weblogs are relevant news media.

Because of this conversation, we're going to revise our title conventions. Thanks Adrian....

Posted by Julie on October 27, 2002, at 1:14 p.m.:

I agree that including the section is not a good idea IF a site is using a dynamic CMS to present stories, but at this point (I believe) static HTML is still much more common and therefore a story IS tied to a specific section regardless of how many it could fit into and for that very reason I think it is helpful to have the section. (Though in the spirit of 'maybe the industry will move to more dynamic standards' I'd be willing to lose the section.) Anyway, I agree it's the job of the actual page navigation to let users understand a site's structure once you're on a page but I personally like being able to get the context of a story by looking at the bookmark.

And I think that's the key issue to note here. I "personally" like it that way. We're all basing our opinions on how WE use the Web and trying to infer that to the population at large. The problems with that are obvious. There are only a handful of us. I think it's safe to say no one participating here fits the "average" user profile. With just the seven who've posted thus far we have a pretty divergent group of opinions on how we like to use titles. To make my point, like Nathan, I also am a "rabid window opener" but in my own use I typically have open windows for many different sites and as strongly as he feels that the title should go first, I need the site name first for my purposes. To get the "right" answer we'd really have to determine how MOST people use/view titles most of the time.

Posted by Ben on October 27, 2002, at 9:38 p.m.:

I found an interesting tidbit to add into the discussion from Three dramatic readings on screen reader accessibility. It is for links in a navbar, but may be true for titles, since they are also read by a screen reader.

BEGIN SNIPPET

Go Fetch | Tips from Matty | Dog Stories | About the Program

The nav bar would be read like this: "Go fetch vertical bar tips from matty vertical bar dog stories vertical bar about the program." You'd think it'd be annoying to hear "vertical bar" over and over again, but vertical bars are the preferred way to demarcate links in a nav bar because:

-they're not used for other things

-they're printable (they show up on braille readers)

-they're not punctuation (so the screen reader doesn't skip over them if it's set to ignore punctuation.)

END SNIPPET

Does the answer for what separator to use lie in the way it is read by a screen reader?

Posted by Nathan on October 27, 2002, at 10:51 p.m.:

Julie, you make a really great point I hadn't realized about how this is such a personal thing and conclude that we need some kind of most-of-the-people, most-of-the-time format.

Perhaps sites need some kind of title-format preference stored in a cookie or something, with rewriting of the page title to your particular preference in a CMS or via JavaScript (requires something better than Netscape 4). But that would require storing a preference on tons of different sites.

Maybe sites could store metadata (e.g. <meta name="headline" content="Senator, family members killed in Minnesota plane crash">, etc.) and browsers could assemble that on the fly into a window title based on preferences stored within the browser?

Posted by Joel Abrams on October 28, 2002, at 12:59 p.m.:

At the Christian Science Monitor, we came up with a good workaround to having the site title in each story in the results list of the internal search engine. Each story has an extra metatag with the title for use by the search engine. It's spit out automatically by the CMS.

Posted by Carl on October 28, 2002, at 2:10 p.m.:

Cutesy titles can be a problem, as was mentioned in an earlier comment. Which makes me wonder is we are confusing two very different things. A "Story Title" is not necessarily a "Description Title."

Personally, the whole idea of putting article names, the story title, in as the description is wrong from the start. I don't want to read a line of fluff and guess what it means. I want a clear description.

Story titles are story titles. Their purpose is to grab attention, build interest and/or curiousity. They are NOT developed to be informative for the most part - in fact, the more informative titles can at times be a sign of a title that's not doing it's job, or the mark of an amateur headline-writer.

To make a story line the same as the the descriptive line makes about as much sense as buying one size of shoes for two different-sized children, figuring it'll be "close enough."

But the reality is that, if a title is good at ONE job, it may be therefore totally unsuited for the other job. Titles are not all alike, and I think they should be used only for the purpose they were crafted for.

Descriptions are descriptions, not aimed at creating interest and curiousity. Put them in searches and titles, where boring can be spelled "useful."

Story Title: The One CEO who doesn't deserve to be canned. (Real informative, huh?)

Descriptive Title: Case study of the integrity of Jimmy Jobob, president of XYZ Corp. (Useful, no fluff, clear as to WHAT the article is - case study - who it is about, etc.)

Sometimes articles are written with a cutesy title but a descriptive sub-title, and that would do the job in many cases. If not, it takes a whopping 10 seconds to write one.

Any thoughts?

Posted by Adrian on October 28, 2002, at 11:49 p.m.:

Things I've decided/realized since reading all these great comments...

Vertical bars (pipes) are the best separators. They're clean, and they won't be confused with content (as parentesis could be). Plus, as Ben pointed out, there's the screen-reader benefit.

News producers would do well to write special "description titles" (in Carl's words) -- as opposed to "story titles" -- that succinctly describe the gist of the story. Using a story's headline for the page's title isn't necessarily a good strategy, because many headlines are deliberately vague. I have a feeling, though, that many news sites are stuck using headlines because their content-management systems don't allow for a dedicated "title." This is definitely something people on the market for a new CMS should consider.

Nathan's suggestion that browsers should enable users to set a preference for title format is interesting, and in a way it's the perfect solution. Unfortunately, I don't think it'll happen, because there's just not enough interest.

Posted by Stuart on October 29, 2002, at 7:14 a.m.:

I agree with Carl's point about the difference between an eye-catching article title/headline, and a descriptive page title. I recently read a great article in print edition of The Guardian, which I later attempted to locate online so that I could link to it on my blog. The title of the piece was "American dreams", which is about as undescriptive as you can get (the piece is actually a profile of the writer Paul Auster). When I tried to locate the piece at The Guardian's website, I'd forgoten the title so I searched for "Paul Auster". I didn't find what I wanted, but this, sadly, is not unusual for this particular site (great content, if only you can find it). I ended up clicking on the top search result for "Paul Auster" and found a link to the article I was looking for in a list of related links. The actual title of the page as it exists online is "Guardian Unlimited Books | By genre | American dreams". I read it in the regular 'profile' section in the Guardian Review (print edition), so I would expect to see a HTML title something along the lines of "Guardian | Books | Profile: Paul Auster". The "Books | By genre" bit in the actual title is, in my opinion, very misleading; nothing in the title indicates a genre - the piece itself is a profile of a writer - not a review of one of his works, and as Carl would argue, "Amercian Dreams" tells me nothing at all about what the piece is actually about. I like the pipes though! ;-)

Posted by francois on October 31, 2002, at 10:32 a.m.:

Some periodicals have both "description titles" and "story" titles, a convention that retains the strength of both. The example that I had in mind is the Economist, and looking at their online edition now, I see they use this convention very effectively. The homepage contains news headlines, with the descriptive titles big, subtitled with the story title: "Israel's government collapses -- So much for national unity -- Oct 31st 2002". The article page is headed very prominently by the story title -- "So much for national unity" -- and the descriptive title is only used in the <title>: "Economist.com | Israel's government collapses." This is in my opinion a very strong argument for having both, which can be a difficult point to argue with corporate website editors. (I believe corporate online publishing can learn a lot from news publishing.)

I'm having some trouble guessing what economist.com's search engine results are displaying, though. It looks suspiciously like two story titles, or possibly story title + truncated summary. The descriptive title would've been much more helpful.

Posted by kirkaracha on November 21, 2002, at 4:04 p.m.:

I'd use cutesy title + descriptive subtitle as the page title. I'd be confused if I selected a link from my bookmarks and the visible title on the page was different than the title in the bookmark.

I would use the title of the publication, not the name of the web site. nytimes.com is "The New York Times online," not a separate entity.

I also prefer not to use pipes as separators in the title because they imply equivalency betweent the items they separate, and it's more common that the relationship is a sequence or a hierarchy. And I'd use brackets over parentheses because brackets indicate editorial comment or meta-information.

Posted by Rich on December 10, 2002, at 11:51 a.m.:

As extolled in an excellent Evolt article on the subject, I tend to go for title followed by site name followed by section. With my current punctuation, the title would look like:

"Brown is the new grey - clagnut/blog"

"Brighton - clagnut/photos"

In terms of punctuation, perhaps a pipe instead of the dash might be better?

"Brown is the new grey | clagnut/blog"

"Brighton | clagnut/photos"

I appreciate my titles could be more verbose and meaningful, although the inclusion of the section name adds some context to the terse titling.

Posted by Dan T. on January 14, 2003, at 3:39 p.m.:

I have some discussion of titles in my site.

Posted by Pete on November 7, 2004, at 10:34 a.m.:

Excellent article. I have recorded some screen reader output for various separator characters which you may find helpful.

It also gives you some insight into why the right double angle bracket character may be a bad choice.

Comments have been turned off for this page.