Menu Search
Jump to the content X X
Smashing Conf Barcelona

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.

How To Use Analytics To Build A Smarter Mobile Website

Mobile first! Responsive design! You’ve heard all of the buzzwords and catchphrases. Countless helpful and not-so-helpful articles proclaim the rise of mobile, but what practical steps can you take to make your brand more approachable for mobile users?

When arguing a case to make a website mobile-friendly, abundant evidence exists to present to the business owner, such as the Pew Research study1 that shows that 56% of US adults carry around a smartphone. However, while general statistics are useful for demonstrating the value of designing with mobile in mind, they don’t provide the guidance necessary to understand precisely how users will interact with a particular brand on their phone.

Further Reading on SmashingMag:

Frequently, design and development teams will be asked to redesign a dated website to be responsive. Looking at existing data would provide crucial insight into how best to present information to mobile users. Google Analytics offers a number of free features for incredibly detailed analysis of mobile activity, with the ability to easily compare to desktop activity.

If you haven’t yet installed Google Analytics, setting it up is easy. Just create a free account5, and then Google will walk you through the process. You’ll need to place a tracking code in your page before you can start to collect the sort of data that we’ll review in this article.

Analyzing Mobile Visits Via Reports Link

The standard reports are where most people browse in Google Analytics. Let’s look at the most important ones for mobile activity.

1. Overview Link

This report (at “Audience” → “Mobile” → “Overview”) breaks down visits by mobile, desktop and tablet. It’s helpful for quickly seeing high-level statistics, such as what percentage of visits are from mobile devices.

Mobile Visits Overview Report6
A preview of the mobile overview report available in Google Analytics. (Large preview)

When clients question the value of making a static website responsive, I find that simply showing them how many mobile visits they’re getting often helps to convince them. If the experience of a significant portion of users is less than optimal, then the owner should realize that it’s time to take their needs seriously. In my experience, desktop activity accounts for only about 50 to 60% of visits, with mobile and tablet combined making up the rest (close to half!).

However, a development and design team should dig deeper than just an overview. This is where the “Devices” report comes in handy.

2. Devices Link

This report (“Audience” → “Mobile” → “Devices”) breaks down statistics into the specific devices that people use to access your website. The details here can help you pinpoint problems with usability on a particular phone, tablet or mobile operating system. For example, if the Galaxy S III shows a significantly higher bounce rate than the iPhone, then you might want to compare how your website appears on those devices.

Mobile Devices Report7
A preview of the mobile device report. (Large preview8)

While viewing the report for a local service-based business whose website focuses on lead generation, I saw significantly higher conversions from iPads than any phones in the list. Simply cramming the desktop website into a smartphone browser did not give users a positive experience with the lead submission process. However, at the tablet size, the website was still large enough for visitors to use the form easily enough.

As someone who manages online advertising campaigns, I generally find the opposite to be true, with tablets converting at a lower rate than phones. These statistics, then, reinforced the need to improve the mobile experience to bring phone conversions up to par. With a responsive layout that eliminates the need for the user to “pinch and zoom” to fill out the form in their phone’s browser, the website would perform more effectively.

Mobile Devices Report9
A preview of the screen resolution report. (Large preview10)

But this report doesn’t stop with a list of devices. You may also select various dimensions across the top to review factors such as screen resolution and operating system. Reviewing the most common screen resolutions of visitors will help you to plan the breakpoints of a responsive redesign. You can also flag an excessively high bounce rate or a low time on site for a particular resolution, which might be the result of content getting cut off at that size.

3. Browser & OS Link

This report (“Audience” → “Technology“ → “Browser & OS”) shows the main browsers being used to access your website, and it also highlights trends — for example, whether the default browser or Firefox is used more on Android phones. Also, you can view statistics by operating system and even add a column for operating system version (click the “Secondary Dimension” drop-down menu, and choose “Operating System Version”).

Mobile Operating System Report11
A preview of the operating system report. (Large preview12)

The report could also reveal how much effort you should put into making the website backwards-compatible. For instance, when reviewing statistics for an engineering company’s website, our development team found a significant number of visitors still browsing in Internet Explorer 8 (probably in offices whose IT departments are still debating whether to upgrade from CRT to LCD monitors!), with only a small percentage coming from mobile devices. These results helped to focus us on making the website usable on old systems.

Creating Advanced Segments Link

While the main reports provide plenty of helpful information, advanced segments enable you to drill deeper into useful data on mobile visitors. You can set up segments to distinguish between mobile, tablet and desktop visits, and even segment more narrowly by screen size and device.

