If your website doesn't render correctly on mobile devices, you need to consider whether you make it responsive, dynamically serve content or build a parallel mobile version.
1. Google recommends webmasters follow the industry best practice of using responsive web design, namely serving the same HTML for all devices and using only CSS media queries to decide the rendering on each device.
2. Dynamic Serving: server responds with different HTML (and CSS) on the same URL depending on the user agent requesting the page. The contents of the response will vary depending on the user agent that requests the page.
3. Parallel mobile version: each desktop URL has an equivalent different URL serving mobile-optimized content. A common setup would be pages on www.example.com serving desktop users having corresponding m.example.com pages serving mobile.
For more details in French: http://www.mozalami.com/strategie-mobile-seo-3-options-2013/
2. • 01. Introduction
• 02. The 3 options
• 03. Pros and Cons
• 04. Best practices for 3
• 05. How to chose
• 06. Mobile SEO Challenges
• 07. Mobile site best practices
• 08. Extra
2
AGENDA
3. Mobile SEO
Introduction
Mobile Traffic Has Quadrupled :
1. Apple iOS holds majority of mobile
traffic at 52%, with Android OS at
43 percent of traffic
2. actual traffic from Apple’s iPad
grew 140 percent from the end of
2011 to the end of 2012
4. • Google recommends responsive web
design : same HTML for all devices
and CSS media queries to decide
rendering on each.
• Dynamic Serving: server responds
with different HTML (and CSS) on
the same URL depending on the user
agent.
• Parallel mobile version: each desktop
URL has an equivalent different URL
serving mobile-optimized content.
4
Mobile SEO – 3 options
5. 5
Mobile SEO – Pros and Cons
Responsive design Dynamic serving Parallel Mobile version
Pros 1 Url for both versions,
no duplication
Easier and cheaper to
maintain
Popularity consilidation
No need for redirection
1 Url for both versions,
no duplication
Popularity consilidation
Capacity to differentiate
mobile content
Better mobile experience
Easier implementation
Capacity to differentiate
mobile content
Better mobile experience
Tests can occur on both
separatly..
Cons Possible redesign
needed
Less differentiation of
mobile content
Lower mobile
focused user content
Complexity of technical
implementation
Higher cost of
maintenance
Standard can change
as browsers evolve.
Content duplicate risk
Split of link popularity
Higher cost of
maintenance
Need of simultaneous
content updates
6. 6
Mobile SEO – Best Practices
Responsive design Dynamic serving Parallel Mobile version
Allow search engines to
crawl page’s assets (css,
js, images..)
Beware of elements that
might not display
effectively on mobiles
(large images, javascript,
videos..)
Use a CMS or
Framework to facilitate
the implementation.
Server need to respond
with different html on the
same url depending on the
user-agent requesting the
page. Mobile users and
bots should see a different
mobile specific version.
Use the vary HTTP header
“User Agent” to help
Googlebot discover your
mobile optimized content
faster.
Enable a consitent mobile URL
structure under a “m” subdomain.
Use HTTP 302/301 directions to
refer mobile users and bots to the
mobile version.
Add link rel=”alternate” tags
pointing to the corresponding
mobile URL and link
rel=”canonical” tags to Desktop
URLs
Include a link to the relevant
Desktop page.
Generate an XML mobile sitemap
Make sure to optimize page speed, especially important for mobile due to bandwidth restrictions.
Validate that your mobile users see the same than the mobile search bots and avoid cloaking.
Do not block your mobile site from desktop or mobile crawlers with robots.txt.
7. • Aleyda Solis
created this
flowchart to help
decide which of
the 3 design
options is best for
your mobile site.
7
Mobile SEO –
How to chose
8. • Keywords : in 2009, Research from Google showed that feature
phone searches are slightly shorter than computer-based searches
(2.44 vs. 2.93). Recently in 2011, studies showed that search query
strings, on average, are 25 percent shorter than desktop searches.
• Mobile content : Because of the reasons above, mobile web sites
shall adapt their content. In the best practices on the Go Mo site,
Google advise creating extraordinary mobile experiences that add to
the brand value. The premise is to create desktop content for desktop
users, mobile content for mobile and Smartphone users, and tablet-
optimized content for tablet users.
• Duplicate content : Duplicate content is a challenging issue as we
should typically deliver same Desktop content but wrapped in a way
mobile users will be able to consume. Adding both tags Alternate +
Canonical will provide search engines with the relationship between
Desktop and Mobile pages.
8
Mobile SEO – Challenges
9. • Code compliance : We should address code compliance, create
unique CSS files, expand on the CSS files and minimize page code.
W3C released MobileOK (level 1.0) standard to help webmasters
ensure that their web sites would be accessible to mobile devices.
• Meta tags: Optimizing the Meta data, heading tags, alt tags…, is the
same as we would do for the desktop, but as we have different
keywords for mobile, we’ll use those instead. Mobile pages have so
little space for content, so titles matter even more than on a desktop.
• Site Load Speed : Google said this is an important ranking factor.
Mobile website speed will drive search engines’ decisions on what
mobile content to index and present. Google has compiled a bunch of
tools and introduced Site Speed reports by Google Analytics.
9
Mobile SEO – Challenges
10. Mobile SEO - Site Navigation & URL Optimization
(According to Matt Cutts)
Citations and Links.
11. • Link to Desktop version must be visible on mobile to allow switch.
• Link for Mobile via Link in page Header (Switchboard Tag)
<link rel="alternate" media="only screen and (max-width: 640px)"
href="http://mob ile.bell.com/page-english" /> (Source)
• Canonical: <link rel="canonical" href="Desktop canonical URL" >
(on Mobile pages)
• Redirect: redirect 302 desktop pages to mobile on user agent.
if (preg_match("/(mobile|webos|opera mini)/i",
$_SERVER['HTTP_USER_AGENT'])) {….
Googlebot-Mobile now crawls with a smartphone user-agent. Treat
Googlebot-Mobile request as it would do for a human user.
11
Mobile SEO – Best Practices
12. • Verify domain on Google /Bing
• Upload your sitemap
• Link into Robots.txt
<?xml version="1.0" encoding="UTF-8" ?>
<urlset xmlns=http://www.sitemaps.org/schemas/sitemap/0.9
xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0">
<url>
<loc>http://mobile.example.com/article100.html</loc>
<mobile:mobile/>
</url>
</urlset>
Source : Google Support
12
Mobile SEO – Sitemap XML
13. • HTML5 is most powerful language to develop mobile versions for
Smartphone, but most of mobile pages are developed using XHTML.
Meta tags we’ll be using and optimizing for search engines are :
• Language : <meta http-equiv=”content language” content=”en-
CA”> (fr-CA for french)
• Title: less than 55c, it must include Top keywords with “Mobile” and
branding. Create unique and keyword-rich title tags for mobile that
doesn’t exist on the desktop.
• Description: less than 100c, it’s used to encourage visitor to click
• Keywords: try to find most relevant keyword on targeted device...
13
Mobile SEO – Meta Tags
14. Content optimization
• Put emphasis on mobile Keywords
• Ensure mobile pages relevance to search engines
• Be consistent with Desktop alternate pages
Site speed
• Heavy images, lot of JavaScript and CSS make the user
experience poor by providing a slow site, Google will degrade
the site. Monitor performance using site speed tools.
14
Mobile SEO – Content
15. • We would prefer using HTML5 for coding.
• Try to validate the site using Ready.mobi or the W3C Mobile
OK validator. Validation by itself is not a significant factor in
ranking, but can make the site more usable.
• Iframe: better to avoid using it, but we learned that Google can
crawl iFramed pages and follow the links within them. If
iFrame is used, we may add alternate content:
<iframe src="source"><p>alternate text</p></iframe>
• Avoid drop down boxes without text equivalent.
15
Mobile SEO – Code
16. Robots.txt
• Do not block the mobile site from desktop or mobile crawlers with
robots.txt. Blocking a mobile site from traditional Googlebot with
robots.txt could make it invisible to Smartphone searchers.
Go further
• Advertise mobile content to mobile specific audience on mobile sites.
• Link out to mobile content to increase awareness and incent organic
reciprocation.
• Build links from other mobile sites and desktop sites that discuss
mobile content.
• Use Bell.mobi with redirect 301 to mobile website.
• Promote QR code when appropriate in offline advertising in mobile
context
16
Mobile SEO – Others