Diving into the digital long-read

The digital long-read is a format that has been quickly gathering pace in recent years. Starting with early experiments in parallax-style HTML5 storytelling (such as the infamous Nike Better World) and combining these with the fundamentals of good long form editorial design, the format has flourished and has become immensely popular. Traditional print-based publications such as The Guardian and New York Times have embraced the long-read format, and created hugely popular feature articles that are brimming with rich interactivity.

For the digital designer, the long-read format presents an opportunity to not only create the interface that holds the content, but to design the content itself. Of course, people have been designing content for websites for years, but the digital long-read is different. It feels like a natural fit, a definite maturity in technology and craft, and perhaps more crucially, a maturity of the digital reading habits of the person consuming it. No longer do digital long-reads feel like forced technical experiments. So, why now? And, how does one go about creating a digital long-read?

The rise of the long-read
After years of people complaining “Oh, I wouldn’t read a book on screen”, we are finally seeing the balance beginning to tip to the contrary. The reason is probably no more profound than simply “they just got used to it”. The dinosaurs who were brought up in a world without digital are quickly becoming extinct, these days reading on screen is the norm. Regardless of the reason, the bottom line is the same: not only do designers and writers have the technical skills to create long-reads, there’s a pretty good chance that someone has the attention span to actually read their masterpiece.

Unlike early attempts at long-reads, that were a hodge-podge of every HTML5 feature available, garish animations and dizzying parallax scrolling, the digital long-read (in particular the work from The Guardian and New York Times) feels natural and appropriate. The integration of rich graphical expression truly adds to the value for the user. But, enough with the theory. How does one go about actually creating a digital long-read piece?

Creating a digital long-read
Over the past year, Edenspiekermann has been involved in several (unfortunately top secret) digital long-read projects. While developing these projects, we’ve learned that the format presents the challenge of achieving the delicate balance of expression, functionality and, most importantly, readability. By no means a definite list, here’s some of our learning so far.

1. Have a great story to tell (not just a good one)
It might sound obvious, but first and foremost you need a good story to tell. Not only that, but you need a well written one, working closely with a great journalist. In projects we have found the best writers for this format to be journalists (not traditional copywriters) with experience in feature-length articles.

2. Long page vs. chapters
What better place to digest a long-read than when on a long train or bus journey? Even if your connection is terrible, a well optimized responsive page should still load a long text page with little problems. Mobile users certainly do not mind having to scroll, but loading a link to a new page (especially on a poor connection) is definitely a no go. On the other hand, on desktop where bandwidth is not an issue, users may prefer not to be overwhelmed with 10,000 words (plus all the images, media and graphical delights you may decide to add) on a single continuous page. A good compromise between the two is to add well placed anchored links for clear orientation throughout your story.

3. Sketch it out quickly
Again, it may seem like an obvious point, we always start by defining our story structure etc. by hand. We avoid wireframing tools as this process is time-consuming. Instead we sketch on old-fashioned paper. With pens.

4. Think beyond the written word
What will enrich your story? Start thinking beyond the written word right from the start. Video, images and information graphics all play an important part in the long-read and should not just be added after the text is written. Instead, they should be woven into a story back and forth with the journalist during the writing process.

5. Be inspired by off-screen editorial design principles, but do not emulate them
Like all digital projects, the way the story is designed should be truly digital from the start. After all, your readers probably weren’t alive when the Gutenberg Press was invented. Hell, they may not have even ever read a real (printed) newspaper.

6. Iterate in the browser
As with all our projects at Edenspiekermann, we firmly believe that the best decisions are made by working in the browser when you can see how things will actually look (not “might look” as is the case when working in Photoshop). We use real content and images from the very start — never fake it with Lorum Ipsum. This is particularly important when you’re designing long-reads as the content defines the design and shape of the page.

7. Keep it clean and simple
Last, but certainly not least, never forget that people are easily distracted when reading, especially online where there is an endless stream of notifications. Therefore, interactive elements should be kept clearly apart from the reading experience. When the user is supposed to read the story text, all distractions should disappear. Of course, images, videos and interactive elements can help break this continuous flow of text to create pace, but they should never interrupt the reader’s flow. A great example of this is the popular “What Screens Want” long-read by Frank Chimero. While this piece contains many animations, video and images, when the user is reading the actual text, it is presented in a clean centered column with no distractions. Oh, and one more thing. No matter how “cool” it might have seemed three years ago, no one actually likes parallax scrolling when they’re reading. It makes them nauseous.