Refreshing The Atlantic Homepage in 2017

This post was originally published on this site

Process, methodology, and the path forward

Our last major redesign in April 2015, explored the idea of “a real time magazine” and the implications therein. Stories had large images, the page was fully curated, and there was modularity, which in theory provided editorial flexibility. The hope was that we could give the entire page the same care and attention as the top of the page. Over the next year, through A/B testing and analytics, we found that putting more stories higher on the page and reducing the size of the images increased engagement. So while the original vision was off the mark, through iteration we ended up with a performant page that has served us well for the past two years.

But as time went on, and editorial needs changed, we started thinking about where we wanted to go next. We began by talking to our readers, to find out why they use our homepage. We spoke with our editors, to learn about operational pain points and how they are thinking about The Atlantic going forward. And finally, we spoke with our sales team to better understand how the homepage fits into their strategy.


We embarked on a series of user tests in 2016 to help us better understand how readers use the homepage. We spent two days with 10 readers where we tried to contextualize their habits and bring nuance to our quantitative data. Some highlights:

  • Readers mental model is much different than our own. Those that use the homepage treat it as an index of the site’s content, not a subset.
  • Related, it was difficult for users to find the latest stories.
  • Readers often have preferred writers that they look for.
  • When browsing on a traditional computer, e.g. something with a keyboard and mouse, they almost all had two modes: discovery and consumption. In discovery mode, most readers opened multiple stories in new tabs before switching to consumption mode. As one reader said: “I do the filtering first and the reading second.”
  • A large portion of homepage readers access the site through the homepage only.
  • Those who watch video tend to do so in the evenings.

Editorial Staff

We interviewed the editorial team to find out how The Atlantic editorial strategy has changed and what we can do to improve their workflow. We discovered that an entirely curated homepage, while nice in theory, is operationally difficult and taxing on the team. However, it was clearly expressed that they wanted to maintain a curated presence, albeit a dramatically reduced one. The other request was more density and clearer hierarchy so that they could be more flexible when there are multiple stories that they want to highlight.


Previously, we shared how the engineering team is working on ways to monitor and improve ad metrics, primarily viewability and engagement, two things that are impacted by page speed and position. As we approached the homepage, we had a mandate to take a proactive approach and think about ad performance holistically. We also wanted to update our native promos to be, well, more native while still being distinct from editorial content.

The Solution

We distilled our competitive, stakeholder, and user research into two points:

  • What’s important?
  • What’s new?

Designing based on these questions, we ended up with two distinct sections: important and curated (top) and new and programmatic (bottom). By establishing this framework, we were able to meet editorial and reader needs in an elegant and coherent manner.

Important and Curated

Anchoring the top is a lead story, a familiar paradigm to readers and editors alike. Then we have two areas which serve to showcase our breadth: a discrete auto-populated News section and a group of three curated stories which can each have related links to provide more depth and context.

One of the major changes we implemented was adding a new area called Featured. By playing with the hierarchy, this area serves to highlight stories which might not be in the news, but that we think are worth our readers time.

New and Programmatic

This section is anchored by the Latest module, a reverse chronological river of stories, so it’s easy for frequent visitors to catch up on what they missed. We redesigned our river item to be at once more scannable for readers and flexible for editors. Given our increased focus on video, we also added an inline video module to showcase our latest content.

Second, we moved our Popular module up the page. Users would go hunting for a list of popular articles, so rather than make them look, we surface it as soon as possible.

Third, we implemented a new Writers module which functions similarly to the river: when a writer publishes a new article, they appear at the top, and as more stories are published, they move down the module. The intention is to expose both established and newer writers to our audience in order to build both trust and familiarity.

Finally, we implemented multiple promotional modules that were designed to be flexible and able to promote anything from a newsletter, to a podcast, to a new magazine issue.


Five years ago our President (then Editor), Bob Cohn, reflected on the role of the homepage in 2012. He noted that “the homepage is the single best way for editors to convey the sensibilities and values of their websites […] the homepage is, as the marketing team would put it, the ultimate brand statement.”

I think those words still ring true. A “brand statement” for The Atlantic in 2017 meant that we should focus on the stories, make it easy for people to find something to read, and get out of the way. While obvious in retrospect, aligning the company around that vision takes a lot of upfront work, but in the end is worth it. However, despite our research, prototyping, and deep focus on our users, I suspect we got some things wrong. We already have multiple A/B tests planned for launch and I’m excited to see how the design evolves.

Refreshing The Atlantic Homepage in 2017 was originally published in Building The Atlantic on Medium, where people are continuing the conversation by highlighting and responding to this story.

Comments are closed.

Proudly powered by WordPress | Theme: Baskerville 2 by Anders Noren.

Up ↑