Regional Newspaper Website Design (originally published in Internet Media Review)

09/12/2006 01:13 PMRegional Newspaper Website Design

of 20http://www.mequodalibrary.com/cgi-bin/udt/im.display.printable?client_id=internetmediareview&story_id=60

Regional Newspaper Website Design

October 19, 2004 By Roxanne O'Connell,with Kim Mateus

View in PDF Format

Better homepage design can lead to more print subscriptions and happier, more satisfied, readers. A webdesigner turned direct marketer turned usability specialist looked at the companion websites of 10 top regionalnewspapers to see what they're doing right... and what could be improved. The main problem with thewebsite design practices of regional newspapers is that they fail to maximize their brand. In the switch to dot-com, a good majority of the newspapers we studied turned their brand over to "theircity.com," i.e.,"philly.com, boston.com." Only four of the ten newspaper sites we reviewed displayed their print mastheadalong the top of their website.

We closely examined ten regional daily newspaper companion websites, focusing on the homepage and sometypical user tasks. We conducted a series of expert usability reviews and actual user tests to determine whatwe believe to be the top ten "Best Practices" for homepage web design in the regional newspaper market. Theten best practices we studied were brand integrity, strategic intent, persistent/consistent navigation, taskdepth, affordance, labeling and language, content density, organization (marketing quadrants), load time andaesthetics.

We chose the companion websites of ten top regional newspapers that we felt reflected a broad cross-sectionof geography.

The chart below demonstrates how the newspapers rank in terms of print circulation.

Circulation andAudience Reach

PRINT ONLINE Library Points

Paid CirculationReach per

million usersPage ViewRanking*

AveragePage Viewsper Person

The New York Times 1,113,000 4920 150 3.7 88

Los Angeles Times 925,135 870 1250 2.8 82

The Washington Post 746,724 2400 385 3.4 88

Chicago Tribune 679,327 607 1607 3.7 82

Houston Chronicle 552,052 493 2540 2.4 75

The Boston Globe 467,745 1285 723 3.8 69

The Arizona Republic 448,782 580 1988 2.8 81

The Philadelphia Inquirer 373,892 264.5 4540 2.7 51



The Atlanta Journal-Constitution 371,161 336 3370 3.1 89

Detroit Free Press 368,839 360.5 3906 1.9 70

Sources listed in references section*The lower the page view ranking number the more effective the site at attracting and keeping viewers.

While it's no surprise to see The New York Times at number one in terms of circulation, it is surprising to see amuch smaller newspaper, The Atlanta Journal-Constitution, ranking number one in terms of website usability.For a newspaper with only a third of the circulation of The New York Times, we found their website to be verywell-organized and impressive. They scored perfectly in four of the ten best practices we analyzed, includingbrand integrity, labeling and language, organization and aesthetics, helping them achieve a combined score of89 out of a possible 100.

The New York Times and The Washington Post tied in a close second to The Atlanta Journal-Constitution,trailing by only one point. The Los Angeles Times and the Chicago Tribune also did fairly well with a tied scoreof 82 points.

The Arizona Republic came in just behind the Los Angeles Times and the Chicago Tribune with a total score of81. The Houston Chronicle and The Detriot Free Press struggled with their organization and persistentnavigation, but did great with their strategic intent and load time.

The Philadelphia Inquirer came in last with a score of 51, trailing The Boston Globe (second to last) by 18points! Until they can improve their brand integrity, clarify their strategic intent and better organize theircontent, this newspaper really can't expect to generate more traffic to their site.

Exploding the Myths

Myth #1 - Old content has little value to the consumer. We first explored this myth in our Consumer Magazine Website Design report. Print publishers, with somenotable exceptions, treat yesterday's edition's content as being old and worth little. The web changeseverything. Old content, properly managed, becomes a valuable reference source that can generatesubstantial advertising and circulation revenues. Online publishers must be experts at creating easy-to-usesystems that let users access information in a way that meets their needs.

Myth #2 - All you need to do is put the old content up and slap on a search interface.Several of the regional daily newspapers we reviewed for this report handled their archived content by sellingtheir articles piecemeal. Worse, some sites confused job lots with time slots and actually limited the number ofarticles that could be accessed for the access subscription period. Where this notion came from we simplycouldn't say. There are successful reference access services out there like Highbeam Research and Questiathat, although they also feature reports and books in their libraries, provide a sound business model for sellingaccess to content. Newspapers have two things in their favor that should give them a competitive advantage:

a historical database goldmine of primary sourcesa subscription marketing team that knows how to market and sell subscription services.

Strangely enough, only The New York Times seems to be using this winning combination.

Myth #3 - Consumers won't pay for content on the Internet.As mentioned in our Selling Print Newspaper Subscriptions Online Report, a recent OPA study (read a review ofthe study here) indicates that for 2003 consumers spent $1.6 billion accessing paid browser-delivered contentonline. The not so obvious conclusion from reading the OPA study is that online content goes way beyond



online. The not so obvious conclusion from reading the OPA study is that online content goes way beyondwords and pictures. Successful sellers of Online Content Study include strategies like email newsletters,searchable archives, interactive solutions, and perhaps most obvious, ecommerce offerings—i.e. selling printnewspapers online. In fact, while the OPA Study focuses on browser deliverable content, separate researchdone by the Library indicates that consumers purchasing print subscriptions to magazines, newsletters andnewspapers in 2003 spent an additional $2.5 billion online.

Best Practices

First impressions have never been more important than on the web. The increase in broadband availability,and the accompanying increase in Internet users' expectations, have resulted in a fantastic explosion oftechnology and complexity. And therein lie the pitfalls waiting to ensnare the overworked, over-extended webmarketer. Brand integrity, clear messages, easy-to-use order flows and intuitive navigation fall victim to therace to keep up with "technology." It might give you some relief to know that best practices in homepagedesign and execution are often a simple case of common sense. That, and a firm handle on your audience'sexpectations and perspective.

