What we're up to

Five trends in digital editorial design

Here at 3CC we’re currently in the throws of creating a new digital magazine and the process has got us thinking about the best ways to display rich editorial content online. Here are five insights on current trends that help digital articles sing.

1. Scroll with it

The popularity of apps such as Instagram means that folks are happy to scroll through content so don't be afraid of using a bit of white space, as you would in print, to keep it looking fresh and help break up the story.

We took advantage of scroll-saavy users on Toni&Guy’s article pages

2. Don't shoot the serif

Most serious typographers know that serif and slab typefaces are easier to read in long form than their sans-serif cousins. The past popularity of sans-serif typefaces online was due to our screens doing a poor job of rending those little curly blighters. But with the increased adoption of retina and hi-res screens on our devices we're now seeing a resurgence in our fancy friends.

We used Garamond, a serif typeface, on the Dumfries House website

3. Letter in

Big blocks of text can seem intimidating and a drop-cap is an age-old way to draw the reader’s eye into the story. Even better - there's now a non-destructive way to code this for most browsers, so you can replicate the effect online while keeping the development team onboard too ;)

A sneak preview of the drop-cap style in action on our new digital magazine project

4. Desktop tip

Well over half of web traffic now comes from mobile devices and the mobile-first, responsive approach to web design has surely been practical and useful. But it's worth remembering that are still a large number of desktop users who appreciate a more immersive experience on their bigger screens. For a recent project for royal portrait painter, Richard Stone we started by creating a practical mobile-first article style but have also introduced a 'two page spread' layout on larger screens to give it an art book feel.

An art book article layout on the Richard Stone site (right) and it's linear mobile view (left)

5. Get Moving

One clear advantage that digital stories have over print is the ability to include movement and transitions to bring your message to life. As well as adding videos and audio, links there are now several low-loading-time ways to add movement on scroll, click or swipe to enhance the reader experience. But remember, less is usually more on this and your audience may not appreciate being sent into optically induced seizure.

An example of how to use on-scroll movement to bring a timeline to life

More Articles

  • The LGBTQ media boom

    Generation Z are pushing for true inclusivity in the media

    read more

  • Here’s to the joys of successful brand partnerships

    Brand partnerships in the fashion and lifestyle industries have always been potent to consumers because such creative collaborations explore how brands can enrich their lifestyle in new and innovative ways.

    read more

  • Punk's influence on graphic design

    As punk celebrates its 40th birthday, what can contemporary design learn from the movement’s DIY aesthetic?

    read more