User journeys and paywalls on news media sites

An analysis of four news media sites and how they use paywalls.

An image of post-its on a whiteboard mapping out a user journey
Photo by UX Indonesia on Unsplash

Pop-ups and paywalls have long been the bane of UX designers across the world. No user wants to fend off advances from unwelcome pop-ups asking them to sign up to newsletters, allow cookies, download that free e-book or even more annoyingly, shut off that pop-up blocker. For UX designers a pop-up or a paywall can mean that users never get to experience their work beyond the first 2 seconds when they decide to abandon ship.

For a UX designer that wants to make the user journey as seamless as possible, a paywall can often be a tricky thing to manage (Beynon, 2012). When it comes to news media sites, there is often a dissonance between what the user often expects from a news media site and the objective of the UX designer to lead them to the cart and make them purchase a subscription.

Newspapers have always had advertisements, whether in print or digital and users have paid to have the paper delivered to their doorstep without much complaint. So why is it now that users are hesitant to pay the same subscription fee for their online counterparts? (Chiou et al, 2013) A lot of it has to do with how the internet functions (Burke, 2017). Since it is a high choice environment, there will always be other sources for users to access the news. Also, if news sites were to block themselves behind paywalls when there is a wealth of information available for free elsewhere, what is to stop them from disappearing from relevance in a few years?

In this report, we will consider 3 different sources of news and information and compare how they use paywalls and how these paywalls in turn affect user experience.

  • The Telegraph
  • The Guardian
  • The New York Times
  • Wikipedia

Note: YMMV if you’re using a different device.

The Telegraph

The Telegraph is perhaps an example that hinders the most in terms of UX. As we can see in the image below, the readable or consumable content is less than one-third of the window above the fold. The banner ad and the header bar taking up most of the space at the top and the cookies prompt at the bottom. What perhaps, poses the most difficulty is that

while the user can see the titles of an article, it can’t really view the thumbnails that come along with it.

A screenshot of The Telegraph home page with identifying details of banner and element placement

When we click on an article to view its contents, once again the article title is most visible with the image being cut in half by the cookies prompt. The user can’t view the first lines of the article. In fact, the title of the article is created so much like a banner ad that there was initial confusion regarding the nature of the element.

An image of an article on The Telegraph and the anatomy of design elements

Once the user has overcome these small hurdles comes the paywall which is the main focus of this report. This perhaps where the Telegraph is redeemed. Rather than withholding the entirety of its contents behind a paywall, the user can read a snippet of the article as it fades away. This allows the user to make an informed decision regarding whether they are interested in the Telegraph’s journalism or not.

A screenshot of The Telegraph’s article once you scroll down and hit the paywall

In addition, the registration button leads directly to a sign-up process where users can get a free trial. This is where the dichotomy lies. The general rule of thumb on the internet is that websites for the most part are free for users to consume, with revenue coming directly from advertisement sources and while newspapers have always had advertisements, on the internet, they seem far more intrusive. In addition, the presence of intrusive ads creates a pain point for users when they want to consume content that they are already being delivered ads for. In addition, even the free trial requires the user to input their credit card information which may lead to high rates of abandonment.

3 screenshots of The Telegraph showing the payment process to sign up

The Guardian

The Guardian also is a high offender with most of its content being covered by bright cookies prompts, advertisements and their header. This occurs both on the home page and in the article preview.

A screenshot of The Guardian’s homepage and the anatomy of on-screen elements
A screenshot of The Guardian’s article page and an anatomy of onscreen elements

What is different in case of the guardian is that they have more of n opt-in policy when it comes to subscription, They allow the user free access to their content with the pay wall being at the very bottom. Their approach is a little different from that of the telegraph. The guardian pushes the need for independent journalism and asks users to contribute so they can reduce reliance on ads and other sources of finance so they can continue to report in an unbiased manner.

The Guardian also knows its users very well. It creates a long form paragraph detailing the latest news and events and ties in their subscription in a more organic way. Rather than being directly call-to-action driven, they are more conversational in tone.

A screenshot of The Guardian’s paywall and process

The New York Times

The New York Times differs from the above two majorly in the manner that it uses paywalls. Their home page is the least cluttered and offers more in terms of readable content that occurs above the fold. When it does come to the point of asking for subscriptions, they provide their users with an article limit of 3 articles until they need to subscribe. This allows the user to make an informed decision regarding whether they live the content offered by the NYT or not. What is also interesting to note is that often the paywall can be bypassed by closing and reopening a new window or simply using a new device.

An anatomy of The New York Times Home Page and onscreen elements
A screenshot of the New York Times article preview page and anatomy of on-screen elements
An anatomy of the NYT article preview and paywall
An anatomy of subcription page of the NYT


Wikipedia perhaps is one of the most interesting in terms of paywalls and UX. While the paywall occurs right at the very top in bright red, they have been able to turn their fundraising efforts into a sort of meme. They have dedicated a season to their fundraising efforts which users have come to accept. What is most interesting about their approach is that it is content-heavy and allows the user to pay on the paywall itself rather than navigating to another page, allowing the user to continue to browse the article without hindrance. In addition to the above, they use more of a crowdfunding technique rather than a subscription model and deliver their content ad-free.

Screenshots of Wikipedia’s donation prompts
A screenshot of page 2 of the donation prompt

What is also interesting is that while these memes make fun of the fact that people ignore these prompts, data shows that Wikipedia surpasses its fundraising targets every year.

A collection of Memes responding to Wikipedia’s donation requests.


When it comes to consuming news content or any content for that matter, the internet is a vast repository. Users are now spoilt for choice, so paywalls need to be far more creative in the way that they target the user. As evident from the approaches above, the internet news consumer is very different from the traditional one. What Wikipedia has done very well as compared to the others is that it speaks in the language of the consumers with supplementary guerrilla marketing efforts that deliver results.


Beynon, R. (2012). A Pay Wall? That’s Just Dumb. Usability Sciences. Accessed 28th December, 2019). Available at <;

Burke, K (2017). 5 Common Mistakes in Building a Paywall, Explained by Example. Medium. Accessed 28th December, 2019. Available at <;

Chiou, L. and Tucker, C. (2013) “Paywalls and the Demand for News.” Information Economics and Policy. 25(2). Pp.61–69.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: