Headline Size on News Homepages
Most news website homepages have a set font size for headlines. (Only a small percentage of sites allow users to specify the type size they see.) In Eyetrack III, we tested how headline size affected viewing patterns. The findings below may help you in designing or redesigning your website for readability and comprehension of information.

Finding: Smaller headlines integrated with blurb text resulted in participants scrolling further down the page.

For this piece of our research, we created two news homepages (and accompanying "inside" or article pages) that shared the same design but differed in one principal characteristic: headline size. In homepage No. 3 (below; click to enlarge), article headlines were smaller and on the same line as a short blurb. In homepage No. 8, headlines were larger and on a separate line from the blurb; the headlines also included a hyperlink underline to highlight them. One-half of our test participants viewed one of the pages; the other half viewed the other page.

Homepage No. 3

Homepage No. 8

What we found was that aggregate viewing went further down the page on the version with smaller headline type -- that is, those users saw more of the page. Seventy percent of test subjects viewing that page scrolled down the page, vs. only 59 percent who scrolled down on the page with large-format headlines -- a statistically significant difference. This occurred despite there being a similar number of clicks on the first 10 headlines of each page. You can see this on the heatmap images below. (A heatmap is an aggregate image showing overall eye activity on a webpage. Red-orange areas indicate the most eye activity, blue-black the least.)

Small-headlines homepage

Large-headlines homepage

Participants who saw the larger-headlines page (homepage No. 8) spent more time with the navigation elements on the page. The researchers speculate that this could reflect that users on the larger-headlines page where less satisfied (perhaps because they skimmed more and missed content that small-headlines visitors found). It could be for this reason that large-headline visitors looked to the navigation for more information. (This is just an observation, and not a rigorously tested finding.)

In this case, the navigation was in the right column. They also saw less of the page than did the group that was given the smaller-headlines page to review.

Finding: Smaller headlines support users seeing and reading more text.

Researchers noticed that on homepage No. 8 (larger underlined headlines), people treated the headlines as separate units. They tended to look at just the headlines and ignore the blurbs (which were on a separate line on this homepage).

In contrast, the small headlines that blended in with the blurbs (on homepage No. 3) tended to attract more viewing and reading over the entire headline and blurb block of text.

That is, the stand-alone blurbs (which appeared on a separate line below the headline link) were ignored more often; the small headlines integrated with blurbs tended to be viewed more as a package.

The size and treatment of homepage headlines, then, had an unexpected impact on overall viewing of the page. In homepage No. 3 where the headline font was small and the headlines blended in with the blurbs, the headline/blurb combination was viewed more completely.

Finding: "Hot" words can catch the eye of skimmers.

An interesting finding comes from homepage No. 8, which had larger headlines on a separate line from the blurbs. As noted above, this page encouraged more skimming behavior. Toward the bottom of this (rather lengthy) page is this headline: "FCUK: Innocent Label or Thinly Disguised Profanity?"

The provocative word "FCUK" (the controversial name of a clothing line) is something that obviously catches the eye. As seen on the heatmap image of homepage No. 8, that word caught a lot more eyes than anything else that far down the page. This observation suggests that a large percentage of people looking at this page were scanning, looking for something that would grab their attention. In this case, FCUK was both surprising and in all capital letters, resulting in a visual discontinuity with surrounding content.

The same hot spot can be seen on homepage No. 3, which had smaller headlines integrated with blurbs. That page also shows more intense viewing throughout the page; the "FCUK" attention-grabber is more pronounced on the larger-headlines page where there's more scanning behavior.

Observation: There seems to be a "dip" in reading the full length of titles at the bottom of the first screen (and subsequent screens) on small-headline pages.

On homepage No. 3 -- the one with small headlines integrated into blurbs -- we noticed that there was less viewing on headlines that fell at the bottom of the first screen. The same thing happened with subsequent screenfuls as people moved down this fairly long page in chunks, each time exhibiting less viewing at the bottom of the screen.

These intervals appear to correspond to the bottom of the screen had the test subjects moved down the page one full screen at a time. In other words, more of them clicked the scroll bar to move down the page a chunk at a time (or hit the "Page Down" key) than slowly scrolled down the page. The image below demonstrates this behavior; notice the bright spots on the heatmap well down the page.

Finding: Large headlines may make it easy to read a homepage (perhaps "too easy").

While large headlines make it easy for an audience to scan your homepage seeking something of interest, there's a downside to that: They may miss much of the other information you put on the page.

Tips

• When headlines stand out alone by virtue of larger font size and/or by being on a separate line from a blurb, people tend to read the headline and ignore the blurb. It may make more sense, if you want readers to see blurbs on homepages, to have the headline and blurb run together.
• The testers on the homepage with larger headlines appeared to do more skimming or spot-checking than they did reading. Larger headlines seem to encourage readers to skip blurbs and easily scan down the page. So, the headline size you use may depend, in part, on what you want your homepage to do for readers. Do you have serious, thoughtful readers who you want to absorb all the information you put on your homepage? Or do you have readers who you expect to quickly scan your homepage? The decision you make on headline size may depend upon your audience and strategy.
• Be aware that certain words or phrases in headlines can draw lots of eyeballs -- which might be useful in drawing attention to other content elements, if you place them in proximity to predicted hot spots.

Add/view feedback on this report