Complete Guide to Developing a Mobile Strategy

Do you have a mobile strategy?

Your mobile strategy can no longer be an after-thought.  Smartphone sales continue to grow rapidly.  There were over 300 million smartphones shipped in the second quarter of 2014, up 25% from the second quarter of 2013.  With the release of iPhone 6, there is now an even more aggressive marketing push by all of the major carriers to up the ante in terms of pricing and data – all likely to increase mobile usage.

People are not just buying more Smartphones, they are spending more time on them too.  In May 2014, 60% of “digital media time” was by mobile users.

Mobile platforms – smartphones and tablets – combined to account for 60% of total digital media time spent, up from 50% a year ago. And perhaps more impressively, mobile apps accounted for more than half of all digital media time spent in May, coming in at 51%.” – comScore

Source: http://www.comscore.com/Insights/Blog/Major-Mobile-Milestones-in-May-Apps-Now-Drive-Half-of-All-Time-Spent-on-Digital

Time spent on your Smartphone drives mobile website traffic.  Mobile traffic, as a percent of global Internet traffic, is growing 50% per year.  This growth rate is expected to continue (or accelerate) for the next few years.  Currently, mobile traffic represents 25% of overall Internet traffic.  On your site this figure may be higher or lower depending on your content and user demographics – I’ll show you in the next section how to measure your mobile traffic.

Source: http://www.kpcb.com/internet-trends

It’s clear that mobile usage is strong and growing.  What’s unclear is how to capitalize on it.  The first step is to gain a better understanding of your current mobile usage.

Understanding Your Current Mobile Usage

To develop a strong mobile strategy you need to understand your existing customer base.  You need to understand how mobile users interact with your site.  The best way to determine this is through Google Analytics.  If you don’t have Google Analytics…well…you really need to get it.

Google Analytics Mobile Overview Report

To start analyzing your traffic, go to: Audience > Mobile > Overview.

I then choose “Site Usage” from the Explorer tab.  From there, you will see a breakdown of your site’s traffic from three different “Device Categories” – desktop, mobile, tablet.  The table below shows the breakdown of one of my larger niche sites for a recent month.

This quick report will give you high level insights into your mobile traffic.  The items that you should pay attention to include:

• Sessions – This breakdown will show you the number of users who visit your website by device.  For my niche site (above), the mobile traffic is 42.64% of total traffic.  This is why I’m passionate about better understanding mobile!  If your existing mobile traffic is 10% or more, you need a mobile strategy.
• Mobile vs. Tablet – I generally consider tablet users to be closer to desktop users.  On my sites, the tablet experience is very similar to the desktop experience, while my mobile experience is completely different.
• Pages/Session – is the average number of pages viewed during a session.  If you see a significant difference between your mobile users and your desktop users then you may have a problem (or opportunity).
• Avg. Session Duration – is the average time length of a user’s session.  Again, you need to look for differences between session durations for your mobile users compared to your desktop users.

Google Analytics Mobile Devices Report

To get a deeper insight into your current mobile usage, you can view the Mobile Devices Report (Audience > Mobile > Devices).  This report allows you to view your mobile usage by several dimensions, including:

• Device Info – specific model (e.g., Apple iPhone, Samsung SGH T559N, etc.)
• Branding – Device manufacturer (e.g., Apple, Samsung, LG, etc.)
• Service Provider – Plan provider or ISP (wi-fi connections) (e.g., T-mobile, Verizon, Time Warner Cable)
• Input Selector – Touchscreen, stylus, joystick etc.
• Operating System – Android, iOS, Windows etc.
• Other>Screen Resolution – Device resolution (e.g., 320×568, 360×640, etc.)

Of these reports, I only pay attention to operating system and screen resolution.  For operating system, I like to know my breakdown of iOS (Apple) vs. Android.  For screen resolution, I like to know the most popular screen resolutions and their minimum widths (e.g., 320) – this will become important when you design your mobile specific or responsive website.

You can also gain more insights by choosing the “Map Overlay” from the Explorer Tab.  This will show you your mobile traffic (defined as mobile and tablet users) broken down by country (or other geographic regions).  A map overlay may be important for your business if you have large traffic volumes from multiple countries.

Comparative Date Ranges

To get a better feeling for your mobile opportunity, it can be helpful to generate a report that compares two different date ranges.

When I view my September stats versus my March stats, I see that my mobile traffic has increased 30.6% (from 31.49% of traffic to 42.64%)!  This is a dramatic increase in only six months.

Other Ways to Slice Your Google Analytics Data for Mobile Usage Analysis