To view advanced segments, make sure you’re in the “Reporting” tab in your Google Analytics account. Near the top of the screen (between the graph and the menu bar), click the drop-down arrow beside “All Visits.” A menu will appear allowing you to view existing segments and create new ones. In the “Built-In” segments, you should be able to select the default ones for “Mobile Traffic” and “Tablet Traffic.”

However, you’ll want to create a segment just for desktop traffic (because the only built-in option lumps desktops and tablets together).

Create Google Analytics Advanced Segment13
Creating a new advanced segment. (Large preview14)

Select “Create New Segment” and, in the new menu that appears, choose “Technology” in the left sidebar. Scroll down to “Device Category” and enter “Desktop.” Then, save the segment so that you can use it in your account.

Select Device Category15
Filtering a segment by device. (Large preview16)

You can apply advanced segments to reports throughout Google Analytics’ interface. I frequently use these when reviewing statistics in general, because user behavior on mobile differs so much from on tablets and desktops. In addition, when troubleshooting a spike in bounce rates or some other problem, I’ll often use these segments to determine whether the problem is specific to a device type. Below are some useful reports to review when filtering down to mobile traffic.

1. Pages Link

Here (“Behavior” → “Site Content” → “All Pages”), you can determine the top pages viewed by mobile users. This information is valuable for planning which navigation elements to include on mobile and for identifying any important pages that mobile users are not finding. In addition, comparing the top pages on desktop and mobile will yield insight into the different goals of each user type. For instance, a desktop user might browse heavily through your product inventory, while a smartphone user might just be trying to find an address to your nearest location.

2. Exit Pages Link

This report (“Behavior” → “Site Content” → “Exit Pages”) shows the last pages people view before leaving the website. When you’ve filtered down to a mobile segment, review the top exit pages and determine whether any mobile-specific problems are hindering visitors from completing the desired goal.

For example, we found that a lot of people, especially mobile users, were leaving our company’s website on pages that discuss particular services. To address this, we placed headers with brief “Contact us” messaging at the top of these pages.

3. Visitors Flow Link

This report (“Audience” → “Visitors Flow”) shows the top paths people take through your website. Again, comparing mobile and desktop behavior should help you to decide which pages to make most prominent at each size.

On one website, I found that the “About” page was one of the most common pages for users to visit on desktop. However, on mobile, the page was much lower down in the list, because the link to it was in a navigation bar that was barely noticeable on a phone.

4. Traffic Sources Link

This report (“Acquisition” → “All Traffic”) shows the top sources through which people arrive on the website. Comparing the mobile and desktop segments here will show whether any particular source skews towards mobile users. I’ve often noticed a higher percentage of traffic coming from Facebook on mobile than on desktop, because so many people access Facebook via a smartphone app. This awareness can help you to tailor your messaging at mobile sizes to people who have discovered your brand via social media. For example, if it’s a blog, make sure that the social sharing buttons are visible and functional on mobile.

In addition, this report can help you to diagnose problems with search engine indexing on mobile. In 2013, Google announced stricter regulations17 and penalties for websites with a poor mobile experience. If your organic traffic is steady on desktop but extremely low on mobile, then you might want to look for factors that are penalizing you on Google, such as Flash video or faulty redirects that take users from a subpage to the home page.

Act On The Data Link

If you have access to the Google Analytics account for the website you’re rebuilding, then you’ll have plenty of material to inform the design and development decisions. Take the time to review that data!

If you need to defend the value of making a website responsive, start by finding the percentage of recent visits from mobile and tablet. Move on to devices, browsers and screen sizes to decide which elements to include in the navigation for mobile. And use top pages, visitor flows and traffic sources to determine which content to make most prominent and how to guide users through the website at each size.

The most dangerous decision to make when planning any website is to ignore data about your audience. Any business that neglects to provide a friendly Web presence for mobile users will likely lose out on revenue to competitors who are doing it right. Design, development and marketing teams have a responsibility to use all of the data at their fingertips to guide decision-makers to make their websites work for a mobile audience.

Other Resources Link

(al, il)

Front page image credits: Timo Elliott23

Footnotes Link

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18
  19. 19
  20. 20
  21. 21
  22. 22
  23. 23

↑ Back to top Tweet itShare on Facebook

