A few basics of newspaper.com design

⚠️ This post is more than five years old. Links may rot, opinions may change, and context might be missing. Proceed with cautious optimism.

I’m about 1/5th of the way through my latest run of Preliminary Data Gathering (cue ominous music as if the villain just walked into the bar) for my thesis, which involves staring at newspaper.coms just long enough to figure out where they hide the blogs.

As I work my way down an alphabetical list of the top 170 papers with average weekday circulation greater than 50,000 but less than 300,000, I am prone to gasp in horror — or delight — at the online news design I stumble over in the night.

And so, without further preamble, in no particular order, here are a few pointers from the field:

  • Left nav is the devil. Just quit it already. Simple horizontal nav will get more readers clicking through to your robust section pages, as if they were, y’know, reading a newspaper and finding what they want, like the comics or the crossword or the box scores. Don’t worry, they’ll find other things to read, just like in the hard copy. Does your print edition have an index with 180 links to individual daily features on A1? I hope not.
  • Image-driven house ads on the right side of your page are invisible. Most of us are guilty of this: Promoting a feature of our site or a multimedia special or a secondary entertainment site or social network with, well, a display ad, more or less. Not only is the advertising that people actually pay for invisible to your readers when it’s just another Flash-y thing on the right side of the page, but the content you’re trying really hard to promote also gets sucked into the vortex of banner blindness. Either cut down on the images, or try something with a headline, small image, and linked text explaining what’s up.
  • Article templates should never be dead ends. Give me related stories, most popular stories, blog posts that link to this story — give me something to keep me clicking through to the next thing I might be interested in. Don’t leave me hanging with nothing to do but hit the Back button. (See also: Mark Potts.)
  • Clear organization of code makes for clear organization of content. Take a look at any of the Scripps sites* recently outfitted with a Django-powered Ellington CMS, and you’ll see newspaper.coms that look like they were designed on purpose, and not slapped together with bubble gum, dental floss and Perl scripts. To put it another way, these sites look rational.

Those are just some always-obvious mantras that have been rolling through my head as I churn through 170 sites on the long road to polishing off a master’s degree.

For a fresher, South American look at newspaper.com design, Mindy McAdams points to Julián Gallo and his work at MDZol in Argentina. Clear, clean, easy to navigate, unmuddled, with lots of links to follow when you hit the bottom of a story. I like it.

Got any pointers/wishlists you’d like to shout out at newspaper.com developers? Speak up in the comments below…

*Ryan Berg, a designer at Scripps, added a list of a few recent Ellington redesigns by e-mail. My favorite of the ones he sent: The Boulder Daily Camera. It’s clean, I can find what I’m looking for, and features like hot stories with lots of comments are easy to spot. 

Subscribe via Email

I am RSS years old and still miss Google Reader, but if you want to get inboxed when I post here, that’s fine with me.


Comments

7 responses to “A few basics of newspaper.com design”

  1. The new Knoxville site is beautiful (we agree) — very clean and easy both to browse and to read. But that Naples site gives me a headache. I can’t tell the ads from the graphics. They’re jumbled together and hardly differentiated from one another.

    My conclusion: Not all new Scripps sites are equally effective!

  2. You’re right – Naples is totally breaking that second point in the list. I’ll find a better example later – but as I go through my list of newspapers, every Scripps site is a breath of air.

  3. […] A few basics of newspaper.com design (tags: web design news newspaper work) […]

  4. […] A few basics of newspaper.com design. Ryan Sholin’s thesis work may emerge as a valuable resource for newspaper website design. He passes along some design tips. […]

  5. I wrote about the left nav bar a while back. RIP: Left Nav Bar, ?-2007. I hope more sites get away from it. We’ve unfortunately trained people to dismiss anything on the right side, so horizontal seems the best option.

  6. Left nav is probably not dead, we all know about the many studies done showing how people read web sites in an F pattern. That is where left nav comes from and why many designers find it effective.

  7. @Mr. C – Yep. Some of us think the vertical part of that F is a nice place for some content.