SMX London 2014 - Best Practices for Mobile SEO - Shawn Dragann
-
Upload
idea-evolver -
Category
Marketing
-
view
1.148 -
download
0
description
Transcript of SMX London 2014 - Best Practices for Mobile SEO - Shawn Dragann
SMX London 2014Mobile Search Best Practices
2
Search Powers Apps
*Apple MapsYahoo Stocks
Apple App Suite*Google Maps
GmailPandora Radio
*YouTube*Google Search
*Google PlayFacebook
0 20,000 40,000 60,000 80,000 100,000
Avg. Monthly Smartphone Visitors
Source: ComScore 2014 U.S. Digital Future in Focus
Search48%Other
52%
Search Apps vs. Other
86% of time on iOS and Android devices is spent on apps
3
Search Experience Optimization
• Experiential Content
• Design for Emotion
• Technical Compliance
4
Mobile is the Strategy
mad men whiskey old fashioned
Mobile Search Data and SERP Analysis
Identify In-Demand Content:• Understand your audience personas• Audit social search results for in-demand media
5Source: Google Trends
Mobile45%
Tablets12%
Laptops43%
Searches by Devices
old fashioned
6
Site Experience
Mobile User Experience
• Embrace mobile design constraints• Optimize for PageSpeed• Focus on goals and the path of least resistance
7
Mobile friendly video content.
Properly sized tap targets.
Legible font sizes.Small screen sizes and slow connections.
Source: Google PageSpeed Insights
Design for Conversion
Make it easy and fun for users to create content and complete tasks:• Minimize requirements• Use HTML5 input elements if possible• Use autocomplete, autocapitalize, autocorrect• Show completion progress where applicable• Implement client-side validation• Use top-aligned and/or in-field labels• Test forms on iOS and Android devices• Test form designs with keyboard in view• Favor new content input methods
– camera, mic, location
8
Supported Mobile Configurations
DYNAMIC SERVING
Different HTML on the same URL based on user agent
SEPARATE MOBILE URLS
Separate mobile website best hosted on a subdomain
RESPONSIVE WEB DESIGN (recommended)
CSS drives the experience mostly based on screen size
9
Dynamic Serving
JavaScript agent detection generates different HTML on one URL:– Most difficult for Google to interpret– Slower than other configurations– Requires Vary: User-Agent in HTTP header
10
GET /page-1 HTTP/1.1Host: www.example.com(...rest of HTTP request headers...)
HTTP/1.1 200 OKContent-Type: text/htmlVary: User-AgentContent-Length: 5710(... rest of HTTP response headers...)
Separate Mobile Site
Hosts a mobile version of each page on a subdomain (m.example.com)– Fastest of the three configurations– Most complex setup, most maintenance, and most prone to error– Not a solution for large screens
11
Separate Mobile URLs Done Correctly
12
• A desktop search returns the desktop page
• A mobile search returns the corresponding mobile page
Responsive Web Design
• Responsive web design is the recommended configuration:– Avoids the complicated setup of a separate mobile site– Consolidates all experiences to one URL– More future-ready as new devices become mainstream
13
Selecting the Right Configuration
The primary drawback to responsive web design is load time:– RWD is the future, but is currently slow and not feature-phone compliant– A separate mobile site is the fastest and most tailored mobile experience– The future of RWD includes adaptive content and dynamic properties
14
Separate Mobile Site RWD Desktop0
5
10
15
2.81
13.5511.64
Average Load Time in Seconds
Source: High Performance Responsive Design By Tom Barker – O'Reilly Media
Mobile First Social Search Networks
Mobile first social networks are surging:• Camera content is driving traffic and engagement• Emerging networks have virtually no laptop traffic
15Source: ComScore 2014 U.S. Digital Future in Focus
99%P
INT
ER
ES
T 98%
INS
TAG
RA
M 99%
VIN
E
86%
TW
ITT
ER
Prepare for Google Now
Next generation search minimizes the need for search queries:• Improved support for natural language and question answering• Improved context and location awareness• Increased personalization around user personas
16
17
18
GLOBAL SMARTPHONE PENETRATION
SpainFrance
ItalyUK
GermanyJapan
USA
0 50 100 150 200 250 300
With Smartphones Without Smartphones
Source: ComScore MobiLens, 3 month average ending July 2013. Figures in millions.
74%59%59%70%59%
36%60%
19
MOBILE IS DAILY LIFE
use their smartphone to visit a social network every day 53%
Source: Google Our Mobile Planet: United Kingdom May 2013 – http://goo.gl/7HpOII
search on their smartphone every day54%
20
17%
ON
-TH
E-G
O
MOBILE NEVER SLEEPSA mobile user is more likely to be at home than on the go!
68%A
T H
OM
E
2%
IN A
ST
OR
E9%
AT
WO
RK
Source: Google – Creating Moments that Matter
21
MOBILE IS ROUTINE
Source: ComScore 2014 U.S. Digital Future in Focus
22
MOBILE CLOSES THE DEAL
Source: Google – Creating Moments that Matter
of mobile searches result in conversions 28%
of mobile searches trigger additional action and conversions73%
SEPARATE MOBILE URL CHECKLIST
23
Requirement DetailsSitemap Alternate: Alternate URL appears in sitemap
Page Alternate: Alternate URL appears on page via rel=“alternate” tag
Alternates Match: Alternate URLs in sitemap and on page must match exactly
Canonical Match: Mobile canonical URL must match desktop canonical and sitemap URL
Mobile Page Web Response: The mobile page should return a 302 redirect to web users
Mobile Page Web Vary: Use Vary: User-Agent in the HTTP header
Mobile Page Smartphone Response: The mobile page should return a 200 status code to smartphone users
Mobile Page Smartphone Vary: Use Vary: User-Agent in the HTTP header
Mobile Page Mobile Response: The mobile page should return a 200 status code to feature phone users
Mobile Page Mobile Vary: Use Vary: User-Agent in the HTTP header
Desktop Page Web Response: The desktop page should return a 200 status code to web users
Desktop Page Web Vary: Use Vary: User-Agent in the HTTP header
Desktop Page Smartphone Response: The desktop page should return a 302 redirect to smartphone users
Desktop Page Smartphone Vary: Use Vary: User-Agent in the HTTP header
Desktop Page Mobile Response: The desktop page should return a 302 redirect to feature phone users
Desktop Page Mobile Vary: Use Vary: User-Agent in the HTTP header
Source: http://goo.gl/ytqD55
CITED AND ADDITIONAL RESOURCES
Google• Mobile Search Moments Study: http://goo.gl/X6Gg7u• Mobile Path to Purchase: Five Key Findings: http://goo.gl/yT4XDH• Building Smartphone-Optimized Websites: http://goo.gl/o0pOFS• Our Mobile Planet: http://goo.gl/yTGIkY
Other• Developing Web Content for Safari: http://goo.gl/RFTh9M• Organizing Mobile: http://goo.gl/rIEuyR• Google Lays Out It’s Mobile User Experience Strategy: http://goo.gl/
WatWwS• 2014 U.S. Digital Future in Focus: http://goo.gl/KWGVM1
24