Responsive Design Is So … 2013

Mashable dubbed 2013 the year of responsive web design. Good timing, as the consumption of mobile content began an upward trajectory. Pope Francis even got on board, sending out his first tweet. But a lot has changed since then.

Today, mobile devices are a fixture of daily life — changing how businesses operate, people connect, products are purchased and the way opinions are shaped. And shaky videos, uploaded by internet-ready phones, have even sparked national debate.

Goodbye, Responsive Design

We’ve come a long way in three years. So, thank you responsive design for bridging the gap between information, user and device, but your reign as the development technique of choice is past its prime.

While that statement is likely to offend an entire industry built on the promise of responsive solutions, user demands and habits are forcing a rethink of mobile best practices.

With US smartphone penetration nearing 80 percent, user expectations are now fundamentally different. Being mobile friendly is no longer enough.

What matters is performance — speed, clean design and the removal of barriers that turn users away. And the responsive approach, while its intentions were — and still are — good, can compromise the experience.

Responsive Design = Poor Performance

Basic responsive design proclaims “one ring to rule them all” by using a single code base, delivered to every device, all the time. Responsive is flexible and fluid, resizing images and content to fit on any size screen. However, if left unchecked, it can also deliver poor performance.

Because responsive is a device agnostic bundle of data, the result is often a sluggish experience. For example, unused content and design information for the desktop is downloaded, yet unused on a mobile phone — acting like an anchor, weighing down its browsing horsepower.

Engagement vs. Abandonment

Your first impression is the difference between engagement and abandonment. Let’s face it, we’re living in an “instant everything” culture where impatience — especially for frustrating websites — sends users and dollars the other way.

In fact, as the Aberdeen Group found, for every one-second delay it takes a page to load that duration results in a 7 percent loss in conversions. Speed kills or sells.

Consider JavaScript Adaptive

An iteration of responsive has emerged called JavaScript adaptive. Building on the virtues of responsive, adaptive enables the distribution of customized code for different devices – delivering lean, blazing-fast mobile journeys. It’s a design solution that anticipates the ebbs and flows of technology while remaining committed to users.

While it’s not a household name, yet, it’s the solution of choice for retail giants who rely on precise user interactions to drive mobile sales. Just ask Amazon, eBay and Walmart — all deliver adaptive mobile experiences.

Adaptive offers all the benefits of responsive but adds tailored performance for specific screen sizes. For example, sites can load top down, rather than all at once, fast-tracking pertinent content and protecting user engagement. And images are automatically compressed, rendered and optimized for each screen.

Google AMP Considerations

But wait, there’s more, especially if Google has its way. The search engine giant launched an initiative, the Accelerated Mobile Pages (AMP) Project, aimed at improving mobile experiences and keeping web traffic within its search universe. AMP is not a substitute for your website but a light-weight, paired-down alternative that shows just the basics.

Think of AMP pages as a hyper-fast gateway, ushering more traffic into your full experience. Are you prepared to impress a swell of more users? The advantages of adaptive still apply.

Google’s push may change the rules of mobile search by promoting sites that adhere to more linear, lean and fast mobile design. And while Google has publicly stated that AMP pages won’t receive a rankings boost, the company’s algorithm measures speed and performance when prioritizing searchability. It’s semantics.

While public awareness of Google AMP is relatively low, the company has been vocal about its benefits, including pages that load four times faster and use 10-times less data. And if that’s not enough, Google will furbish AMP pages with a blue, lightning-bolt logo – a branded spotlight directing users to websites with super-fast experiences.

Responsive made the mobile web accessible, taking it mainstream.

Adaptive satisfies shifts in user behaviors and expectations. And Google AMP rewrites the search game, further proving that mobile is no longer just a “nice to have” but an operational imperative.

Title image by Clark Young