• Internet
• 27.03.2019
• EN

yellowpencil: Lessons from analytics on the value of a responsive design

A 8 minute read, written by Paul
July 16, 2014
 

If you want to improve your website's search optimization, your customers' online engagement levels, and your organization's reputation then you need to get your mobile experience right. We've even got some analytics data to back that statement up.
 

Mobile is a good investment

First off, here are some of the lessons we've learned about getting mobile right.

1. Congruency: People on smart phones want the same content as people on laptops.
2. Tablet users want to engage: Help them by optimizing for smaller screens and touch interfaces.
3. One URL to rule them all: Google loves responsive or responsive-ish techniques.
4. Don’t fight over the homepage: Your homepage is more for you than for your customer.
5. Some traffic drops are okay: Getting rid of mediocre traffic means some stats will and should drop.
6. Get it right: Getting mobile right builds trust and reputation.
    

Responsive design can create miracles

We’ve been building responsive web design websites since 2011 at Yellow Pencil (I know, that doesn’t sound like very long ago, but it’s a long time in Internet years.) Our first major client project was a government labour attraction site. Using our new mobile-first, content-first, responsive design approach, the results exceeded all of our expectations. Even though they had dominated their search space for more than a half decade, they saw two immediate and sustained leaps:

1. Overall mobile traffic increased by ~800%
2. Overall traffic increased by ~40%

There are a number of other interesting statistics around engagement and reduced bounce rates, but the other number that caught us off guard was that actual conversions – a person taking the time to submit a form or inquiry – increased by ~40% as well.

The growth on AlbertaCanada.com was the single biggest increase in conversions since the inception of the program. And it was because of a website redesign focussed on optimizing web content for the ideal mobile experience.
 

Can we bottle this?

Great story, huh? Mobile-first, content-first creates a guaranteed 40% increase in new business for you and your organization. We’re going to be so rich.

However, most of our customers don’t experience the same results. AlbertaCanada.com had an audience outside of North America where mobile web had long been the standard. Plus, it was 2011 and at the time, responsive design was as fresh and exciting as Mumford & Sons.

In 2013, we took on another project for an organization that also had a strong mobile opportunity, but we saw very different results. The Edmonton International Airport (EIA) is one of North America’s busier airports (it’s about to crack North America’s top-50 airports list measured by foot passenger traffic), and is a critical hub for Canada’s energy sector.

It was our expectation heading into a responsive, mobile-first, content-first redesign that we would be able to fundamentally transform the audience experience and see huge leaps in traffic and “conversions”. As we moved through our discovery process, we learned two important facts that changed our expectations:

1. ~95% of visitors to the FlyEIA.com website come only for Arrivals/Departures information (mostly Arrivals).
2. There isn’t a “conversion” goal other than to get someone to their flight information.

Getting Arrivals/Departures right, and making everything else findable and usable on any device became our two primary objectives.
 

About FlyEIA.com

Like AlbertaCanada.com, FlyEIA.com also dominated search traffic. There are no competitor websites since competition occurs on airline and travel websites. Before a customer interacts with the EIA website, they have already purchased the product that is taking them to the airport. “More traffic” didn’t necessarily translate into actual business value for EIA, but improved customer experience could (I’ve talked before about how customer experience has bottom line value.)

This project helped us understand how website behaviour changes when we provide an optimized mobile experience but don’t substantially change other variables. Here’s a little background information on the website prior to the redesign:

• The site was fairly contemporary (roughly four years old) and had been an award-winner, so the design and content were strong. Nothing was fundamentally “broken” in the customer experience, except for lack of mobile.
• Annual foot traffic to EIA grows at ~1.5% per year (from ~6.4M in 2008 to almost ~6.9M in 2013) and between 2009 to 2012, website traffic grew at a similar rate.
• The site saw approximately 1.6M unique visitors per year in 2012 so one in four foot-passengers generates a unique website visit, and 1.6M unique visitors is a good sample size.
   

A year of data later

Our redesign project took a mobile-first, content-first approach, focusing on information priority and interface design at the smallest screen sizes. We released the new site at the end of June 2013.

This summer (2014) we took a look at statistics, comparing year-over-year data for a nine-month span. Comparing data lets us see trends across seasons, including the peak travel period in December, also known as peak weather-related delay season (we have these things in Canada called blizzards. They’re pretty fun, except when they’re not.)
 

The results

Here are some findings we discovered when comparing a nine-month period in 2012-13 to the same nine-month period in 2013-14 with the new mobile-friendly design.

