Case study: when data and design have a baby

Styli Charalambous
Bootcamp
Published in
10 min readOct 12, 2021

--

It’s been five long years since Daily Maverick had a major design update to the home page and website. That was brought about with a decision to move to WordPress, a change to the CMS that powers much of the world’s websites.

At the time we were a much smaller organisation — fewer people with a smaller editorial focus publishing around 20 feature-length articles per day. Since then all of those metrics have doubled and as we’ve grown, the home page can no longer do the job it needs to for our readers and help us achieve our goals. So we thought we’d share some light on the process that helped us make some of the big calls in what has been a long-overdue effort.

Previous DM Home Page

Current setup

The current DM home page is limited to 48 articles — roughly the number of feature-length articles produced in a day. These articles are selected for the home page by editors with an obvious bias to the most recently published articles. In recent times, some articles that are older than 24hrs have remained on the home page thanks to the high volume of pageviews being generated in the last 60mins relative to existing home page listed articles, thanks to a custom-built Slack alert feature. This count (pageviews in last hour) is displayed in the CMS that helps editors order the home page.

Previously the home page carried 80plus articles but was reduced in an attempt to resolve the site stability issues being experienced by the site. Site speed is one of the key criteria to drive search traffic which now accounts for 30% of Daily Maverick traffic. (We do not yet know what a good benchmark is for search traffic).

Large tiles for individual stories with a dark navbar

Our current set-up of WordPress still uses the classic editor and we will use this opportunity to move to the Gutenberg Block editor to allow for greater flexibility in home page design and, hopefully, thereby eliminating the standard 5yr wait for layout changes.

What is the problem we’re trying to solve?

Relatively speaking, the Daily Maverick home page performs admirably when stacked up against other publishers. 37% of our sessions begin from the home page and 11% of all page views are the home page itself. This shows the strength of the brand as an editorial destination, that people are bookmarking us or typing our name into their browsers.

Daily Maverick traffic sources and device categories

High-quality news publishers like the New York Times get 40% of their sessions from their home pages, so we’re in good company. This report by publisher analytics company Parse.ly offers a look across the many thousands of their clients. Direct traffic in their world includes newsletters, whereas we split ours out as a separate source. From this, we can see that we significantly outperform the Parse.ly customer base on “direct + newsletter” referrals (48% vs 23%) but underperform internal referrals (11% vs 37%). In aggregate, we are bang on (59% vs 60%) in referral traffic that we control. In a world where social and search algorithms can build or destroy a news brand we’re more than ok with being responsible for 60% of our sessions.

Source: Parse.ly referral sources across the customer base

Getting back to the problem we are trying to solve, we look at this question from the view of our audience and from our own perspective. Having more than doubled our editorial output, we need to make better use of real estate in order to accommodate this change (and achieve our vision). For readers, we need to put more relevant journalism in front of the right people to satisfy their information needs.

What does our audience need?

The home page should be the best “shop window” for Daily Maverick’s journalism, allowing people to:

  • Find articles of significance
  • Find articles of relevance to them
  • Get a sense of South Africa by scanning other stories that won’t be read
  • Check for updates since the last visit

From a recent member survey, we were able to get a better insight into how people use the site alongside what our analytics were telling us.

Interestingly, most respondents noted their desire to skim the home page as a way to “get a sense of what’s happening”. Clear headlines and breadth of content were listed as the top features of the current home page layout and two things readers wanted to see more often was more collections of articles around themes and lists of articles.

Survey of Daily Maverick members.

In assessing the job to be done for the reader, we also need to bear in mind the various information needs that readers have and that a home page, as a collection, should try to address as many of those needs as possible.

The diversity of the content on the home page should reflect these different needs AND make it easier for people to find journalism to satisfy these needs. [This requires an updated taxonomy of articles according to user needs and making them available in collections and is in the works].

In the meantime, we’ve built the ability to create collections and lists of journalism based on sections, authors and article tags.

Design restrictions

There’s a reason why most all large news publishers home pages kinda look the same. The more journalism you produce the greater your available real estate problem becomes. You simply cannot showcase all the journalism you’d like you, and there is also research to show how too much choice causes anxiety in people. As we produce more, the greater the gravitational pull of the “reversion to the mean” in terms of design, approach and so many other operational factors. Startups have the luxury of aiming to be different, using design, focus, talent and disruption agenda to stand out from the crowd in the beginning, until over time many facets begin to mirror the tried and tested.

Data-driven approach

It is therefore hard to deduce if the layout and design is the driving force here, or whether the DM brand is strong enough to pull an audience regardless of the design.

From an internal perspective, we are feeling the pinch of being able to present all our journalism in the space that is most actively used on the home page, the top 25% that indicates 58% of all activity on the homepage occur in the top quarter of the page, and 84% of all scrolling happens in the top half.

Scroll depth for the previous home page.

From the above we can see that 75% of visitors do not make it past the halfway mark, 88% of visitors do not make it to the ¾ mark on the page, and 97% do not make it to the bottom of the home page.

