When Matt Cutts speaks, everybody – from his worst critics to his most audacious fan boys – listens in. So when the grandmaster of Google’s web spam team took to the stage at PubCon and stressed the importance of mobile not once but several times, you better believe that it’s something Google thinks is important. In fact, it wasn’t just at PubCon – he said similar things at SMX Advanced, too.
Given the recent discourse from the talking head of the search engine giant, it’s as good a time as any to take a serious, no-holds-barred look at mobile again.
“Should” is “Must”
It’s not that you “should” have a mobile strategy; it’s that if you don’t, money is leaking out of your pockets and right into someone else’s. At this point in the history of the web, nobody should need to build a case for mobile. Likewise, nobody should be in need of convincing that mobile usage is a “trend” that is growing like a weed.
Still, I’m going to devote enough time for A few stats to do exactly that.
- At the end of 2012, there were 2.1 billion mobile web users. In fact, it’s estimated that by 2014, 50% of all web traffic will be mobile. More interestingly, though, 1 billion of those web users used mobile as their primary access point to the web (the number is higher depending on who you ask). And while the percentages of mobile-only searchers in developed countries like USA is lower…
- 46% of searchers now use mobile exclusively (as in, no desktop involved) as their research tool. That means that even among developed countries, many customers’ first impressions of your website are on a mobile device. In fact…
- 79% of all smartphone users use their phone to aid in shopping (Nielsen’s Mobile Consumer Report is far more conservative at 30% of U.S. customers, while comScore says 4/5 consumers – the point is, these are all huge numbers); many times while at the point-of-sale for product comparison. Your desktop website might get them in the door (though mobile. And when your website fails…
- Google reports that at least 40% of mobile consumers will turn to a competitor’s website after becoming frustrated with yours. Common sense reports that unless someone is REALLY interested in what you have to offer, they’ll either close the browser or delay their decision until they get to a desktop.
As a bonus, here’s one more stat that should perhaps put those who haven’t embraced mobile temporarily at ease:
- Only 6% of the top Fortune 500 companies have sites that complied with Google’s mobile requirements.
So if you haven’t moved yet, at least you’re in good company. If, for some reason, you need even more stats to convince you (or someone you love) that ignoring mobile is a terrible idea, you’ll find a bevy of helpful numbers here, here and here.
But bigger than any stat is the following: Next time you’re in a public space, simply look around and count how many people are staring into the glow of their phone. Mobile is here, mobile is now. Don’t wait to be convinced – your market isn’t.
Enough with stats, let’s talk action!
What does Google want from your mobile site, and how can you give it to them?
(Note: I’m going to borrow heavily from Vanessa Fox’s Definitive Guide to Technical Mobile SEO here. If you want a more technical breakdown, that’s where to look.)
There’s no mystery to how Google recommends you build your mobile website. You’ve got three acceptable options:
1. Build a responsive website.
If, like me, you’re not technically inclined, “responsive” means that your pages will serve the same content to all users (and on the same URL), but will change the appearance of the content based on the device used to access it (screen size, removed images, less text, a streamlined navigation and so on).
(A little shameless self-promotion. The above is my Zombie 404 page, which has been built to be mobile-responsive)
Some major pluses here:
- Pages will share indexation and ranking factors (links, URLs, etc.)
- No redirects are involved (faster loading and rendering, less chance for error or incorrect identification of the device)
- It’s much easier for users to share and interact with your content
- Google’s poor crawlers don’t need to work as hard as they would if they had to index multiple different pages or versions of content
2. Use Device-Specific HTML
Like responsive, dynamic serving will show all of your content on the same URL. The difference is that depending on the device being used, the content presented (HTML and CSS) will change (instead of re-scaling the same content to the device). This can be tougher to implement, and Google’s advice for developers who take this route is to prompt Googlebot-Mobile to crawl this content by including a “Vary: User-Agent HTTP header.”
As for what that means, let’s get the info straight from the horse’s mouth:
“The Vary HTTP header has two important and useful implications:
1. It signals to caching servers used in ISPs and elsewhere that they should consider the user agent when deciding whether to serve the page from cache or not. Without the Vary HTTP header, a cache may mistakenly serve mobile users the cache of the desktop HTML page or vice versa.
2. It helps Googlebot discover your mobile-optimized content faster, as a valid Vary HTTP header is one of the signals we may use to crawl URLs that serve mobile-optimized content.”
In other words, you need to implement this to make sure your content gets crawled and discovered quickly.
3. A Mobile-Specific Website
In the early days, Google actually recommended mobile-specific websites before changing their minds to responsive. A mobile-specific website is simply a website built on a sub-domain (ie: m.websiteexample.com). Google doesn’t play favourites with any particular URL format, as long as you ensure they’re accessible to both Googlebot and Googlebot-Mobile.
(Above: BrokerLink have opted for the sub-domain approach (m.brokerlink.ca); the experience is tailored for mobile interaction)
And while it’s the most complicated option thanks to redirects, canonicals and other attributes, it’s still a viable option. The major downside is that link value between the sub-domain and primary domain may not be shared. Add in the fact that you’ll need to manage the websites separately, and the option looks less attractive.
Here’s what you’ll need to do to keep it all kosher with Google:
- Use annotations. On the desktop page, add a rel=”alternate” tag pointing to the corresponding mobile page to help Googlebot find your site’s mobile pages and understand the relationships between them.
- On the mobile page, eliminate confusion and the potential for duplicate content issues with a rel=”canonical” tag pointing back to the proper desktop page.
You can apply this with both HTML in the code or within the sitemap. Both formats help Google understand that the two pages should be treated as one entity. Without this, you run the risk of having both rank (poorly) in search results.
Waiting is Not One of Your Options.
I understand budgetary constraints; bringing your website in line with mobile requirements can be expensive – especially if it requires a complete redesign. But saying that you will wait until your site’s next major overhaul to take on the mobile beast is like saying you’ll start bailing out the boat when you can only see the mast above the water.
It is far better to apply one of the previous options to even the core, most important pages of your website today than to wait until you have budget to revamp everything.
Other Important Structural Notes
1. Don’t ReDIRECT All Pages to Your Mobile Homepage
If someone clicks on an internal page in the search results and is then redirected to the home page of your mobile website, that’s a terrible user experience. This issue came up at PubCon, and is clearly explained in Google’s guidelines as well as a webmaster central blog about faulty redirects. Matt Cutts explicitly stated sites that do this will see their rankings suffer.
In cases where you do not have a mobile page of content to match the primary page, display your desktop website. Though it is still not ideal, it’s a far better experience for users. You especially do not want to use mobile-only 404′s – (though this is largely a thing of the past).
2. Slow Load Times Will Hurt You
Another nugget of info taken from Cutts’ PubCon talk was that Google will be less likely to rank slow-loading websites on mobile devices. Google’s blog references this piece on making your mobile web pages render in under one second, as well as this blog of their own, so both are worth a read. They’re fairly technical, but I’ve paraphrased here:
What that means for you is:
- Eliminate redirect chains and loops, and cut down on redirects wherever possible. Each adds a minimum of 0.6 seconds to the load time.
- If using a mobile-specific website, make your redirects cacheable.
You can use Google PageSpeed Insights to assess the speed issues facing your site.
3. Flash is Bad for BUSINESS (Just like always)
Another notable quote to come out of PubCon was Cutts’ reference to Flash. Flash-based results will NOT be shown in search results served to mobile devices that cannot display Flash. If your site heavily uses Flash, it’s time to cut down – or serve up a mobile-specific website that doesn’t use it.
Mobile UX DEsign
”If your website looks bad in mobile, now is the time to fix that” – Matt Cutts, Pubcon 2013
One thing is abundantly clear: Google is supremely interested in the user experience on your mobile website. There are entire books written about mobile design; I can’t hope to capture all of that here. Still, I want to address a few specifics and best practices that I still see a lot of people getting wrong. (After all, if industry juggernauts Moz.com still aren’t mobile-friendly, there’s bound to be others!)
For more on mobile UX, here are some of the best mobile design resources I’ve come across:
- Elements of the Mobile User Experience
- Mobile Web User Experience Best Practices
- Designing Content for Multiple Mobile Devices
Allow Users to choose
It’s among the basics, but it’s overlooked. Allow users to override whether or not they want to see the mobile website – especially when your mobile website experience is incomplete (not a 1-to-1 match of desktop content to mobile). Make this option prominent.
You may also want to monitor the paths of those who choose to visit the desktop site from their mobile device – what is it that they wanted to do, and couldn’t? This could point to holes in your mobile experience.
Promoting an App? Choose a banner.
If you use your mobile website to promote your mobile app, it’s tempting to have a pop-up upon arrival. Google’s not a fan. Using “App download interstitials” (a fancy word for annoying your visitors with popovers) can cause indexation issues and disrupt the visitor experience.
Google recommends using a simple banner to promote the app, in line with the rest of your content. Yes, that may impact downloads – but a little creativity an innovation in how you display your CTA can help you recover without putting your audience off.
Auto-Fill Forms and reduce textual inputs Whenever possible
Another PubCon takeaway was a recommendation from Cutts to use Chrome’s autofill features whenever possible. Beyond this, though, textual input on a mobile device is a serious pain. Reduce forms and fields to only those absolutely essential, and auto-fill whenever safe to do so.
Show Tablet Owners the Desktop Site
This only applies in situations you’re running a mobile subdomain, or in rare cases where your device-specific HTML does not account for tablet-sized screens (it should).
Based on Google’s observations, tablet users don’t want to be served your smartphone website and expect the same experience as a desktop (these devices are often used on wifi, while stationary).
Use Media Carefully
Google comes out in force against “Unplayable videos” (Flash, licensing constraints, etc) – but users will come out in force against any website that auto-plays ANYTHING, does not allow them to pause/stop video media or loads up their bandwidth with excessive use of images.
Design to Context
If you only read one piece I share in this write-up, make it this one from Smashing Magazine. There are also tons of resources on mobile context at the bottom of this piece from Cloud Four. While there are best-practices surrounding mobile UX (fat-finger-friendly navigation, core features front and centre, etc.), the biggest takeaway should be to design toward the context the user is in when they access your website.
You can mash-up location data to help decide what to serve.
- CTA’s and contact information may vary – especially among “Soft” conversions. For example, visitors accessing United Airline’s website while in an airport are likely to want to see flight arrival/departure times and gates – not the chance to “buy tickets”. How do you want people to convert on your mobile site? Is it different than on your desktop? If so, you’ll need to choose form – and function – carefully.
- Use media to your advantage in situations that allow for it. For example, a cooking/recipe website might opt to have video or audio cues for sticky-handed chefs (Smashing Magazine uses the iCookbook app as an example, but this could be recreated in part on a website)
- Understand the mindset of the audience visiting the site. Learning Solutions Magazine breaks this out beautifully into seven categories:Connect (social activity), Search (information-seeking), Entertain (listening, playing or viewing media), Manage (coordinating the aspects of everyday life), Inform (viewing news portals/blogs for timely or archived news), Shop (product and price comparison, end-purchase) and Navigate (location activity like GPS)While in each different mindset, needs are different – as is level of active involvement. Design for these mindsets and streamline experiences to accommodate.
Mobile Content Creation
As a last point, I wanted to quickly address what I see as a major misconception in mobile. Remember that stat I shared earlier about how, for over 1 billion people,mobile is their primary internet access point? There’s a rise in the “Mobile Only User”, something Karen McGrane alluded to in her 2013 “An Event Apart” presentation.
And if mobile is your only access point to the web, you’re using your phone for a lot more than cat videos and seeking out pizza joints. It’s time to rethink how people interact with their mobile devices and take a more international view.
Yes, attention spans are short on mobile – and they’re the same on desktops, living room couches, offices and just about anywhere else. If we’re not captivated, we’re moving on – and fast. As such, there is no such thing as “writing for mobile”.
The idea that all mobile content should be short is flawed at its core, since users will bring long-form content intent to their queries.
In fact, content on mobile is more about structure and layout than it is about length or style. Why should mobile deserve “short, punchy content”? Does the desktop then fall under “meandering and irrelevant”? What’s good for one should be good for both.
Likewise, why do mobile users deserve less of your content than desktop users? Surely, if the information is good, they too would benefit. In Karen’s words, “It’s our responsibility to make sure they get the same information, regardless of platform or screen size.”
So my advice?
Start with Mobile!
Write your content and design your website with a mobile-first mentality. When we design or write for mobile, we’re already in hyper-critical mode – the superfluous is cut, the relevant stays, the experience must be lightning-fast and brain-dead-simple. Why muddle it up on any other platform?
Achieve content parity first – and then take it back to what we talked about earlier and design for the contexts surrounding that content.
And that’s gonna do it!
Let’s sum up with a brutally honest self-critique:
- You need to do more than be “mobile-ready”, you need to be mobile optimized.
- Statistics say you probably aren’t yet. Those same statistics say you need to be – and so does Matt Cutts. Time to listen up and get moving.
- Waiting is not an option. Mobile has arrived. It arrived years ago. If budget constraints apply, do what you can – and do it now.
- There’s a HUGE abundance of information out there on Google’s recommendations, proper UX design and mobile content, so feigning ignorance isn’t an option either.
Go forth, and make the mobile web a better place because you’re a part of it.