There are a myriad of ways to slice your Google Analytics data to gain insights into your mobile usage.  The primary method I use is Advanced Segmentation.

Advanced Segmentation

The Advanced Segmentation feature of Google Analytics is one of the most powerful features.  Segments allow you to analyze subsets of traffic to gain deep insights.  Google Analytics comes with many pre-defined segments as well as the ability to create custom segments.  You can then use these subsets with any Analytics report.  For example, I like to see how the mobile usage varies across different areas of my website.  I can see this by pulling a Site Content report and segmenting the results by Mobile versus Desktop/Tablet.  I show the steps below:

Step 1) Pull the Site Content Report (Behavior > Site Content > All Pages) and use the search box (or advanced filter) to select the pages you are interested in.

Step 2) Build Segments for Mobile and Desktop and Tablet Traffic

First select the +Add Segment box at the top of the page.

Then select the “Mobile Traffic” segment name from the list of available pre-defined segments.

Then create another segment for “Tablet and Desktop” Traffic.

You will now have your traffic to those specific pages segments by Mobile vs. Tablet and Desktop traffic.

For these set of pages, my mobile traffic is only 27% (19,000 pageviews/70,091 pageviews) of the traffic.

You should now have a better feeling for the amount of mobile traffic you are getting to your website.  The next step is to gain an appreciation for how mobile users view your site.

How Mobile Viewers See Your Site

It’s critically important to understand how your mobile viewers actually see your website.  There are three ways that I use to view how my website is seen on mobile devices: Browser emulation, View on actual devices, and Mobile emulators.

With any of the approaches, you should be evaluating the following:

• Content – how does mobile content appear?
• Images – are they sized (resized) appropriately
• Tables – do you have tables in your content?  Are they fully visible in a mobile browser?
• Navigation – are your menus working well?  Do your breadcrumbs appear and work well?
• Buttons – are your buttons easy to select on a mobile browser?
• Ads – are your ads appearing as expected?

With all that in mind, here are three approaches to understanding your user’s mobile experience.

Browser Emulation

I use the developer tools option on Google Chrome to see how my site looks on various mobile devices.  If you are not familiar with this approach, it is a great option.

To enable the developer tools in Chrome, you can either press Ctrl + Shift + I or select the Chrome menu and choose Tools > Developer Tools

When the Developer Toolbar loads on the bottom of the screen, select the “Emulation” icon (a small mobile phone icon at the top left of the toolbar) to display the Emulation Screen.

Once you have the Emulation screen loaded, choose a device to emulate (e.g., Apple iPhone 5).  I also deselect the Shrink to fit checkbox so that I can see how the site looks at the actual size of the phone.

The Chrome emulator does a good job of presenting the site as a mobile user would see it.  I frequently use this approach when I am developing posts to see how they render on a mobile device.

Use the Actual Devices

Just to be sure, you need to view your website on some actual devices (smartphone, tablet etc.).  Emulators do a pretty good job, but there is nothing like seeing how the site operates with a real device.  Start with your own device.  Borrow some devices from friends and family.  If all else fails, head to an electronics retailer like Best Buy and have a go at viewing your site.

Use a Web-based Emulator

MobilePhoneEmulator.com

This free tool allows you to emulate 9 popular devices.  The emulation seems to work well, but I have yet to figure out how to emulate scrolling.

Mobiletest.me

This free tool allows you to emulate 6 popular devices.  Very easy to use and seems accurate.

Quirktools Screenfly

Very nice tool.  Allows you to emulate 9 mobile devices, as well as a variety of other desktops, laptops, tablets, and custom screen sizes.  I like that it allows you to rotate the device as well.

Now that you have a better idea of how your users experience your current site, it’s time to understand your options for a better mobile experience.

Mobile Strategy: Responsive Design vs. Separate Mobile Site

When you are determining your approach to a mobile website strategy, there are several distinct approaches: responsive design, adaptive design, a separate site or a mobile app.  Each of these approaches has their advantages and disadvantages.  I will focus on the two most prevalent, responsive design and separate mobile website.

Responsive Site Design

Overview:  A responsive website will determine your user’s device and deliver a view that is designed to optimize their experience.  Typically, this will involve changing aspects of the page layout to appropriately work within the width of the browser window.  A responsive design will use the same code and utilize the same URL structure as the desktop site.

Advantages:

• Once your template is finalized, you will only have to maintain one set of content.
• No redirections.  Your users aren’t sent to another site/subdomain.
• Since the URL structure is the same, all of your inbound links will only point to one place (not one for mobile versus one for desktop).  Google prefers that you use a responsive design versus a separate mobile site (makes it easier for them to crawl, etc.)
• The responsive design works well for different monitor sizes, not just mobile devices.

