The Mobile Web Design Battle That Isn’t
Why Adaptive Knocks Out
Responsive for E-commerce
The Mobile Web Design Battle That Isn’t
Tech bloggers, marketers, and general web enthusiasts continue to fight about which form of web design is best to reach today’s mobile internet users. It’s responsive versus adaptive, and it’s made out to be a pay-per-view title bout worthy of the marquee at Madison Square Garden.
In one corner is responsive web design, considered by most the current, reigning, and defending champ of the mobile web. In the other corner is its challenger, adaptive web design. It’s not a stretch to consider adaptive a protégé of responsive – they’re built on the same principles, but each has its own distinct style and strengths. Thing is, when the two sides step into the ring, it’s not exactly a fair fight; it’s obvious which design is better and more applicable, especially if you’re in the e-commerce business, which the automotive industry certainly is. It’s a battle reminiscent of the original browser war between Microsoft’s Internet Explorer (IE) and Netscape Navigator.
When IE overtook Netscape in 1998 as the web browser of choice for consumers, it wasn’t wholly due to technological superiority. Instead, IE overtook Netscape because of the large amount of computers being sold at the time with the Windows operating system, all of which came with the IE browser already installed. Consumers weren’t choosing IE over Netscape based on personal preference; they weren’t really given a choice.
This sparked an antitrust lawsuit against Microsoft1, but when the
suit was finally settled it mattered little. Netscape had failed to cross the chasm into the mainstream market and capture new users, and their technological innovation lagged too. And after three years of competition with IE, Netscape’s user base dwindled and became outnumbered by new, mainstream users buying Windows-based hardware (and, by default, making IE their web browser of choice).
“It’s obvious
which design
is
better and
more applicable,
especially
if you’re in the
e-commerce
business, which
the automotive
industry
certainly is.”
Why Adaptive Knocks Out Responsive
for E-commerce
The Mobile Web Design Battle That Isn’t
Microsoft figured out how to adapt to its market. Netscape never learned how to respond.
And then along came Google.
It’s no surprise that Google’s Chrome web browser is the most popular worldwide, with a 38 percent share.2 They’ve given
Microsoft a dose of their own medicine, selling their own hardware with their browser already installed and consistently delivering a product that evolves and is just plain better.
Google has also converted the user bases of established products in the market based on their brand name and overall market presence alone. In other words, when Google releases products, people consume them, and when Google speaks, people listen. Google has spoken about this web design battle too, although some take their recommendation3 to use responsive design as a
full-fledged endorsement, as if web design is a one-size-fits-all solution. It’s a mistake to construe Google’s advice that way, because the average website online is not an e-commerce website.
Automotive retailers need to understand which form of web design is best for consumers and for themselves – before their business goes the way of Netscape.
“Automotive retailers
need to understand
which form of web
design is best for
consumers and for
themselves.”
Think automotive retailers aren’t in the e-commerce business? Think again.
E-commerce encompasses the entire buying cycle and all of the activities associated with a purchase. It’s not solely an exchanging of money for goods or services, especially when you’re selling a product that requires a large financial investment, which vehicles certainly are.
Real estate companies like Zillow have switched to adaptive for this very reason. And shopping for a house is similar to shopping for a car. In reality, by the time a consumer visits a dealership, the core of the transaction is complete. Most consumers aren’t “sold” a car on the lot; they walk in and buy one. The “selling” has already happened online. That’s e-commerce. Automotive retailers are certainly in that business.
The Mobile Web Design Battle That Isn’t
The Current, Reigning
and Defending Champ
Mashable, the popular web and tech blog, said 2013 would be the “Year of Responsive Web Design.”4 It wasn’t necessarily a bold
statement, because responsive design had already gained plenty of clout with mobile site designers and was quickly becoming – or had already become – the gold standard.
It’s easy to see why responsive design caught on so quickly too. Its premise is to deliver the same user experience across devices by sending the same HTML code to all devices while adjusting the CSS language to recognize the type of device being used. This creates one version of the site that formats itself to fit the screen size and dimension of any device. Think of those messages that popped up when you watched movies back in the day (“This film has been formatted to fit your screen”) and you have the gist of responsive design.
The rise in users accessing the web on mobile devices has made significant jumps from year to year. Mobile accounted for 30 percent of worldwide internet traffic as of February 20145, a 19
percent jump since 2012 and 13 percent jump since August 20136.
Because of that, responsive design absolutely makes sense for mobile devices. It’s practical, necessary, and easier – at least in theory – on web designers because they needn’t code multiple versions of a site to fit the screen sizes of different devices. For comparison’s sake, however, responsive is the Netscape of mobile web design: a slew of early adopters but with long-term limitations.
“The rise in users
accessing the
web on mobile
devices has
made significant
jumps from year
to year.
Mobile
accounted for
30 percent
of worldwide
internet traffic as
of February 2014,
a
19 percent
jump since 2012
and
13 percent
jump since
August 2013.”
The Mobile Web Design Battle That Isn’t
The Challenger
Some may label adaptive design as an underdog in the mobile space, but it has a growing fanbase, especially among e-commerce
companies, including the likes of Amazon and PayPal.7
Those within the automotive retail industry have paid particular attention to the business model of those two retail giants, because they’re the gold standard of e-commerce, a business model automotive retailers are delving into more and more.
Just as it was easy to see why responsive design caught on so quickly, it’s easy to see why adaptive is making headway with companies such as Amazon and PayPal.
Like responsive, adaptive design’s language recognizes what type of device is accessing a website. But instead of sending the same HTML code to all devices, like responsive does, adaptive design sends separate HTML codes to fit a specific device; in other words, one HTML code is sent to PCs, another to smartphones, and another to tablets.
That’s because adaptive design is catered toward the user’s intent. Retailers need to know what users are looking to do on their site. Smartphone users are looking for quick information on a retailer or product; tablet users are looking for entertainment, maybe a quick video of the product in action; and PC users are doing in-depth research on their future purchase.
“
Adaptive design
is catered toward
the user’s
intent. Retailers
need to know
what users are
looking to do
on their site.”
The Mobile Web Design Battle That Isn’t
This separate delivery method creates one customized version of the site that formats itself to fit the screen size and dimension of one device – the PC or the phone or the tablet. It’s not one-size-fits all. The website still maintains the same URL, just like responsive. But the
language adapts the site to fit the device.
Mobile content, for example, can be customized for mobile users and the type of information they want. For automotive retailers, that information may be things like ways to communicate with the retailer, online appointment scheduling, or simple inventory listings.
Adaptive is the Internet Explorer of mobile web design for comparison’s sake: the newer of the two products with a lesser market share but better distribution system.
Tale of the Tape
Let’s get a little technical and compare these two designs side by side.
When it comes to user experience, adaptive design clearly has a leg up on responsive, mostly due the ability to customize websites for desktop and mobile users. This customization means you’re delivering more relevant content and features to a specific device. You’re also delivering that content and those features faster with adaptive design.
“When it comes to
user experience,
adaptive design
clearly has
a leg up on
responsive,
mostly due
the ability to
customize
websites for
desktop and
mobile users.”
Responsive AdaptiveDesigned to be flexible and fluid Designed to align with user intent Detects device with media queries Detects device with server-side logic Resizes existing page to fit device Delivers customized page to fit device One page for all devices Optimized page for each device Loads all page elements Loads device-specific page elements Same functionality regardless of device Site loads to fit device functionality Images are resized to fit device Optimizes images to fit device Inconsistent experience across devices Optimal experience across devices
The Mobile Web Design Battle That Isn’t
From Chantal Tode, writing for Mobile Marketer: “Sites using adaptive design loaded, on average, in 2.6 seconds while responsive Web design sites took over 4.3 seconds to load and sometimes took as long as 6 seconds. The discrepancy in load times can be attributed to the fact that the responsive Web design sites were over 1.2MB in size while the AWD (adaptive web design) sites, on average, were 791KB. “For the growing number of ecommerce customers shopping from
mobile devices, waiting more than 5 seconds can be enough to
convince them to abandon a site and go elsewhere.”8
Automotive retailers need to take that seriously. Sixty-one percent of consumers will leave your site if it takes too long to load9, and 68
percent say a poor mobile site experience negatively impacts their opinion of a brand.10
And, with 71 percent of consumers saying they’re interested in using a smartphone or tablet to find information during the car-buying process11, automotive retailers should take a hard look at adaptive
design for their websites. It’s not a one-size-fits-all-users solution, like responsive; it’s a one-size-fits-one-user solution, with an experience tailored uniquely to them and the device they’re using.
And remember, when a certain company speaks, people listen. But we know actions speak louder than words: Google – yes, that Google – actually uses adaptive design.12
“It’s
not a
one-size-fits-all-users
solution, like
responsive;
it’s a
one-size-fits-one-user
solution, with
an experience
tailored uniquely
to them and the
device they’re
using.”
The Mobile Web Design Battle That Isn’t
The Decision
With the rise of mobile computing – and its seemingly unlimited future13– automotive
retailers need to pay more attention to the way they deliver websites to consumers. It’s consumers, after all, that ultimately will decide between adaptive and responsive by choosing to visit and stay on the sites that work better on mobile devices.
If you’re running a blog, responsive design is solid and practical. But if you’re focused on e-commerce, adaptive is clearly the fighter your money should be on. It’s the fighter Google – and Amazon and PayPal and Pinterest and Hulu and Pandora – already put their money on. And it’s where your consumers are going to place their bets too.
Forrester Research says 63 percent of companies using responsive design today believe it’s not a long-term solution.14 Don’t bet on the Netscapes of the world to help you win
over mobile users. Adapt to something better. Knock out your competition.