• Overall traffic increased by 7%. This is a big jump for a site that already owned the search space and had little competition, especially when actual foot-passenger traffic only increased by <2% in that same time period.
• Organic search traffic up by 6%. This is not a small change considering that 58% of the traffic to FlyEIA.com comes from search. Google clearly prefers a responsive website.
• The number of unique page-views dropped by 11%. This is actually good for usability, especially on mobile. People had to click fewer links to get to the information that they needed, or they landed on the right page the first time.
• Homepage landing traffic dropped by 23%. Traffic was instead redirected to the Arrivals/Departures landing pages, which saw an increase from 60,000 total entrances to 290,000 total entrances following the redesign. These pages existed before, but Google was now delivering better search results, getting people to the right information without having to pass through the homepage. This is good for usability – especially on mobile.
• Pages/session only dropped 16%, even though homepage traffic dropped by 23%. This means that engagement was still high: people visited an average of 2.7 pages prior to the redesign, and 2.3 pages after the redesign.
• Mobile usage (not including tablets) increased by 20% and desktop usage decreased by 8%. Prior to the redesign, mobile traffic was 25% of total traffic, and after the redesign mobile usage counted for 32% of total traffic. This means that a significant portion of existing traffic switched from desktop to mobile, but it also means that mobile counted for a significant portion of the net new traffic to the site.
• Tablet usage increased by 28%. This also accounts for the drop in desktop usage.

• Session duration only dropped by 13%. So people were spending nearly the same amount of time engaging with content, but doing so over fewer total pages. We also managed to drop page load time by 19% and server response time by 23% in the redesign, which means people spent less time waiting for pages to load and more time reading content.

  Looking at device-specific behaviour:
  • On desktop the bounce rate increased from 38% to 43% post-redesign, pages/session dropped from 3.1 to 2.5, and session duration decreased from 255 seconds to 209 seconds. This is due to people getting to the Arrivals/Departures page right from their search engine result page.
  • On tablet the bounce rate decreased from 57% to 49%, So we actually saw higher engagement, with pages/session increasing from 2.0 to 2.4 and average session duration increasing from 124 seconds to 178 seconds. This shows that providing an optimized content experience to tablet users actually increases engagement.
  • On mobile the bounce rate increased from 48% to 59%, an 11% increase. But actual session duration stayed very consistent, only decreasing from 222 seconds to 194 seconds. Considering that page load and server response dropped and that more than 60% of visitors arrived via search, this is a great number, meaning we generally got mobile users to the right landing page faster allowing them to spend about the same amount of time gathering information.
• Here’s an interesting one that speaks to new behaviour from customers. About 4-5 severe weather events generated news stories in Edmonton in the 2012-13 time period, and similar numbers were generated in the 2013-14 time period. However, website traffic spikes were 22% higher in the latter period with people checking the website. This suggests that the public perception of the new FlyEIA.com site is that it is a more trustworthy authority now than in the past.
   

Good content design is good for your customers

We’ve seen extremely encouraging numbers from the EIA redesign. Overall, during the time period we surveyed, there were 631,147 new unique visitors (49% of total visitors) post redesign versus 553,420 new unique visitors (43% of total visitors) in the same nine-month period prior to the redesign. This is an excellent sign of growth for a thriving organization like EIA.

To recap, here’s what we learned:

1. People on small-screen (smartphone) devices want the same content as people on desktop computers. This means congruency is key to success, but on mobile they will use search to link deep into your site. Planning for great SEO, content priority, and wayfinding/navigation on mobile is key to being successful.
2. People on tablets actually want to engage more with your content. So if you optimize for their screen size and create touch screen compatible interactions, customers will reward you with their time and attention.
3. Google loves responsive. Mobile optimization, single URLs, and faster page loads all improve your SEO. You will find more search-driven traffic even where you thought there was none.
4. Your homepage is more for you than for your customer. Think of it as a place for branding and introducing yourself, and as a useful spot to aggregate content that changes often (like news) for your regular visitors, but expect customers to deep link into content from search results.
5. Getting rid of mediocre traffic means some stats will and should drop. Expect some traffic to drop, especially to pages you treasure like your homepage. Expect number of pages/session to drop on mobile, impacting your total numbers since mobile users will grow substantially. This is a good thing! It means you’re providing better customer service.
6. Getting mobile right builds trust and reputation. By focusing on usability, congruency across devices, and interface/content design on the smallest screens, you may actually improve trust and reputation with your customer, which is an incredibly valuable commodity.

We’re really interested in how user behaviour changes with a strong mobile experience. If you’d like to talk about how this could impact your website, reach out. I love to share.

A special note: thanks to the Edmonton Airport Authority for allowing me to share some of their statistics in this article! Sharing data helps us all make a better Internet.

Source: Lessons from analytics on the value of a responsive design

© copyright 2014 by yellowpencil