« B2B Revenues on the Rise | Home | Magazine CEOs Talk About Growth »

Cross-device Portability Demands, Part V

Posted on Saturday, July 30, 2016 at 8:51 PM

Advertising lags behind editorial in adopting responsive Web design.

By William Dunkerley

Editors are loving what responsive Web design (RWD) is doing for their publications. Editors Only, our sister publication, just did a mini-survey to sample opinions about RWD.

Here are a few examples:

"It has simply made our content look better and easer to use and access for our readers. I think it is essential to have it today." --Dave Zoia, editorial director for WardsAuto

"Stories just look much better with the new design, and look great on whatever device -- tablet, phone, desktop, etc." --Kate Robertson, director of editorial strategy for NowToronto.com

"Mobile Web usage continues to increase, making responsive design essential for any publication website." --Yvonne Hill, editor of Ensign magazine

Christopher Coleman, technical manager for Science, explained:

"It's important to think of content in terms of semantics and structure first, and visual presentation second. If the structure is consistent, a well-designed site will take care of the presentation. In the early days of the Web, designers and producers were concerned only with presentation, because the tools to do more just didn't exist. Today, modern HTML and CSS give us the tools to create accessible content that works well on all devices. Properly structured content will work well on future designs and with technologies that we haven't even thought of yet.

"In 2016, responsive design is the only kind of Web design. Today's mobile-first approach to front-end development means that responsive is the default, and preventing a design from working well on all devices would actually require extra effort. Since launching Science's redesign in January of this year, we've seen a real year-over-year increase in traffic and unique visitors. A disproportionate percentage of this increase comes from mobile users taking advantage of our new responsive design."

Advertising, however, has not kept up with editorial at many publications. Non-responsive ads are shoehorned into the editorial grid with results like this:


Example of the mobile view of a non-responsive ad being truncated.

This kind of thing cheats the advertiser of the results that would be possible if the ad were somehow displayed in its entirety.

Quartz magazine is one example of a publication that has taken the lead in building responsive creative for its advertisers. This approach makes the publication fully device agnostic, not just the editorial.



Desktop view of ad appearing just above an editorial headline.


The same ad in mobile view.

You can see that the ad consists of three separate modules. In the mobile view they are rearranged and resized to give a presentation just as effective as the desktop view.

If an ad is built modularly, it can be adapted well to RWD. Here are three examples of another approach to constructing a modular ad:


Four modules arranged horizontally in the desktop view.


For tablets they are arranged 2 by 2.


The mobile view stacks the modules vertically.

These approaches make advertising responsive to whatever device is being used by the reader. When advertisers are given cross-device portability like this, they'll truly be getting their money's worth. And that will make your transition to RWD much more successful, too.

William Dunkerley is principal of William Dunkerley Publishing Consultants, www.publishinghelp.com.

Add your comment.

« B2B Revenues on the Rise | Top | Magazine CEOs Talk About Growth »