For this report, we closely examined ten regional daily newspaper companion websites, focusing on thehomepage and some typical user tasks. We conducted a series of expert usability reviews and actual usertests to determine what we believe to be the top ten "Best Practices" for homepage web design for theregional newspaper market. While these ten are by no means the complete list of design practices, they areessential to sound, effective website design and implementation of these practices will result in happier, moresatisfied, readers.

1. Brand IntegrityMost newspapers have a strong print brand—but on the trend to dot-com, the brand can sometimes causeconfusion. Are you building and maintaining your brand? Or are you using valuable space on your homepageto promote a "new brand" that represents you and a bunch of other players?

2. Strategic IntentTo communicate strategic intent you must know two things: 1) what your users are trying to do at your siteand 2) what you want them to do at your site. At least one of those goals should be a way to monetize thevisitor. Sites that prominently provide subscription opportunities and require some form of registration to viewvaluable content are demonstrating...

3. Persistent/Consistent NavigationWith the exception of certain processes, like order flow, users of your site should be crystal clear about wherethey are in your site, where they can go, and how they can get back to somewhere they've been. Does yourpersistent navigation reflect the depth and breadth of your content? Does it provide quick and easy access tocustomer service? Is it intuitive? Is it consistent throughout your site?

4. Task DepthWe have found that there are some fairly common tasks users want to do on a newspaper companion site.Not surprisingly, the top task is to get more detail on a news headline. Another common task is to subscribeto the print product. Browsing and searching the classifieds is another popular task. Finally, we discoveredthat subscribers are increasingly seeking to take care of Customer Service tasks on the Web—temporarilystopping delivery, changing address, cancelling or reporting a problem with delivery.



5. AffordanceProper affordance means that something that is linked should look like it is—and that which is not linkedshould have no underlining or color-coding. Good affordance means that you aren't making the usermouseover the page looking for links.

6. Labeling and LanguageFar too many websites use language that is better understood by the site's sponsoring organization than by itsaudience. Attention needs to be paid to the labels used in navigation and page titles so that it is consistentwith itself and with the audience's mental models for the content. The added bonus here is that key phrasesand words that your audience will understand will also improve your ranking in search engines as they havebeen designed to evaluate relevancy as a "human" would.

7. Content DensityWe've known for ages in print that effective use of white space (number of columns, bolding, margins, etc.)increases reader pleasure. The same design principles apply on the Web. Actually, white space and employingthe Gestalt principles of continuity, similarity and proximity, are even more important when formatting newscontent for the Web, as Web users tend not to read but rather scan pages to determine if the content isrelevant to their information search.

8. Organization (Marketing Quadrants)On editorial-content-heavy websites like news sites, finding space to provide important marketing links is achallenge. Actual eye-tracking tests have revealed that people use a "Z" shaped scanning pattern whenscouring webpages for information. More importantly, they are less likely to scroll down on the homepage thanthey are on pages that are several levels down. Keeping critical marketing information "above the fold" on thefirst page your users see is essential.

9. Load TimeTwo phenomena contribute to the users expectation of download time: 1) Broadband has dramaticallyshortened download time and 2) people are no longer going to the Web to be entertained. They are lookingfor information. If they can't get a bead on what they are looking for they will Google their way right off yoursite and onto another.

10. AestheticsThat being said, people expect professional websites to be clean-looking, information-rich and intuitive. Theyrespond best when the aesthetics of the site support the purpose of the site and are consistent with the user'smental model.



We chose the companion websites of ten top regional newspapers, according to the Audit Bureau of Circulationreports, that we felt reflected a broad cross-section of geography:

The Arizona Republic - Gannett Co., Inc.The Atlanta Journal-Constitution - Cox NewspapersThe Boston Globe - New York TimesChicago Tribune - Tribune CompanyDetroit Free Press - Knight Ridder

Houston Chronicle - Hearst NewspapersLos Angeles Times - Tribune CompanyThe New York Times - New York TimesThe Philadelphia Inquirer - Knight RidderThe Washington Post - Washington Post

In order to evaluate these sites, we established a user profile based on certain assumptions. Wewanted a "new user landing experience:"

First time visitorNot currently subscribed to the print or online productSomeone looking for information that these sites are likely to provide

We identified four common user tasks:

Subscribe to the print productResearch specific information (search terms: "nomar" and "wmd")Browse for interesting information (sample)Find a way to temporarily stop delivery

The results provided some real surprises. However, a closer examination of what the scores mean tells acompelling story. Those sites that performed poorly in areas of navigation, consistency and brand integritywere the least satisfying for our test users and those numbers seem to be reflected in circulation, as reportedby the ABC, and Audience Reach as reported by Alexa, Amazon's Web data service.

Mequoda Library Regional Newspapers Web Design Best Practices - October 2004

Newspapers AJC NYT WP LAT CT AR HC DFP BG PI

Brand Integrity 10 10 8 10 6 10 6 7 5 5

Strategic Intent 8 5 10 10 10 7 10 10 7 3



Persistent Navigation 7 9 10 8 6 8 6 6 7 5

Task Depth 9.75 9 9.5 8 7.75 8.75 6.75 5.25 4.25 6

Affordance 8 9 5 5 10 7 10 6 7 5

Labeling and Language 10 10 10 10 7 6 8 10 10 8

Content Density 9 10 10 10 10 10 8 7 10 6

Organization 10 8 10 5 10 8 5 3 3 2

Load Time 7 8 5 6 8 6 10 9 8 5

Aesthetics 10 10 10 10 7 10 5 7 8 6

Score 89 88 88 82 82 81 75 70 69 51