One of our goals should therefore be to reduce the amount of real estate per article and thereby maximise our chances of getting click action in the first 25% of the home page. In making better use of space, we can also better serve the needs of audiences who wish to skim the home page as a way of consuming news. We should bear this need in mind and figure out how we might be able to use programmatic mechanisms to update lists on the home page for repeat visitors on the same day.

Bounce Rate

From our analytics, we can see the bounce rate for the home page is 31%. That means 31% of visitors leave without ever reading an article.

While strange as that sounds, we should take into consideration that the bounce rate on article pages is closer to 90% and 30% is low, relative to eCommerce sites (we need to benchmark against other news sites but there is little public data). Nevertheless, it represents an opportunity for us to reduce the bounce rate or possibly generate some other form of engagement during those bounced visits.

Over the course of a month, this equates to around 250k sessions in which no additional page views are generated. From this analytics breakdown, we can see that the 30% bounce rate applies pretty evenly across all audience segments, even the most engaged.

The bounce rate is slightly higher on mobile (33%) and slightly lower on tablet (24%) where a lower bounce rate is better performance.

The exact reasons for readers bouncing are unknown, however, they could be one of or a combination of:

  • Not finding new content on a return visit
  • Not finding relevant/interesting content
  • Not enough time to finish the session with an article read
  • Being distracted by another app, message, web page
  • Scanning headlines as a way of news browsing and staying up to date

The fact this bounce rate is evident in our most frequent visitors suggests that the “headline scanning” need to stay updated is a likely candidate.

Mobile versus desktop

It’s true that we are no longer in a digital-first world but rather a mobile-first existence. Looking at the site-wide analytics, we can see that roughly 80% of our traffic is mobile. On that basis should we be spending this much time and effort on a desktop home page design? The answer lies in a closer look at our analytics where we can see that 45% of all home page traffic occurs on desktop — a much higher proportion than the rest of the site.

And 65% of all home page traffic is generated by a smaller, more loyal audience segment of near-daily visitors (visiting more than 15 times in a month). These are the people most likely to sign-up for newsletters and become members — from our experience and confirmed by data from publisher automation company, Piano. These are the people we should be spending time and effort to improve our offering for.

Article link research

A University of Texas study into links on news pages found the following:

  • Links with images generated more traffic
  • Related content performed better than popular or trending articles
  • Placed at the end of articles performed better than inline links
  • Generic wording performed better than detailed words/descriptions eg “Related content”

We can use this information in how we position and label our collections to be used on the home page and bottom of articles recommendations.

How Netflix does it

This article covers some aspects of Netflix success with user engagement and content recommendations. The principles employed are:

  • With more than 50k titles personalisation is the basis for driving engagement
  • 80% of all content watched on Netflix is surfaced via its recommendation engine
  • Use of social proof eg Top 10 lists (in your country) and Trending now
  • Thumbnail design — emotive faces that match the tone of the movie work best eg screaming face in a horror movie, laughing face in comedy, customised thumbnail based on your preferences.

From this, we can deduce that machines are more efficient at organising content for large audiences, personalisation is key to greater engagement but should never lose sight of the role of editors in highlighting the importance of top stories.

My Netflix “Home Page”. Personalisation meets recommendations at scale.

New York Times A/B testing

About a ⅓ of NYT articles on the home page are A/B tested for headline optimisation, and some have up to 8 variations of a single headline. 80% of articles that are A/B tested make it into the Most Read list so there is a high correlation with improving engagement on these stories.

If done right, A/B testing can play a big role in driving more engagement for DM as we have a large proportion of reader sessions starting on the home page. A/B testing is something that happens where two groups of readers will see different headlines on the same article and whichever headline generates the most engagement wins out for the remainder of the article’s life.

Measuring success

Taking all of this into account, how will we know if our efforts have been successful? Some key metrics that we’ll be tracking:

  • Reduce the bounce rate by 20%
  • Increase the number of home page article clicks by 15%
  • Increase the number of high-frequency visitors by 15% (i.e those who visit more than 15 times in a month)
  • Increase time on page by 15%
  • Improve page speed load times by 15%
  • Increase the number of listed articles by 100% in the same amount of space

Conclusion

Redesign. The clue is in the name, and there is a significant design focus to this exercise. But one that should be influenced by technological considerations, data from our analytics systems and surveys from the people the home page is serving. In the past, we may not have considered exactly how audiences were using our home page and what their needs were.

Historically, we’ve done a decent job, as our session traffic sources and bounce rates indicate — but we’ve relied exclusively on our experience and instincts. With this iteration, we’re hoping the fusion of data, reader input and design aesthetics will help us attain the measures of success we’ve identified and serve our audiences better. And to have it built in a way that we can run experiments, update design blocks and improve the experience for readers on a regular basis. It should strike the balance between serving readers needs and achieving our goals of deeper engagement and reader loyalty.

Regardless of data, the first victory will be if it doesn’t look like crap and make visits by readers a “grudge purchase” decision. Daily Maverick has prided itself on design, (sometimes at the great cost of perfection over “good enough”) and we’re working on that. It has to flow, be gentle on the eye and create an impression of gravitas without being stodgy. Whether we managed to get that right, well, you can be the judge of that.

--

--

Co-founder & CEO of Daily Maverick (news, analysis, and investigative journalism publisher).