Mobile-Friendly SEO: Why & How? Ari Roth at SMX Israel 2015

@aroth26 bit.ly/mobile-friendly-seo

Mobile-Friendly SEO: Why & How?

Ari RothSMX Israel 2015


Ari Roth• Senior Digital Marketing Manager at Jerusalem’s DriveHill Media• SEO• PPC• Ecommerce consulting• Email marketing

• Head of SEO audit efforts at DriveHill


Background on Mobile Web & Search


The Meteoric Rise of Mobile 2007 – iPhone introduced 2008 –1st Android phone – HTC Dream 2010 – Android sales pass iPhone sales



Mobile Overtakes Desktop in Web & Search

Web May 2015 Google announcement:

“More Google searches take place on mobile devices than on computers in 10 countries including the US and Japan.”

October 2015 Google SVP of Search: "For the first time, we’re getting more

searches on mobile devices than on desktop“ ^ CLARIFIED TO BE WORLDWIDE!

Search


What Does Mobile-Friendly Mean?

Factors that are considered by search engines (discussed more by Jonathan): Usability

Navigational spacing & clickability Readability without zooming or side scrolling Content loads on mobile

No Flash No mobile-only 404s No faulty redirects

No interstititals Page load speed Crawlability

Don’t block Javascript or CSS


Your Site Isn’t Mobile-Friendly?No Tags for You!

ANSWER #1: Your site will not have the “mobile-friendly” label in search results.

Negative CTR effect

Google launched this in November 2014

Bing followed suit in April 2015

#SEOFAIL


Your Site Isn’t Mobile-Friendly?MOBILEGEDDON!

ANSWER #2: Your site will rank significantly lower in mobile search!

On April 21, 2015, Google launched an update which incorporated mobile-friendliness as a direct ranking factor in mobile search results. Depending on the industry, this could have a huge

effect on your organic search traffic.

Bing announced they will follow suit

How big is the effect? Google: bigger than Panda or Penguin!


LET THAT SINK IN…4%12%


LET THAT SINK IN…


Case Study Non mobile-friendly Furniture Retailer in Internet Retailer’s Second 500 for last 2 years

Following update, they lost: -11.44% of their mobile organic traffic -14.63% of their mobile organic transactions


Case Study (contd.) Mobile site was in development at time of update, went live in mid-May

Gains took over a month to be seen – takes time to crawl!

Starting in July: Mobile organic traffic surged over +30% over the next 2 months compared to the 2 months prior Mobile organic transactions went up almost +20% from this segment of traffic

@aroth26@aroth26 bit.ly/mobile-friendly-seo

Mobile is an “add on”… Let’s get our website right before we go

there!

OLD SCHOOLMARKETE

R

@aroth26@aroth26 bit.ly/mobile-friendly-seo

Mobile is an “add on”… Let’s get our website right before we go

there!

OLD SCHOOLMARKETE

R


Options


TECHNICAL CONTENT AHEAD


Comparing the 3 Main OptionsOption Same URL? Same HTML? Vary:

User-Agent?Redirects? Rel=“Canonical” &

Rel=“Alternate”?

Responsive Design

Dynamic Serving

Separate URLs

Step by step checklist found here: bit.ly/ari-roth-mobile-seo-checklist


Google & Bing’s preferred option

Jonathan will go deeper into this option: Technical to-do’s Server configuration Implementation errors Etc.

Same URL & HTML for mobile & desktop

CSS changes the layout for each browser

Example Site: BostonGlobe.com

Responsive Design


One URL Good for SEO

All links to one URL No crawling / indexing many URLs

Good for sharing Good for developers

No complicated device detection, redirection, annotation

Easier to maintain

Responsive Design: Pros


Responsive Design: Cons

Possible slow page load b/c lots of code 3G < Ethernet

Can’t fully optimize for either category: Changes made to desktop show up on mobile Changes made to mobile show up on desktop


Same URL for both mobile & desktop

Different HTML code for each device, based on server detecting user-agent. Different images Different navigation Different text

Dynamic Serving


Cloaking is showing different user agents different content and can cause penalties.

Problem: dynamic serving looks like cloaking!

Solution: Add “Vary: User-Agent” to server response code

This tells Google that your cloaking is for a legitimate reason: giving users a better user experience.