Brand Integrity

There were two clear approaches to brand integrity demonstrated by the sites we reviewed. One approachfocused on trying to convert the print brand to a dot-com by changing the logo and brand name to a URLaddress. Many of these news sites not only changed their name but perhaps went into partnership with othercontent providers, subjugating their brand to another authority, for instance our home paper, The BostonGlobe. Here's a revered brand that has totally sold out. Only one tab in the navigation applies to The BostonGlobe and that's News. All the other tabs seem to belong to Boston.com. When you've got a brand that's asold as dirt, why are you trying to build a new onejust to put a dot-com at the end of it, we ask?Philly.com, where you land if you type the URL"philadelphiainquirer.com," represents both ThePhiladelphia Inquirer and The Philadelphia DailyNews although the look of the homepage is moreDaily News than Inquirer. This kind of brand confusion leads to mid-range scores.

The masthead on the Houston Chronicle's website features an arrow "click" element that actually gives theimpression that it's a banner ad, particularly as there's nothing "newspaper-like" about it. First impression?This doesn't support the brand very well. It looks more like an entertainment site. The Chicago Tribunedemonstrates excellent brand integrity in the homepage masthead. Like The New York Times, this homepageboldly says "Chicago Tribune" in the masthead font and in smaller type underneath says "Online Edition". No"dot-com" brand confusion here. Unfortunately, go one level down on some of the links (Sports orEntertainment) and you lose the brand altogether. Not quite as bad as Boston.com's total and uttersubjugation to a higher authority... but pretty damn close.

Best in Class—Honor the masthead:Four of the sites we reviewed clearly sported thelook of the print edition's masthead on the paper'shomepage. The New York Times clearly pushed thebrand with a small banner in the top left corneralternating between classifieds (a major revenuesource) and selling print subscriptions. The LA Timesoffers a facsimile of the print edition online with alink to an actual PDF. Nice job of mirroring eachedition. Unlike Boston.com, The Arizona Republic,



edition. Unlike Boston.com, The Arizona Republic,who shares their web space with AZCentral.com,makes it clear that where you've arrived is at thenewspaper's online print edition. And in the middleis an offer: "3 months for the price of 2!" The brandis carried through on all the mastheads of the next

level of the site: Valley & State, Arizona Living, even the Sports section. It's not at all confusing to thenewspaper reader that this is the online version. Although the logo sported on the homepage is AJC.com andthe name The Atlanta Journal-Constitution is on the far right of the masthead area, every page has aSubscribe link. More importantly, the classified sections let you know that this is an AJC.com product.

Strategic Intent

Strategic intent for newspapers is difficult to pin down because it's a multi-revenue source mix with at leastthree revenue streams: Subscriptions—selling subscription products, Ad space—selling advertising, andClassifieds—selling other folks' stuff. Informal surveys with newspaper readers indicate that they go to anewspaper's website basically to satisfy one of the following goals:

Get more detail on a headline seen elsewhere—usually in an email or portal site like Yahoo!.Contact Customer Service to suspend delivery, change your address, or report delivery problems.Subscribe to the print product—younger readers who are used to purchasing on the Web take it forgranted that the Web is where they can subscribe to their favorite publications and services.Search for a recent article or timely classified information.

This basically means that there's only about a 50 percent overlap between publisher and reader goals. Butthat's nothing new... people buy newspapers to read the news—publishers print news to sell the ads. Sitesthat manage to satisfy these competing goals get a perfect score of "10." These are sites that have subscribe,classifieds, search and customer service links on the first screen of the homepage, and provide headlines andstory snippets that are clearly linked to more content.

While five of the sites we reviewed were able to garner a perfect score, several fell abysmally short. At thebottom was The Philadelphia Inquirer, which drops you at Philly.com. Going deeper into the site to the actualInquirer page, it appears that the strategic intent is nowhere. Everything is pretty much at the same level ofimportance with the exception of the ad space in the right column. It looks very much like a library site wherethe main task is to search for articles published over the last seven days.

Because it's difficult to tell where The Boston Globe leaves off and Boston.comtakes up, it's a challenge to determine the Globe's strategic intent. Apart fromthe search box in the center of The Atlanta Journal-Constitution's masthead, theelement on this page that seeks the most attention is an "Inside ajc.com" box atthe top center of the page—a rotating series of feature headings that haveaccompanying images. Their classifieds are at the top of the left navigation butwith a dull grey background color that just says "Don't pick me!" Contrast thatwith their bright, marine-blue navigation buttons and the yellow "NEW!" next tothe shopping—looks like the mission of AJC.com has shifted from news tocommerce.

Best in Class—Balancing publisher and reader goals:The Detroit Free Press, Houston Chronicle and The Washington Post all have the



The Detroit Free Press, Houston Chronicle and The Washington Post all have theClassifieds and hot news as the most prominent elements on their homepages,earning them top points for strategic intent. The Washington Post included someother elements that are sure to make the site sticky. What we liked most wasthat they used an internal banner ad in the top right corner aimed at gettingpeople to vote on the best BLOGS for Politics and Elections—blogs are personalweblogs that have become the latest rage in Web content. It's interesting to notethe URL path in the address line indicates that this is from the marketing department. The Chicago Tribunegoes so far as to make the center buttons on the horizontal menu bar "Home, Jobs, Cars, Shopping, PlaceAds." Add to that the underlined linked text in the top right hand corner "Subscribe Today and save 47 percenton home delivery." Could their strategic intent be any clearer?

Persistent/Consistent Navigation

If real estate's top three laws are "location, location, location," the top three laws for websites are "navigation,navigation, navigation!" Without good universal, persistent navigation you can't reliably get anywhere. Hereare a few simple rules about Web navigation that designers ignore at their peril.

. 1 Navigation should always be visible and unambiguous as to its function.

