We live in the post-PC era. More and more people are switching to tablets and smartphones as their primary devices for consuming content on the Internet. In 2012, we saw an additional 600 million people using mobile devices for search.
The prediction for 2013-14 is that mobile usage for browsing will surpass all desktop devices. This transformation is making website owners and web designers realize they need a way to “speak” to thousands of different screens with different sizes and features.
That’s why “responsive design” came into play: fluid grids, flexible images, and other elements that make your site readable on any device, be it a smartphone, a tablet, or a PC. Reading from a desktop browser? Make your browser window smaller to understand what I’m talking about.
While web designers and developers work to find the perfect balance between usability and adaptability, we writers, copywriters, and all other types of content producers really should think about how this change affects the way we plan and produce content on a daily basis.
Surrender to the Cross-Device Reality
I have thought about a few factors that writers should consider in the post-PC era. However, first, I want to tell you about the mindset I think we all should develop. I think we should accept the fact that the way our writing will be consumed in the future is not completely under our control.
Gone are the days when we could faithfully translate our thoughts and ideas into a single visual identity. The copy, the articles, and the books we produced had just one version, one look, one representation.
Technology now helps us spread our thoughts faster and easier than ever before. This happens across a wide range of devices with different features. So, let’s trade the privilege of being read with less control over our words, and let’s surrender to the cross-device reality.
One of the most obvious things that happens when a desktop browser text adapts to the smartphone or tablet screen size is that text shrinks. In fact, you should think carefully about the length of your paragraphs, as six or seven desktop lines could turn into an unreadable chunk of text on a mobile device. It’s probably safer to create short paragraphs: I would say 250-400 characters is the sweet spot.
To <br> or not to <br>?
Adding a break in the copy of a desktop website used to be a graphic shortcut with no negative consequences. In the title of a page, for example, you could set the number of lines it was displayed on with the <br> function.
What about the same title on a tablet? Think about how that same break function will perform on another device. How will it break the text? Will you like the final result? The general rule here is: try to avoid unnecessary breaks as they will produce ugly results you would not expect.
Speak to the device
There is something else content producers really should think about – readers on different devices are in different consuming moods. So far, we have tackled formatting issues like paragraph sizes and breaks, but what about the messages we are conveying?
The content itself should adapt to people in different situations. For an online magazine, this could mean presenting shorter stories to smartphone readers. An academic site could make in-depth papers more prominent for tablet users.
This is not something just professional programmers can do, as there are many modern Content Management Platforms such as WordPress, Joomla! and Drupal which have responsive themes with “device recognition” built into them. Even Google has spoken and openly states that they prefer “Responsive Designs” to secondary mobile sites, as this keeps users on a single website.
So, in order to conform to Google’s wants, create a good user experience, and allow for ease of navigation on mobile browsers, we have to adjust the way we present our information. Fortunately, it is quite easy. Here’s a sample shortcode which modern WordPress themes used to control device displays:
Your Content Desktop
Your Content Tablet
Your Content Mobile Landscape
Your Content Mobile Portrait
Along with these guidelines, we also should mention the importance of taking advantage of the latest text formatting options available. Toggles, accordions, and tabs are not new, but in combination with the power of “responsive design,” they help users navigate the content more easily.
Copywriters, especially, should make the most of the options to create modular website texts, pieces of content that are not “given” to the reader, but which unfold as the users explore them and show interest in them.
In the end, that’s what this is all about: creating an effective experience for our readers and providing value in a way that is not only entertaining, useful, or inspirational, but also high-standard according to the available technology.
Structure is everything
For websites dealing with a huge quantity of content, a good strategy is needed to create an excellent cross-device user experience. In those cases an ad hoc approach to adapting content is not feasible, as it would take too much time.
Even though we writers would like the written word to be always individually customized to its purpose, we sometimes have to rely on the power of technology to create a perfect content choreography.
Sara Wachter-Boettcher showed the case of Starbucks 2012 mobile site. It was clear that the CTA on product pages was not visible enough, because at that time the desktop right-hand column simply went to the bottom on mobile, regardless of the page content.
It’s not just about the device mood, but also the content mood. Can all types of content be treated in the same way? That’s why structure comes into play. If we know exactly our content types (for Starbucks, for example, that could mean product pages, location finder pages and blog posts), we can break them into microstructural units and have other elements create a perfect choreography with them, preserving content goals (selling, informing or anything else).
In this way CTAs, forms, page links or anything else can have the most effective location on the mobile or tablet page. As Sara Wachter-Boettcher puts it,
If you can define content types based on what they include at a semantic level [...] you can create sound rules to guide how they bend and reshape in responsive designs. You can let your content go, without fearing where it will end up.
Now it’s your turn
This whole “responsive design” landscape is quite new, and probably dozens of ideas popped into your mind while reading this article. Can you share any other advice writers should follow in this post-PC era? Leave your comments below.
About the Author: Dan Virgillito is a content strategist for Sterling Kreative. He works with clients day in and day out to create engaging content which is viewer friendly across all browser platforms.