As a Senior Strategist at Overit, Tim Jensen oversees web advertising and analytics for a number of small and medium-sized businesses in a variety of industries. With a degree in Mass Media and experience ranging from freelance work to a full service agency setting, he has worked on countless campaigns that touch multiple aspects of both digital and traditional marketing strategy.

  1. 1

    Daniel Schwarz

    March 3, 2014 4:00 am

    I think GA can be very useful, and definitely helped me build a better experience, but it’s still incredibly buggy and leaves me with doubts if this service is accurate at all. Sometimes it records twice as many results, only to show correctly a few days later, or simply doesn’t record anything for days, and again…shows correctly a few days later. It took a lot working out how to record GA stats on subdomains, since the documentation isn’t that straightforward. Lastly, the keyword tool is useless, since 95% of searches are done over SSL.

    If you can look away from it’s downfalls, it’s a neat service.

    • 2

      Not to mention the occasions that I’ve witnessed it totally miss-recording all the data, only to be ignored by Google when I pointed out how inaccurate their data collection is…

      It has nice graphs, but I would never trust them over the server generated log files.

      • 3

        Daniel Schwarz

        March 4, 2014 6:14 am

        Have you always encountered this? For me, it’s been mostly since switching to Universal Analytics and I’ve noticed it since Real-time came out. You can see the data in real time, but it’s not actually collected?

  2. 4

    Aamir Afridi

    March 3, 2014 4:39 am

    Good guide. Learnt quite few new things :)

  3. 5

    Sankar Datti

    March 3, 2014 5:41 am

    Great Article Tim.

    Especially I liked the exit pages analysis on mobile. I have to check it out for my site.

  4. 6

    Justin Avery

    March 3, 2014 6:17 am

    We put together an overview dashboard to see how your mobile traffic was fairing and added it to the Google Marketplace:

  5. 8

    Arun Sivashankaran

    March 3, 2014 11:05 am

    Great post on using data to guide the design. Beyond putting together a responsive site, do you recommend redesigning the User Experience specifically for mobile users if the data supports it?

    • 9

      My bias tends to be toward taking a site responsive, as Google has spoken about preferring a responsive setup, and there are so many potential device sizes via which people will view your site even if the majority do end up being on mobile.

  6. 10

    Any ideas/best practices regarding experiments that run only on mobile traffic?

    I’m guessing that it’d involve a second Analytics account loaded via a server-side mobile detection script, but I’d love to be able to find a clear model for doing this.

    Our latest content experiment was frustrating – the “winning variation” declared by GA also happened to be the worst-performing variation when the experiment results were filtered to show mobile views only.

    Unfortunately, we couldn’t get a statistically significant result for mobile traffic, because the experiment ended too soon.

    It’d be great to be able to set up targeted A/B tests right in the GA dashboard, but that’s probably a ways off, if it ever happens at all.

    In the meantime, any suggestions from the community?

    (Great article, by the way. I miss GWO, but over the last 6 months or so, Content Experiments has really been stepping things up.)

    • 11

      Interesting question. I imagine as you said a server-side script, or a GA profile set up to show only mobile traffic, could work. I’d be curious to know if anyone has done this specifically and could share.

      Glad you enjoyed the article!

  7. 12

    No, so-called mobile websites are not always mobile-friendly ones. A website I often visit has a desktop version friendly to my computer and my Windows Phone, but awful on my former feature phone running Opera Mini, while its mobile version (seems) incompatible with both of my phones.

  8. 13

    Great points Tim. Thanks for sharing.

  9. 14

    Antonio Susta

    March 22, 2014 11:31 am

    Maybe GA is not perfect but to my knowledge it is working well and permits a lot of anlisys. Just coming back from a presentatoon with justin cutroni of GA and they are working hard to make it better. Personally i like it.thanks for this great article.

  10. 15

    Adrian Kaczkowski

    July 30, 2014 2:44 pm

    Tim great article! Daniel Shwarz GA is not accurate. Google made this tools no fairly accurate because one of the UE department says it should be this way, that only 70% of data is true and 30% should be inacurrate so bigger e-commerce companies starts to build data warehouse to have better grasp of real data showing them better results of their online marketing action or ux changes.

    I strongly recommend for middle and big size company to try, you can boost conversion and sales by better understanding of your customer behaviour and why they leave your website/shop or mobile app.

  11. 16

    Great article, could you (re)explain how to create a segment that *only* has desktop viewers? in my GA, the only segment I can choose is “Tablet and Desktop Traffic” – unlike your screengrab which does allow you to explicitly choose desktop.


  12. 17

    I spoke to soon – found it – thx!


↑ Back to top