. 2 Colored, underlined text, usually blue, is a link that goes somewhere.

. 3 Buttons are best for making something happen, for instance [BUY NOW] creates a purchase.

. 4 The label on a button should mean the same thing and do the same thing no matter where it is on thewebsite.

. 5 The main navigation scheme should show up pretty much the same way in the same place throughoutthe website.

There are two navigation schemes on the Chicago Tribune homepage. The first is a horizontal menu ribbonthat has the main features on the left, the classifieds in the middle and on the far right—Newspaper Services,the customer service link. Ordinarily this would have racked up full points. However, the left side navigationseems to be contextual only to the homepage. Going to the Sports section completely threw us off, as none ofthe navigation nor any of the graphics looked remotely like the homepage we had just left. They did try tokeep the ribbon menu when moving off to careerbuilder.com and cars.com and they get to keep some pointsfor that. Designers of this site would fare better if they could keep that same ribbon menu and its ChicagoTribune look and feel on the Sports and Entertainment pages as well.



The Houston Chronicle also features two levels of navigation. The top horizontal ribbon menu covers what thesite considers the most important categories: News, Sports, Entertainment, Ad search, Classifieds and YellowPages. Of the six links, three are not news-related. We're not sure why a user might want to look up an ad,but we did it just for kicks. You get an image of the actual newspaper ad. It took a long time to download sowe imagine you would really want to see this ad to wait around for it to come up. In the news sections of thesite, the left side navigation was persistent and contextual—all the sections stayed put and the chosen sectionexpanded to show links to section content... that is until you got to the Sports section which, like some of theother sites, seems to have its own look. All the other sections disappear and only links related to sports andthe sports columnists remain. This gets them a "6."

The Detroit Free Press really loses points onnavigation, but not on the homepage whichdoes everything right—although thehorizontal "persistent" navigation needs alittle oomph to stand up to the rest of thepage. Where they go astray is that thenavigation changes dramatically in the nextlevel down. In fairness, the next level'snavigation is consistent across all the subpages. This again leads us to believe it's asite moving from one design to another.

Of the cascading menus we've seen, The Atlanta Journal-Constitution's is the most stable. But thedisconcerting thing about this "persistent" menu is that it's not consistent. The sections move around on theleft side navigation, never a good idea. The menus change around, too. When you get to the Travel section,the side navigation disappears altogether and up pops a drop-down menu. Yuck. But these aren't as confusingas the Boston.com's menus. Only one navigation link connects to a page that is clearly the Globe, the restseem to be pages created in partnership with other entities, such as New England Cable News and cars.com.The horizontal navigation at the top of the page uses two levels, the first is a broad category like News,Sports, Travel or Jobs. Once a category has been selected, a second level of navigation is displayed. Thenavigation is consistent with a news site, but not if you are a Globe reader expecting to find something youmight have seen in the paper. The Subscribe link that was there on the Globe homepage, and on many of theother pages, disappears when you click on a story link.

Not all is lost however. Several sites were able to combine extensive navigation into the masses of contentthey had behind the homepage. The New York Times, LA Times and The Arizona Republic use long, left columnnavigation that often integrates contextual navigation as well. All three featured small, single words thatclearly identified the categories of information available. What's great in The Arizona Republic's story pagenavigation is the additional menu that lists, among other things, "Large Type" and "Smaller Type." Very nice.



navigation is the additional menu that lists, among other things, "Large Type" and "Smaller Type." Very nice.The LA Times could improve their navigation'susability by being consistent with how they orderthe items in the menu. Some sections were alphabetically arranged, some were not—some were "mostly"alphabetical, as all but one item was in order. Ironically "Corrections" was listed last.

Best in Class—Display breadth and depth:The friendliest, most efficient navigation prize goes to The Washington Post. They use a horizontal menu thathas the news-related links on the left and the classified items on the right. This high level menu is persistentthroughout the site. The left column navigation is allocated to contextual menus on the news and featuressections. The classifieds sections have their own internal contextual menu design, usually a second horizontalmenu. This works well and allows them more webpage real estate to devote to stuff that brings in revenue.

Task Depth

In analyzing the usability of common tasks for these ten companion websites, we used two starting points.One of our expert reviewers used the phrase "subscribe to..." in Google. We wanted to see if there were anylanding pages that a user might encounter as a result of deliberate search engine optimization. Our testparticipants were asked to type the publication's name (ex. Boston Globe) into Google and choose the mostlikely search result link for the homepage. Sites that had a link that took us to a subscribe page in the firsttwo or three links or had a Subscribe link in the top half of the first homepage screen scored well. We usedtwo search terms, one that would bring us to national mainstream news ("wmd" for weapons of massdestruction) and one that would bring up topical section news ("nomar" for Nomar Garciaparra). We theninstructed the participants to browse "today's headlines" and some of the related articles to determine howmuch access users had to content. We had them register or sign-up for access but did not subscribe or payfor content access for this research. The last task we asked them to complete was to find a way to suspenddelivery of the paper. Since they weren't subscribers we did not ask them to actually try to suspend delivery—we merely wanted to determine if there was a link and a process for doing so.

None of the newspapers we tested received aperfect score. The Atlanta Journal-Constitution cameclosest with a "9.75." The Boston Globe fared theworst, in part because of the disappearing Subscribelink and the difficulty in determining whether youare on The Boston Globe or some other Boston.comsite. One easily gets lost, particularly when clickingon "Home" does not bring you back to the"homepage" you started from. Search, when youcan find it, works well. The search results displaywas informative. However, the whole archive accessthing is confusing... Why can I access only 25articles a year? Why not unlimited access... itdoesn't cost anymore to produce the articles. It took



