All The News Where It Needs to Fit

Mike Monteiro
6 min readMar 17, 2015

Redesigning The Seattle Times

We love working with journalists. They love to argue. They crave evidence. And they know how to ship. Every day they ship. You wanna learn how to ship? Work at a newspaper for a year.

The great American philosopher Lorne Michaels once said “We don’t go on because we’re ready. We go on because it’s 11:30.” We know he was talking about a TV show, but the same applies to newspapers. The presses start rolling at midnight. It’s not on the front page because it was the most important thing that happened today. It’s on the front page because it was ready by midnight.

Seattle Times home page, desktop view. One of about 12 different possible configurations.

The Internet has changed/enhanced/wrecked the newspaper business. While it’s certainly freed it from the tyranny of the press schedules and blessed them the ability to publish on a 24-hour cycle, it’s also wreaked havoc on business models and the notion of local.

And while the mighty roar of presses has been replaced by the tap tap tap of glass sheened thumbs, society owes a debt to protect the journalists who have so often protected us from oppression and ignorance. We need our news. We need our trusted sources. We should help journalism adapt to the world it’s helped keep free.

So when Albert McMurry from The Seattle Times called us and said “we have an impossible deadline and some very real constraints” we were only too happy to answer the call to service.

The lay of the land

We began our work the way we always begin — by understanding the organization. For a design solution to succeed it needs to work for users on both sides of the system. Before a news site is pulled up by readers on a train, it needs to be put together by reporters in a newsroom. And the back of the site can either fit with their workflow, or improve their workflow. What it can’t do is make their job harder. So by understanding how they work, and collaborating with them on the design, we were able to come up with a design that does things they’ve been wanting to do for years.

We also need to understand how an organization makes its money. Newspapers and advertising have co-existed since Poor Richard’s Almanac ran an ad for x-ray witch spectacles. So figuring out The Seattle Times’ current and future revenue strategy, as well as how its sales team was rewarded, was paramount to the project’s success.

Article reading well with photo busting out.

One of the biggest constraints that we discovered was ad inventory that had been sold well into the future. Which meant that even though we wanted to decrease the amount of display ads on the site for a future paywall model of revenue, we had to design a site that was flexible enough to do so in stages.

(Tangent: any redesign of a media property has to include a redesign of the ad model. And this needs to be done with the full collaboration of the internal sales team, whose years of experience will be invaluable. And when your salary is tied to the amount of ads you sell a quarter, any initiative that includes “fewer ads” needs to include a restructuring of incentive structures.)

So that paywall we mentioned earlier? It had a firm date attached to it. And there were forecasts based on it happening by that date, which gave us a short deadline that worked in our favor. When people have short deadlines it’s often easier to make decisions, which is exactly what the good people at The Seattle Times did. As we said, journalists know how to ship.

Going Mobile

This is The Seattle Times’ first responsive design. Much has been said about the growth of mobile in the past few years. There’s only one data point that matters: your site needs to be 100% mobile. That’s where the audience is. Especially on a news site. This is what people are reading on the train on the way to work. And if your site doesn’t look fantastic on their phone they’ll switch to one that does. This is important for any website, but especially a news site in a tech-sophisticated market like Seattle.

The Seattle Times understood and embraced this. Again, the biggest issue here was accounting for existing ad inventory. How to reconcile ads that had already been sold, with only a desktop site in mind, with a site that could now get small enough that those ads wouldn’t fit at the sold size? Sometimes a turkey is simply too big for the oven.

The good news is that the limitations of mobile are actually the blessings of the desktop. If you don’t need it on the phone, do you really need it just because the screen got bigger? And if you can’t sell a particular size or type of ad (see you later, Flash) on the phone isn’t it just easier to not sell it at all?

Jack enjoying The Seattle Times on her phone.

With a true responsive site in place, The Times’ mobile readership will undoubtedly increase, making the mobile experience a more valuable place to advertise, leading to a simpler ad experience across the board.

And the reading experience is amazing on your phone or tablet. Clean, easy to read type. Simple navigation. Reduced clutter. And no more pagination.

Easier Reading Enhances Ad Sales

There was a time when web pages were designed like Tetris boards, with elements interlocked into the next. All with the attempt to cram everything into a space that sounds like a mythical English town called Above-the-Fold. Type was small. Pages had column upon column. Also, we referred to things as pages, which was part of the problem. Sales people were instructed to charge more for ads placed above the fold. This resulted in a crappy reading experience for the reader, and a pain-in-the-ass job for the salesperson, who was set up to be at odds with editorial since they were competing for the same space.

Ad integration in the reading column.

Turns out this problem has been solved years ago by the highway system. If you let people do the thing they came to do, read (or drive), and make that as easy and pleasant as possible, the occasional ad is actually a welcome distraction for the eye. So for The Seattle Times, we designed longer article pages with a central reading column and placed ads at meaningful intervals, butting into the column just a little bit. This means all ads get their moment in the sun as long as the reader keeps reading. So now the quality and length of editorial can drive how many ads get served. And the two teams can now collaborate towards a shared goal, instead of fighting over a limited resource.

A True Collaboration

There was no way we could have completed this project without leveraging the full institutional knowledge of The Seattle Times team. Their clear communication of goals, their ability to make decisions, and the understanding (and obvious love for) their market were key to getting this project going. And truth be told, there is a lot more to come — an even more sophisticated ad/content balance, visual storytelling, and an application of the design to a few pages we didn’t quite get to. But together,The Seattle Times and Mule laid a strong foundation for the future. And from our time working with them, we have no doubt that The Times is well-positioned to meet the tough challenges of the future and continue serving the good people of Seattle.

Please enjoy the site.

Wanna work with Mule Design? We’d love to hear from you.