What About “Cloaking”?


Dynamic Serving: Pros One URL

Good for SEO All links to one URL No crawling / indexing many URLs

Good for sharing Good for developers

No complicated device detection, redirection, annotation

Can fully optimize for mobile-specific search intent Search Analytics: “nearby”, “download app”, etc.

Can fully optimize for mobile-specific user experience


High cost of maintenance & more complicated for SEO Two sets of code to optimize / update

More complicated for developers Device detection imperfections Adjusting user-agent strings for new devices

Worse for crawling Bots crawl with multiple user agents

Dynamic Serving: Cons


Usually m.site.com

Different URLs and HTML

Bidirectional annotation: Rel=“Canonical” from mobile to desktop Rel=“Alternate” from desktop to mobile

Utilize 302 (temporary) relative redirects

Like dynamic, add “Vary: User-Agent” to server response code

Example: Sephora.com (minus Vary header)

Separate URLs


Separate URLs: Pros Can fully optimize for mobile-specific search intent Search Analytics: “nearby”, “download app”,

etc.

Can fully optimize for mobile-specific user experience Calls to action Formatting Headers Click-to-call


High cost of maintenance

Two URLs: More complicated for SEO

Dynamic Rel=“Canonical” & Rel=“Alternate” tags Risk of duplicate content if done incorrectly Links don’t all go to one place!

More complicated for developers Device detection and redirection imperfections

More complicated for crawling Bots crawl with multiple user agents

Currently NOT recommended by Bing

Separate URLs: Cons


MOBILE SEO TOOLS


Not using “Vary: User-Agent” Solution: Check server response codes using

Fetch as Google or the SEO Book tool

Bad redirects confuse Google Solution: Check with Screaming Frog, DeepCrawl,

and/or Chrome device emulation & Redirect Path plugin

Search Console message about blocking static resources (July 28, 2015) Google can’t tell if you’re mobile-friendly if you block

their access to Javascript and/or CSS Solution: See what they see with Fetch as Google &

use robots.txt to unblock

Tools for Fixing Mobile Errors

https://www.google.com/webmasters/tools/googlebot-fetch

http://tools.seobook.com/server-header-checker/



https://chrome.google.com/webstore/detail/redirect-path/aomidfkchockcldhbkggjokdkkebmdll?hl=en


Incorrect canonical and alternate tags could create duplicate content and “index bloat” Solution: Check page code via Screaming Frog or

manually using “inspect element” Will also need to address past index bloat if it

exists by searching for site:m.site.com and manually removing these URLs in Search Console. They will still show up when they need to!

Tools for Fixing Mobile Errors #2


Check everything using Google’s mobile-friendly testing tool

Search Console shows mobile usability errors, mobile crawl errors, and mobile keywords

Slow load is especially bad on mobile PageSpeed Insights from Google

Which devices need optimization? Analytics > Audience > Mobile > Devices

Google Tools for Mobile SEO

https://www.google.com/webmasters/tools/mobile-friendly/

https://www.google.com/webmasters/tools/mobile-friendly/

https://www.google.com/webmasters/tools/mobile-usability

https://www.google.com/webmasters/tools/crawl-errors

https://www.google.com/webmasters/tools/search-analytics

https://developers.google.com/speed/pagespeed/insights/


Final Options to Consider


Some big companies are making the move from mobile sites to apps!

Why?

Increase engagement by taking advantage of mobile usage patterns (see graphic)

Problems:

Psychological barriers to download

Not optimal for SEO, but app indexing and deeplinking mean it might be more viable for search long-term

Apps – An Emerging Option


Unaffected by updates so far – maybe soon?

General belief: give them the desktop version

BUT…

Marketers must make data-driven decisions. If data shows mobile site converts better and/or

attracts more traffic, do that instead! A/B test if inconclusive

Tablets – Which Site Do They Get?


1. Mobile is a huge part of most digital marketing and isn’t going anywhere. Prioritize it NOW.

2. Know all your options well before making a decision.

1. Responsive Design2. Dynamic Serving3. Separate URLs4. Apps

3. Use available tools to help you diagnose problems.

4. It’s almost lunchtime!

Takeaways


Thank You!• Senior Marketing Manager - DriveHill Media

• Find the full presentation here

• Tweet me here