doesn't cost anymore to produce the articles. It tooka team of Sherlock Holmes' to find the "VacationSuspension" option on The Boston Globe site. I thinkmost subscribers would be driven to Ma Bell and operator assistance to find the phone number. We had to gothrough the site map and help before a really good guess got us on the right path. Even then we were threeto four more links away from suspending delivery. As one user exclaimed, "Geez—that was unpleasant!"

Falling somewhere in the middle of the pack were the Detroit Free Press, The Philadelphia Inquirer and theHouston Chronicle. If there was one thing that confused users it was the lack of consistency within the sites inboth navigation and in link affordance. They all lost points for the time it took users to find subscribe links.There was wholesale disregard for link color conventions which made it difficult for users to know wherethey'd already been during the browse task. The Houston Chronicle did offer access to everything with goodunderlining, but their search interface was seriously flawed. The search engine works fine—better than most.We got 52 results for "wmd" and the search phrase was bolded in the abstracts (snippets). We found plenty ofrelevancy and timeliness information. And they gave us lots of options for how to view the search results.However their link conventions are reversed—they use purple links for unvisited which turned blue once you'velooked at the story. And there was no way to return to the search list. Someone had disabled the back buttonforcing us to start over from the homepage with a new search. Very unfriendly.

Amongst those that scored in the sevens and eights, the Chicago Tribune impressed us with its one-pagesubscription form easily reached from both the Google search and the homepage. While registering wasrequired for reading even the most recent content, it wasn't needed for browsing classifieds. However theregister process was painfully slow... not because of the amount of information but because the processingtime on Broadband was several minutes. We can't imagine how torturous this would be on a dial-upconnection. They have options for buying access to all the archives as well as single article purchase—butsubscribers were limited to the number of articles. They seem to be mixing their metaphors... time and item.ProQuest Archiver is powering this section so it may not be something they control. But we have to ask, whynot three options (get one article, get full access by the month or get full access by the year) instead of theseven options they have now. Like the Tribune, subscribing to the LA Times was also easy to find fromGoogle. As they are from the same publisher, this might not be surprising. And they had similar problems withregistration and with paid archives instead of access. At the other extreme, The Arizona Republic allows totalaccess to archive material without any money changing hands.

Best in Class—Helping users do what they want to do:The Washington Post's Subscribe link was right at the top of the page... couldn't miss it if you tried. And aGoogle subscribe search yielded Amazon.com options including a National Weekly edition that one of our teammembers actually decided to purchase on the spot. Once we got into the Subscribe page, we followed a paththat led to a Contact section. We noticed that the Contact Us link at the top right of each page was contextualto the department—very well done! The Atlanta Journal-Constitution's subscribe was a breeze. It fast becamethe favorite of the participants for its speed and simplicity.

During the search and browse tasks, onething about The Washington Post stood out:ALL THEIR LINKS ARE UNDERLINED ANDIT'S NOT TOO BUSY. That's right—ALL theirlinks—the links embedded in the contentand the links in the side menus areunderlined. And everything is readable andclean-looking. For once, we can put to restthe notion that designers had to get rid of



the notion that designers had to get rid ofthe underlining to make it easier for thereader. It's just not so. If you accept thepremise that users visiting a newshomepage are scanning for links to moredetailed information, you have to concedethat removing the underlining on the linksto that very information is a disservice tothe user. But we cover that in more detail in

the Affordance section. One other user-friendly practice was noticed by one of our test participants: once youregister and hit submit, you are placed back at the page you wanted to see. One would think that this wouldbe the logical behavior for this kind of site, but the fact that the participant was pleasantly surprised indicatesotherwise.

Both papers did well with the search task. The Atlanta Journal-Constitution had 554 results for "wmd" and 259for "nomar"... with dates, snippets, blue underlined links and lots of results on the page. Both had excellentSubscriber Services... except that the Post could have placed the link to it at the top of the page instead of thebottom.

Affordance

Over the past decade, Internet users have become conditioned to see formatted content on the Web a certainway. However, designers are compelled to want to make their website look and feel "different" from othersites. This inevitably leads to confusion and dissatisfaction. The most egregious of these design decisions isthe removal of the underlining of links in a mistaken attempt to "clean up" the look of a webpage. The resultis that users conduct a scavenger hunt with the mouse, passing over text to see if the cursor can identify hot-linked content.

