In the late 1990s the Philadelphia Inquirer published a series on “the dramatic raid of Mogadishu”. It evolved into a book and a movie called, as you may have already guessed, ‘Black Hawk Down’.

The initial extended feature first made its debut in print, and was then pushed onto the website, where video, audio, maps, photos and related links helped bring the story to life. The site, which is still available online, looks like this:

This was one of the first mainstream media attempts to use the web to enhance long form content, and while the page might not look terribly pretty, all of the right kind of functionality is there. 

Since then things have moved on considerably, and in an age of HTML5 I have seen some stunning examples of what can be achieved with online storytelling. Here are a few that are well worth checking out. 

Let's start with the obvious...

The New York Times’ ‘Snowfall’

The chap who put this together won a Pulitzer for feature writing, and Snowfall has inspired a New York Times redesign (here’s a preview). 

ESPN’s Grantland

This one, which is all about an epic sled dog race, ticks lots of boxes. It makes use of image galleries, maps that auto-adjust as you progress through the article, full-width pictures, has excellent typography, and contains interesting background content in the sidebar. A truly fantastic effort.

Polygon’s PS4 overview

What a wonderful way to display a comprehensive analysis of the PS4. The page loads as you scroll down, rather than all at once, which avoids delays and makes for a pleasant experience. 

Pitchfork's Bat For Lashes feature

This feels like a print magazine, rendered online, with big images, pull-out quotes, and so on. In truth it could have been executed a bit better (for example, narrow the page and watch the text shrink to microscopic proportions), but the idea is good.

Smithsonian’s ‘Oral History of The March On Washington’

Includes plenty of ‘talking head’ videos, prominent quotes and full-screen archive pictures.

The Verge’s NSA feature

I especially like its ‘wiggly margin’ approach (for I think that wiggly margins on long posts are a very good idea), with content extending left and right into sidebar / gutter space. It helps to keep the reader interested. This example also includes huge images / header imagery. 

Chicago Tribune’s ‘His Saving Grace’

Kevin Pang’s feature received the right kind of treatment on this non-standard page layout. Very pleasing to the eye, with some lightweight animation.

The Guardian’s ‘Firestorm’

An image-focused scrolling site with permanent jump links in the sidebar, some lovely animation, and ambient background noise. Low on text, but an e-book download with more detail is available.

Tomato Can Blues

Here’s another, more recent example from the New York Times, which is part story, part web comic.

SB Nation’s Rashede Hageman profile

This isn’t interactive, and it’s very text-heavy, but the page layout works well for me.

Fliptop’s ‘Social Score’

Finally, here’s an example of how non-publishers can embrace long form content. I’ve never been a huge fan of microsites, and this approach might be a better way of telling stories, extending campaigns, and creating compelling landing pages. 


The best long form experiences on the web blend quality content, eye-catching design and useful functionality

Common elements found in the above examples include:

  • Beautiful, non-standard page layouts
  • Scrolling
  • Rich content
  • Decluttering the page
  • Use of sidebars for content
  • Massive pictures
  • Wiggly margins
  • Removal of ads
  • Non-standard typography
  • Animation (or the feeling of movement)

If you’re in search of further inspiration then check out my article on scrolling websites that tell a story.

Otherwise, do let me know what you think, and by all means point to other quality examples of long form content on the web.

Chris Lake

Published 25 November, 2013 by Chris Lake

Chris Lake is CEO at EmpiricalProof, and former Director of Content at Econsultancy. Follow him on Twitter, Google+ or connect via Linkedin.

582 more posts from this author

You might be interested in

Comments (3)

James Gurd

James Gurd, Owner at Digital JugglerSmall Business Multi-user

Hi Chris,

Great post and some new examples I hadn't seen before. I love the Bat for Lashes feature but is it me or does some of the copy get lost behind the images?

An old favourite of mine is Nissan's Japanese landing page for the Note:

Epic visual storytelling and a page that is so enjoyable to scroll i keep going back just in case they've done something new. And i keep telling people about it.

I challenge you to scroll and not be delighted:)


over 4 years ago


James Elliot

Hi there, Chris,

These are really great examples - thanks for sharing.

Here at Breast Cancer Campaign, we find it really interesting how digital story telling is evolving in these sorts of ways to create extremely engaging and rich user experiences.

We were so inspired by the Guardian's Firestorm, which you list above, that we created a similar piece to tell the story of our work that went live at the beginning of October 2013. We've popped a link to it below if you'd like to take a look:

The content sets out what needs to be done to address the critical gaps in breast cancer research and mixes up copy, infographics, pieces to camera from our staff and researchers, as well as laboratory shots of real breast cancer research that our charity funds.

It was a challenging project, turned around over a very tight timeline, and we were very pleased with the results. We would love to hear what you think about it.

We also loved these two interactive stories too, which if you haven't seen already, are worth a look.

Bear 71

(although the above is Flash it's still a clever awareness raising piece for platforms that can play it).

National Geographic's 'Killing Kennedy'!/premiere-screen

Wish you the best,

James Elliot
Head of Digital Engagement
Breast Cancer Campaign

over 4 years ago


Alex Horner

As nice as some of the examples in the article above are, I'm not sure they're really offering anything ground-breaking in terms of audience immersion. Funky scrolling, big images and autoplaying videos/animations certainly look attractive but the extra eye/ear candy they offer could surely be outdone by focusing on making the experience of digesting the content itself more social.

Often, one of the most compelling reasons for consuming a piece of content (digital or otherwise) is to compare your views on it to those of others. Imagine seeing users' comments appear in the margin as you scroll down, relating to the specific element you're currently viewing rather than just bundling them all together at the end with no real context. Or actually being able to see who else is viewing the content at the same time as you and starting a real time discussion about it. Surely social additions like this would draw people in further and elicit stronger emotional reactions than some background music and big images?

over 4 years ago

Save or Cancel

Enjoying this article?

Get more just like this, delivered to your inbox.

Keep up to date with the latest analysis, inspiration and learning from the Econsultancy blog with our free Digital Pulse newsletter. You will receive a hand-picked digest of the latest and greatest articles, as well as snippets of new market data, best practice guides and trends research.