Readers are using a wide variety of devices to access content. How can you ensure your content will be readable on them all?

By William Dunkerley

Are your digital readers getting an optimal view of your content on their computers? That's a hard question for most editors to answer.

A 2015 Pew Research study found that 66 percent of Americans already owned at least two digital devices (smartphone, desktop or laptop, tablet) -- and that 36 percent owned all three.

This adds up to a diversity of devices and variety of screen formats that are proliferating in the computer marketplace. That makes it impossible to know how your content is going to look on any given device.

Many editors have adapted to this reality by producing mobile editions. Others provide just one version of their publications no matter what device a reader might be using.

Here's an example. The illustration below shows the Manchester Evening News (UK) viewed on a desktop.

Desktop view.

Now if we adjust the viewing window to simulate a mobile view, this is what we get:

Simulated mobile view.

That's hardly a useful presentation for the reader. This publication solves that problem by producing a mobile edition. If the website detects that you are viewing it on a mobile device, it will automatically serve you the mobile version of the publication.

We viewed the Manchester Evening News on a Kindle HD, and this is what we got:

Mobile edition.

Here you have a more useful view of the content. But it is not full-featured. For instance, if I were looking just for business news, the desktop version gives me a link right up front. On the mobile edition I have to either open a drop-down menu or scroll down all the way to the bottom of a very long page to find that link.

Another limitation of the mobile edition is that it presumes what the reader's screen dimensions are. But with ever-evolving variations in reading devices on the market, that presumption often doesn't hold up. It doesn't seem practical to have a mobile edition variant for each and every screen format. And so you are still left with a possibly uncomfortable compromise for any given reader.

A related issue is that many editors have no metrics to tell what kind of devices their readers are using. So even if one were willing to create a mobile version for several of the digital device formats, many of us wouldn't know where to start.

Yet this problem of digital design exigencies remains staring us in the face.

A solution that some editors have employed is a technique called "responsive Web design." It is a new paradigm that departs completely from old notions of dimensional rigidity in page design.

Here is an example of a Web page that is constructed according to the responsive design paradigm:

Results of a responsive Web design.

What you see here is a unitary design that presents itself differently according to the reader's device parameters. It automatically resizes and rearranges elements according to a predetermined plan.

Note the four illustrations with accompanying text. In the desktop view each photo has its related text to the left. The text/illustration pairs appear in a 2-column format. The tablet view switches them into a 4-column format with the text below each photo, and finally the mobile view stacks the text/illustration pairs in a single column.

You can observe responsive design in action at www.TheEllington.org, a website designed by StimulusAdvertising.com. First view the site in full screen. Then adjust the horizontal size of your browser window, starting with the full-width view and then gradually narrowing it. You'll see how the various text and graphic elements change. This process automatically optimizes the content view no matter what screen format is being used.

That's probably enough to make many publication designers feel ill. Traditional publication design is founded upon the concept of a static overall design imposed upon a dimensionally stable substrate, be it print or digital. The reader gets to see what the designer designs.

That's still the case with responsive design. The big difference is that the concept of dimensional stability is out the window. This affects not only graphic elements, but text as well.

How can editors and designers cope with all this? We'll explore strategies in future issues.

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

Add your comment.

Comment:

"I kept being distracted from the layout aspects of the article by the clunky headline - 'was sat ...' -- but this was very helpful information." -- Ruth E. Thaler-Carter, WriterRuth.com