Washington Post UX Teardown: An Honest Offer, Parked on the Headline
A UX teardown of The Washington Post's signed-out reading flow: the subscription card publishes both prices and the renewal terms, then centres itself over three lines of the headline it's selling.
Click a story from The Washington Post's Technology grid and a card slides into the middle of the window with two numbers on it: $90, struck through, and $20. Under them, in grey, the sentence most paywalls never write: After first year, renews at $90 USD/year. Pricing subject to change. Cancel anytime. It is a genuinely honest offer screen. It is also sitting on top of the headline.
This teardown walks the signed-out path we captured on 7 September 2026 at 1440×900, on the U.S. edition viewed from Brazil, in USD: four section pages, one article, and the gap between what the Post is willing to tell you and what it lets you see.
Technology section
A compact topic row and high-contrast editorial hierarchy turn one lead story, two supporting cards and a deeper feed into an immediately scannable section.
The offer says the quiet part
Start with what works, because it's rarer than it should be.
The card is small, centred, and carries one job. A WP SALE badge. The old price crossed out above the new one in the same gold. A white button that repeats both figures: Subscribe for $90 USD $20 for the first year. The discount survives the click into memory. Then the renewal line, then Already have an account? Sign In directly beneath the card, at readable size, outside the legal footer.
Nothing here defers the second question. A reader who takes this offer knows what year two costs before they've paid for year one, which is what showing a price is supposed to mean (NN/g) and what most introductory offers quietly withhold. Whether that came out of testing or out of policy isn't something a capture can answer. What it does mean is that the money conversation finishes on this screen.
Then it lands on the headline

The story is She lost her sight. Her billionaire father bet on a daring new treatment. Four lines of display serif, the largest type on the page, the reason anyone clicked. The offer card covers the right two-thirds of three of them. What a signed-out reader can actually read is "She lost her sight.", "billionaire father b", "daring new treatm".
Everything else on the article page survives the overlay. The deck is legible around the card's left edge. The hero photograph is fully visible on the right. The first paragraph runs uninterrupted below it: Billionaire Bill Ackman's life was upended this February when his 26-year-old daughter collapsed in her Brooklyn apartment. And it keeps going. There is no truncation and no fade. The page is intact underneath. Only the headline is gone.
That inverts the usual trade. An interruption is defensible when it costs the reader something cheap; this one costs the single most persuasive asset the page owns, at the exact moment it's asking for $20. The card is arguing against its own strongest evidence.
The exit compounds it. Dismissal is a chevron: a small ⌄ set into the top right of the outer sheet, well above and to the right of the card holding the reader's attention. Not an ✕, not on the card, not beside it. A modal that blocks the page should put its escape where the eye already is (NN/g on modal dialogs); this one files it in the corner of a different surface.
Arriving from the section page surfaces a smaller mismatch. Technology dates the story September 6, 2026; the article dates it Yesterday at 5:00 a.m. EDT.
"Columns" is one columnist
Scroll the Business section past the lead package and a horizontal shelf opens under the heading Columns.

Five cards, uniform width, image above byline above headline above date. The card hierarchy puts the author's name first, which is exactly right for a columns rail. At capture time all five names were Michelle Singletary. The dates run 5 September, 29 August, 26 August, 22 August, 19 August. A right-arrow control on the shelf edge advertises more.
Putting the byline above the headline promises that the byline is what varies. A reader scanning for a voice they like reads the same name five times before the row explains itself (NN/g on matching the system to the real world).
One capture can't prove which this is: a normally multi-author shelf caught on a thin afternoon, or a per-columnist module filed under a genre heading. The evidence leans to the second. A right-arrow promising more of the same, and five dates stepping neatly back through five weeks, is what a columnist's back catalogue looks like.
Business to Economy, and back to where you were
Every section on the site is drawn from one template: section title in oversized display serif, a topic row underneath, one lead story with a large photograph, two cards in a right rail, a More Stories stream below the fold. Technology, World and Business differ only in what fills those slots, which is how a newsroom runs dozens of beats without designing dozens of pages.
That reuse is also why the drill-down lands flat. Business's topic row offers Economy, Economic Policy, Media, Personal Finance, Future of Work, Technology and Business of Climate. Select Economy and you get a Business breadcrumb above an Economy title. Under it sits the same lead story you were already looking at, As Social Security fund runs dry, some Republicans say it's time to raise taxes, with the same photograph and the same date. One of the two right-rail cards, This is the big warning sign in the bond markets, also carries over.
The click narrowed the label, not the package. A reader who chose Economy specifically to leave the general Business feed lands on a page whose top half they have already read, and has to scroll to find out whether anything changed (NN/g on pogo-sticking). The child page spends its best screen repeating the parent.
Technology and World carry a + follow control beside the section title. Business and Economy, captured minutes apart in the same session, don't.
What this means for your product
The pricing lesson is the easy one, and the Post is on the right side of it: publish the renewal figure next to the introductory one. One line of grey text closes the question the reader is already asking.
Then there is placement. This card fires on top of the four lines of type that earned the click. Before an interstitial ships, someone has to open it over real content at a real viewport and say out loud what sits underneath it. That check is cheap. It didn't happen here.
Plural labels deserve the same literal reading. A heading that says Columns over a shelf of one columnist teaches a reader that your headings are aspirational, and aspirational headings get skipped.
Take it further
The lens behind this teardown — can a visitor see what they're being offered, and what it will cost them — is the UX Clarity framework, the same one we apply in a Full UX Audit. For how that scoring turns into prioritized fixes, read what a real UX audit looks like.
Scope and limits: this was a signed-out capture of public pages only. No purchase, sign-in, newsletter signup, account action or paywall bypass was attempted, and the carousel was not advanced. Headlines, dates, advertising and promotional pricing reflect 7 September 2026 and will have moved since. The homepage landing was outside this capture's scope.
Sources: NN/g — Show the Price · NN/g — Modal vs. Non-Modal Dialogs · NN/g — Match Between System and Real World · NN/g — Pogo-Sticking.
Ready to find out what your interface is covering up at the moment it asks for money? Apply for a Full UX Audit →
Related
Information Architecture
Wireframing: From Lo-Fi to Hi-Fi (and What Each Wireframe Is For)
Fidelity isn't a quality ladder you climb. What a wireframe is supposed to settle, what lo-fi, mid-fi, and hi-fi each buy you, when a mood board is the right artifact instead, and the failure mode that costs teams a sprint.
TYPENORMLabs · 8 min · September 5, 2026
Information Architecture
WIRED UX Teardown: One Category Template, Three Different Jobs
A UX teardown of WIRED's category pages: the same template runs Business, Science and Reviews, and what each one puts in its first rail gives away what the section is actually for.
TYPENORMLabs · 5 min · August 31, 2026
Information Architecture
Webflow UX Teardown: $15, $25, $2,500, and a Footnote That Changes All Three
A UX teardown of Webflow's public pages: the homepage argues entirely in revenue, the product page won't let you self-serve, the marketplace shows no price at all. Then the pricing page hides its real variable in a two-word footnote.
TYPENORMLabs · 6 min · September 3, 2026