This was the case at the LA Times, The Philadelphia Inquirer, and The Arizona Republic. Once again we havedesigners deciding to remove the underlining that typically lets folks know that there is a link to click on. IfThe New York Times can underline links and not look busy or congested, we suggest that other sites can too.Why are we making people mouseover things to see what can be clicked and what is just plain text? We wereabout to give The Washington Post full marks for their affordance—until we scanned down to a section wherethere were links (Today's Highlights) that looked like plain black text. It wasn't until we accidentally mousedover these headings to get to something that was underlined that we noticed they were hotspots. Not onlywere these links inconsistent with the affordance of the other links on the page that were colored andunderlined, they were inconsistent with the affordance in their own paragraph! These links were neitherunderlined nor colored.

The affordance on the Detroit FreePress homepage is excellent—colored, underlined links AND theychange color. And this convention iscarried through to the story pages.But the other pages on the sitearen't nearly as well designed foraffordance. Links change color butnone are underlined and the



none are underlined and thedifference for link-scanning newshounds is disappointing. However,as we've noted earlier in this report,the Free Press could very well be inthe midst of a design change. Wecan only hope that the homepagedesign is the one that wins out inthe end.

The affordance of The Boston Globeis actually quite good. Links areunderlined and colored and thecolor changes when the link has been visited. A quick affordance test (see below) will show you how good orbad your affordance is. The Boston Globe got high marks for indicating the possibility of linkage with theexception of a "News Section" right navigation menu that only underlined on mouseover. The AJC's affordanceis mixed. The homepage doesn't underline any of the links until you mouseover. However, if you go down alevel, not only are they colored and underlined, visited links CHANGE color! And the link colors are thestandard conventions! They just need to bring this to the homepage... and the business page.

Best in Class—Look Ma—no guessing!The New York Time's affordance is excellent. The links and buttons clearly do what they "afford" to do—theonly thing the Times could do to get a perfect score would be to let us know where we've already been bychanging the link color a bit more. The change is so subtle in the articles—from blue to dark gray—that it'salmost imperceptible in daylight on a laptop screen. The link color change in the side navigation was alsodifficult to notice. The Chicago Tribune gets excellent marks on the pages they control. They might improve itslightly by making the side navigation links underlined as well, but since people have been conditioned toassume that words in a list on the left side are navigation, they don't lose points. They certainly are to becommended for being consistent in their heading and body links. A slight improvement would be to color thevisited links something other than a lighter shade of blue. Older viewers don't distinguish gradations in colorvalue as well as younger viewers do. So they may be missing the color cue a slightly lighter shade of blue ismeant to convey. The Houston Chronicle was consistent in making links underlined and colored—even in theside navigation AND they change color noticeably after being visited. Bravo!

The best way to test whether yourwebpage has good affordance is todo an affordance test. It'simportant to find someone to testwith who hasn't been to your siterecently and doesn't have any pre-conceived ideas about what wouldbe linked or not.

Print off on a black and whiteprinter the important pages—thosethat feature navigation and buttonsto features and applications onyour site. Give your test participantthe printed pages and a yellow



the printed pages and a yellowhighlighter and ask him or her tohighlight all the things they thinkare clickable. If your designer hascleverly removed the underlining onyour links, and your user doesn'thave color to tip them off, they may have problems identifying all those contextual links! Just for kicks, havethem use a red Sharpie to circle those elements they think are buttons. Remember, links go to places;buttons do things, e.g. submitting a transaction.

Labeling and Language

The newspaper business would be in serious trouble if they didn't know how to use language and labels. Andfor the most part, many of the papers we researched were able to get perfect scores in this category.However, there was a trace of dot-com fever lurking on the pages of some of the companion sites. One of ourpet peeves is when people put a dot in front of a word to make it trendy and e-centric. What, we ask, iswrong with Front Page, Sports, Business? Why do the designers and editors of The Arizona Republic insist oncreating "cute" conventions like ".Sports"? To paraphrase the author of Eats, Shoots & Leaves, they must havea cellar full of dots they don't know what to do with. They redeem themselves slightly by including a menusection that lists the communities they service. That's being user-centric!

Of those sites that didn't achieve a perfect score, it wasgenerally because they failed to exploit the reader's existingmental models. We simply loved the "Newspaper Services"link in the persistent navigation of the Chicago Tribune. Thisgets around the Subscriber/Membership dilemma thatplagues this kind of site. However, they are one of severalsites that use third party services for some of their classifiedcontent. This issue of the re-direct to other websites needsto be addressed. A viewer would be less jarred by a differentinterface popping up if they knew in advance they weregoing to another site, like cars.com. Instead, the designpretends that the user is going to a section of the currentsite, e.g. the Chicago Tribune car classifieds. It's abreakdown of the user's mental model. Cars.com does notshow up in the middle of their newspapers classifieds... whyshould they here? A simple "furnished by Cars.com" hoverbanner when people mouseover the link might do the trickof setting expectations.

Overall, the Houston Chronicle handles the label issue well—even when we don't know why that link is there, i.e. AdSearch. There is, however, some lack of clarity regarding the four large headings in the middle of the page.Are they stories? Features? Departments? With labels like "Daily Shop Girl," it's hard to tell.

Best in Class—Speaking the user's language:The majority of the sites we researched had the language and label issue well in hand.The Boston Globe, The Washington Post, The Atlanta Journal-Constitution, The NewYork Times, the LA Times and the Detroit Free Press all presented menu labels that



York Times, the LA Times and the Detroit Free Press all presented menu labels thatclosely matched the mental model of a newspaper reader. No jargon; simple, oftensingle words that were easy to match to the mental model of a print edition were thenorm. There were also helpful instruction labels like the LA Times MarketPlace labels:"Find a Job," "Find an Apartment," "Find Grocery Coupons." And the customer servicefunctions are carefully grouped under the section heading "Home Delivery." Weparticularly liked the Detroit Free Press 's "View the front page" which leads to a PDF ofthe actual print edition's front page.

Content Density

Newspapers generally find a layout that worksand stick with it. It becomes front page newswhen they decide to change a font face orcolumn width. A great deal of science andmoney goes into layout design. The Web is alittle more malleable, but lessons publisherslearned in print have pretty much served themwell here. There are only a few homepages wefelt could use improvement. The Inquirer'sheadlines could shrink a point or two and stilldo the task of catching the user's attention.The headlines are currently 18 point Verdana—large by any standard. They could reduce it to16 point and still have great readability. Whybother? Because those folks who are trying toread the nine point type in the box to the rightof the headline news will bump their screenfont size up to read the small type and as a result make the headlines gigantic. Given the current column sizethat might break the headlines at a word or two a line. Ugly... Apart from that the amount of white space andthe column width is decent. The Free Press ' font size problem goes in the opposite direction—it is particularlysmall. Using Text Zoom we upped the font size 20 percent and dramatically increased the readability withoutsacrificing white space�—although it pushed one front-page photo below the fold.

Much of the Chronicle's homepage was colorful and circus-like. In this ring the "Jobs/Homes/Cars" blue blob,down here the current scoreboard for the Astros, up there a multi-colored extravaganza of headings whichcould be anything. The labels in the left nav had to be a 10 point Arial... not a very readable font size foranyone over 40. We imagine older readers would have to bump up the screen font size before scanning thissite.

The actual news part of The Atlanta Journal-Constitution's page is a narrow five column layout where thecenter is two over three. It gives a compact feel to the page that is broken up by a few horizontal blocks thatframe the headline news section. There's just enough white space to clearly define the columns and the fontsize on the homepage is adequate even for older readers. The font size shrinks a bit when you go down alevel. There are at least two story-related graphics on the first screen but they are small enough in size tokeep the load fast and provide plenty of room for body copy.



Best in Class—Designing for scanability:Six of the companion websites we looked at got full points for content density. You might think that as a resultof doing the right thing regarding font size, white space and column spacing, the sites would all end up lookingalike, but that was simply not the case. While The New York Times had a more traditional look, the LA Timessported an updated sans-serif design. Stories were still in a serif font, supporting long-copy readability. TheWashington Post had more headlines per homepage screen than most of the other sites we visited. This wasdue, in part, to the reduced font size for secondary and tertiary headlines. Most were grouped according tocategory, which allowed for rapid scanning and decision-making. Ordinarily we would be critical of such a smallfont size, but it fits the purpose of the page and the content.

The Chicago Tribune has an almost spacious look compared to some of the other sites we reviewed. It mayonly be a fraction more whitespace between columns, but it lightens up the density considerably. They alsofeatured more images on the homepage by keeping their snippets to one or two stories. Their font size seemslarger but that's most likely because all their fonts are sans-serif. The Boston Globe's layout for the newshomepage is uncluttered, with a scanable column layout, good font size and excellent link affordance. Asmentioned before, the navigation and layout changes in each page so, while the Globe's homepage scoreswell, the consistency within the Boston.com site is still poor.

Organization (In Marketing Quadrants)

Real estate on your homepage is a precious commodity - and often a source of fierce corporate wrangling.Nowhere is it more evident than on newspaper sites where the traditional competition between advertisingand editorial has been playing out for over a century in print. Based on eye-tracking data for the Web, theLibrary analysts have divided the typical homepage into four marketing quadrants, all above the "fold." Theorder of importance for these quadrants runs in a "Z" pattern.

1 2

3 4

While it is acceptable, particularly on information sites, to have lots of content, primary data should NEVER beplaced below the fold. For an unknown visitor (one who isn't currently a cookied "member" for your site),promotional elements in quadrants one and two should ALWAYS be for your own publication. Once you haveconverted the visitor to a buyer, use this space to generate revenue for sister publications or ancillaryproducts.

This best practice category has to do with how wella website uses its marketing quadrants. The sadfact is that the Inquirer doesn't use them at all. Ourfirst encounter with the Philadelphia paper'shomepage was actually a third party pop-up! In thefirst screen of the Inquirer homepage there areabsolutely no links to Subscribe or to CustomerService. They do have a link to Search, which mighthelp the user find a subscribe page but, sadly, no...we tried and found our search did not match anyarticles.



The Boston Globe's Subscribe link is prominent inthe second marketing quadrant everywhere but inthe story pages, which might lead you to believethat it's regarded as advertising and not as a serviceto the visitor. Customer Service links are not

available throughout the site or anywhere in the persistent navigation. While a Subscribe link is located in oneof the top two marketing quadrants of the Free Press, it's very small and non-descript. More importantly, it'snot in the same place on the sub pages. Nor is there a Search box in the first screen. Customer Service isn'teven mentioned in the persistent navigation... it's in the middle of the ads in the far right column where peoplemost likely will NOT think to look. The Houston Chronicle had absolutely no Subscribe or Customer Servicelinks in the first screen of the homepage. There is a Search box but it's lost among the colorful links and adson the right side of the page. Better to place it in the masthead against the dark blue alongside of "Archives,"a related feature.

The LA Times' ability to subscribe can be accessed from two of the four marketing quadrants. High revenuelinks are in the first quadrant as part of the persistent navigation. The real reason why people come to thispage takes center stage. But Customer Service is buried under "Home Delivery," down several screens fromthe ideal location above the fold—not the most intuitive place to put it. Amazingly "Vacation Hold"—the termthey use for suspending delivery while you are away—isn't among the search terms that the site recognizes.Not good. While there was only one subcribe link in the top quadrants of The New York Times, they alsofeatured a LOGIN/REGISTER link in the other indicating that they are at least trying to identify the user formonetization. Customer Service links are on the homepage persistent menu but not until you scroll down.

The Arizona Republic gets points for having a fairly bold Subscribe banner on the homepage, and even morepoints for having a Subscribe link in the article navigation on the story pages. Site Search stays in the topribbon menu and a "Manage your subscription" link is at the top as well as a universal menu at the bottom ofthe page that has a site map.

Best in Class: KISS—Keep it simple, stupid:The Washington Post gets full marks for having a "Subscribe to The Washington Post" right in the masthead.An identical link is at the bottom just above the global navigation section that has the subscriber serviceslinks. The Atlanta Journal-Constitution gets a "10" for having a subscribe link in one of the two top quadrantson every page in their site.The Chicago Tribune also gets full points for using their marketing space wisely.They have Subscribe, Search AND Customer Service all within the top two marketing quadrants.

Load Time

Of the types of sites we've researched, these had to be the slowest. Perhaps it's because newspapercompanion sites sit on top of huge content databases, or because they have content-heavy homepages.Whatever the reason, keeping users attention during long page loads is a challenge for these companion sites.Alexa, Amazon's Web data site, clocks the load speed of major sites and ranks them. While our ownexperience varied slightly from Alexa's numbers, they tracked closely. Sites that performed slower than 80percent of other sites on the Web included The Philadelphia Inquirer, The Washington Post, and The ArizonaRepublic. We did notice that the Republic handled the many ad graphics on their homepage in a clever way.



Republic. We did notice that the Republic handled the many ad graphics on their homepage in a clever way.Mousing over an ad "stamp" on the far right pops up a larger version of the ad, which immediately disappearswhen you move the mouse elsewhere. A little disconcerting, but you learn to avoid the far right column after awhile. This might also contribute to the long load time as the scripting that makes this happen adds to the filesize.

The ads at The Atlanta Journal-Constitution are thebiggest drain on load time as they provide close to50 percent of the images. According to the Alexaspeed scores, they come in at the median point forall the sites we reviewed for this report and some ofthat sluggishness is probably attributable to thecascading menu script. Because of the graphics andthe other load issues associated with a content-heavy site, the Chicago Tribune site took close to 10seconds to load on a Broadband connection. Theymay want to revisit their graphics to text load fordial-up customers. Anyone that turns images off tospeed things up will have a pretty empty page tolook at. While Alexa gave them a better speed thanthe other sites we visited, they were still slower than65 percent of websites in general.

Best in Class—Speed counts!Of the sites we reviewed, the Houston Chronicle andthe Detroit Free Press had the best loadperformance. Alexa clocked their homepage load ataround 2.5 seconds. We are at a loss for the reason,

but we think it might be more efficient content management and less javascript. No fancy cascading menus,rollovers or image effects here—just lots of content.

Aesthetics

The look and feel of a website's homepage has to appeal to the site's users and be consistent with theirmental model. We gave a "10" to homepages that support the purpose of the site and are consistent withuser mental model and a "7" to those that support the purpose of the site, but seem a bit confused about usermental model. Sites that disregard user's mental model got a "5" and those that were totally ad driven, a "3."Fortunately, none of the sites got a zero... for being "totally ugly."

The aesthetics of the Chronicle's site just do not add up to serious news. It's overly colorful and candy-like.They sport five (count'em FIVE) main colors and a few more accent colors as well. If the typical user is a newsjunkie, this doesn't meet their expectations. In addition, on the homepage there is a far right advertisingbanner that doesn't go all the way to the top and seems to be tacked on to the side of the homepage. Itwouldn't even be seen on an 800x600 screen. It might be a clever use of space when you think those withwider screens are also more affluent, but it gives the site an unfinished, afterthought look. Why not also sporta small ad just above it to balance things? Perhaps they've tested this and it gets results. We just find itannoying.



The font face of the masthead pays tribute to ThePhiladelphia Inquirer's lineage—it was founded in1829—but the paper's roomie on this site is thescruffy Daily News, a tabloid that was acquired byKnight Ridder, along with the Inquirer, back in 1969.If you're an Inquirer reader, this must look likestrange bedfellows indeed. Like the Condé Nastsiblings in our Consumer Magazine report, thesepapers might benefit from at least a little distanceand a lot more marketing. As we mentioned earlier,the Free Press homepage design is a good one. Weonly hope that, if they are in transition with theirdesign, they will be moving in the direction thatsupports underlined links and consistent navigation.

Best in Class—Beauty is in the eye of the user:Of the sites that were consistent with the user's mental model, both The New York Times and the LA Timessport the Old English nameplate in the masthead. The column layout and the navigation all support the brandand the purpose of each site. The Washington Post's site is all business and, like a Ford Truck, carries a wideload. Other sites kept to the 800 pixel width, but this beltway paper has probably done the research andrealizes that most of their subscribers and Web visitors sport larger monitors with higher resolutions that canhandle 1024 pixels of screen space. This orientation allows them to pack even more news and ads into theirhomepage above the fold.

Just Fix It

Navigation - If we've said it once, we've said it a thousand times... if they can't find it, you don't have it. It'sthat simple. Use standard link and navigation conventions to exploit the cues your users have alreadylearned. This is one place you can't afford to fall into the "Let's be different!" design trap.

Charge for archive access... by the month or by the year. Don't charge by the article. Take a leaf fromHighbeam Research's book and get their $19.95 a month (or $12.95 a month) for as long as they're willing togive it to you and let them have everything you've got. It's not costing you any more to produce the content—whatever they're willing to pay is gravy.

Be consistent... please! That goes for navigation, colors, labels and branding and especially in the design ofthe sections of your site. If you have to go to a third party content provider, get as much of your brand on topand let your users know they are going to a partner site.

Get feature and service keywords into thatSearch database! It stands to reason that yourusers will expect that important keywords like"Subscribe" and "Change address" will turn upuseful search results. Your search engine just looksstupid when it can't find things that your userKNOWS must be on your site.

Do some User Testing. Conduct some simpleaffordance tests to see if your link strategy helps or



affordance tests to see if your link strategy helps orhinders your users. Watch some typical usersnavigate your site. Give them specific tasks tocomplete and see if they can do so in a reasonable amount of time. Let your designers and developers seewhat happens. One video of a frustrated, confused user is worth a thousand words. Trust us on this one.

References and Resources

Websites Reviewed In This Report

The Arizona RepublicThe Atlanta Journal ConstitutionThe Boston GlobeThe Chicago TribuneThe Detroit Free PressThe Houston ChronicleThe Los Angeles TimesThe New York TimesThe Philadelphia InquirerThe Washington Post

Additional Websites and References Included In This Report

AlexaAudit Bureau of Circulation

Resource Directory

Advertising AgeThe Associated Press - News Industry DevelopmentsThe Direct Marketing AssociationDM NewsEditor & PublisherFolioMagazine Publishers of AmericaMequoda GroupMequoda LibraryNewsletter & Electronic Publishers AssociationNewspaper Association of America

Copyright © 2006 by Mequoda Group, LLC.

Regional Newspaper Website Design (originally published in Internet Media Review)

Documents

Transcript of Regional Newspaper Website Design (originally published in Internet Media Review)