Disadvantages:

• Implementation can be challenging and costly – you will have to redo the entire website.
• Mobile site will be slower.  For example, images are fully downloaded and then resized.
• Full content is downloaded, whether or not it is relevant/useful to the mobile user.

Separate Mobile Site

Overview:  A separate mobile website is a distinct website usually hosted on a separate subdomain or URL (e.g., m.mysite.com or www.mysite.com/m).  The site will typically have completely different content, reduced functionality, and simplified navigation compared to a desktop site.

Advantages:

• Your content can be optimized for mobile users requirements.  You can choose to only display certain pages or certain content pieces.
• Design can be enhanced.  When you are building a mobile website from the start you can tailor the look and feel of the site to a mobile device.
• Navigation can be streamlined.  Your mobile users may have specific needs (like locations, hours, contact information).  You can make it easy for your users to get the information they want.  On a mobile website, you can also enlarge buttons that make them easier for touchscreens.

Disadvantages:

• A separate mobile website is harder to optimize for the myriad of devices and screen sizes.
• Visitors switching between devices might be confused.  If you have a user that switches between their smartphone and their desktop, they might not be able to relocate the content that they were interested in.
• You now have two sites to maintain.  You now have to worry about two sites and make sure they are both working well and up to date.

Mobile Website Monetization

So how is revenue affected by mobile usage?  The answer is…it depends on your site demographics and how you monetize.

e-Commerce

According to comScore’s “State of the Mobile Industry Report”, mobile commerce (m-commerce) accounted for 11.1% of all e-commerce sales in Q2 2014.  This is an increase of 2.5 percentage points over Q2 2013.

Source: comScore, State of the Mobile Industry Report, September 2014.

Mobile Advertising

According to the comScore report, $7 Billion in ad spend was delivered via mobile in 2013.  While this only represents 16% of the total $43 Billion ad spend, it did increase by a staggering 110% compared to 2012.  While some properties (e.g., Facebook and Twitter) have reported strong mobile ad sales, many properties are seeing worse results from mobile compared to desktop.

There are several approaches to improving you mobile advertising revenue streams.

Optimize Adsense

Google has been a little slow to get on the mobile bandwagon in my opinion….and their recent revenue results reflect this.  Google’s ad CPC (cost per click) dropped 6% largely because of the shift to mobile advertising

The revenue opportunity is very, very high, but right now mobile does not monetize as well as other forms,” Nikesh Arora, Google’s chief business officer (7/17/14 Q2 Results conference call).

Google Adsense does offer three opportunities for mobile advertising

Mobile-friendly ad sizes – Google offers several ad sizes that work well on mobile devices.  The recommended sizes are: 320×100 (large mobile banner) and 300×250 (medium rectangle).  Other ad sizes which can work on mobile include: 320×50 (mobile leaderboard), 250×250 (square), and 200×200 (small square).

Responsive Ad Units – Google released responsive ad units in Beta in July 2013.  Google’s implementation of responsive ad units has the following benefits:

• Automatic sizing – Google’s ads will dynamically adapt to the width of the ad unit’s parent container/div.
• Adapts to screen orientation changes – when a user’s device changes orientation (e.g., from landscape to portrait), a new responsive ad will be loaded with the correct dimensions.
• Advanced mode – if the auto sizing does not meet your needs, and you feel comfortable with CSS, Google allows you to customize your responsive ads.  More information can be found at: https://support.google.com/adsense/answer/3543893#adv

Mobile Anchor Ads – Google released mobile Anchor Ads in November 2013, but they are still in beta mode.  Mobile Anchor Ads are 320×50 banner ads that stay (anchored) at the bottom of a mobile devices screen when users scroll up or down.  Users can dismiss these ads by “touching” the prominent down arrow as shown below.  I have started testing these mobile anchor ads…but the preliminary results are mixed.

Implement Other Ad Networks that are more mobile ready

If you find that the options (or eCPMs) of Google’s Adsense don’t meet your requirements, you should experiment with other mobile-friendly ad networks.  Here are some ad networks that you should look into: Media.net, Chitika, and Mojiva.

Is Your Mobile Strategy Up To Date?

The opportunities (and threats!) from mobile are too big to ignore.  Make sure you understand your current mobile landscape and what mobile users need from your site.  Determine your best approach to optimize your mobile site and don’t forget about improving your monetization!

How are you taking advantage of the changing mobile environment?  Let me know in the comments below.