My webinar with DeepCrawl talking about mobile-friendliness, assessing keyword targeting on mobile, finding content inconsistencies across devices and much, much more!

1. Bastian Grimm, Peak Ace AG | @basgr
Crawling, indexing & ranking in the age of a mobile first world
Welcome to a new reality!

2. Why all the fuss?

3. 3 @peakaceag pa.ag
Mobile first indexing challenges #1
Source: Gary Illyes @ SMX Advanced Seattle 2017
Google never had to swap over an
entire index to something new, this is
completely new and doing that without
experimentation is not possible. And sites
should not be hurt, therefore large scale
indexing experiments will be conducted.”

4. 4 @peakaceag pa.ag
Mobile first indexing challenges #2
Source: Gary Illyes @ SMX Advanced Seattle 2017
Figuring out for 18-year-old desktop
signals: How can this be used for the
mobile web? E.g. the link graph/PR is
different and totally messed up; how can
Google make this work?”

5. 5 @peakaceag pa.ag
Mobile first indexing is about Google preferring and organising cross-device
content in a way that it can be easily queried from and displayed on a lot of
different devices.
CrawlingIndexing RankingMobile
What is mobile first indexing anyways?

6. 6 @peakaceag pa.ag
Mobile is dominating – 60 % of searches are non-desktop
Mobile search usage surpassed desktop in 2015 already; Hitwise reported in 08/2016
that nearly 60 percent of searches now happen on mobile devices.
Source: Hitwise (http://pa.ag/2qofNNV) & SearchEngineLand (http://pa.ag/2pT2OA7)
Share of online searches initiated on a mobile device, by industry:

7. 7 @peakaceag pa.ag
Lots of different “experiences“ depending on intent:

8. 8 @peakaceag pa.ag
Mobile search results for “Game of Thrones” (US)
Source: Google US, Mobile SERP on iPhone6 – 24/08/2017
Looking for those organic results? Well… good luck!

9. 9 @peakaceag pa.ag
Even questions are answered directly on (mobile) Chrome
Via Twitter: http://pa.ag/2tQfXA9

10. In the future, your rankings will be based on your mobile website entirely.
From desktop to mobile

11. 11 @peakaceag pa.ag
Google announced mobile first indexing in 11/2016
It feels like even Google doesn’t know how and when some things will work.

12. What do we know?

13. 13 @peakaceag pa.ag
Google confirmed: there will still only be one index!
Source: http://pa.ag/2fVfl5q

14. 14 @peakaceag pa.ag
What about desktop-only sites?
How to deal with common mobile site patterns such as tab switches, carousels, etc.?
Source: SMX Advanced 2017, Seattle
For desktop-only sites, indexing stays the same,
however crawling will be done using a mobile UA:
“We will index mobile content, only if you don’t have
anything we will index desktop content – no one will
fall out!”.
Can I use accordion tabs, hidden tabs, etc. on my
mobile site?
Google is going to assign them the same value as
non-hidden content. Illyes said, Google is going to
ensure, that “hidden content is not valued less on a
mobile site”.
+
-
+
Lorem Ipsum dolor
Lorem Ipsum dolor
Lorem Ipsum dolor
Lorem Ipsum dolor
Lorem Ipsum dolor
Lorem Ipsum dolor

15. 15 @peakaceag pa.ag
Site- & content-parity is absolutely crucial!
Make sure desktop & mobile are in sync; content, annotations, etc.
Source: SMX Advanced 2017, Seattle
What if the mobile site has less content compared
to the desktop site?
Ranking will be based on “shorter“ content! (Basically,
you need to ensure that whatever you want to rank for
will be present on mobile).
Mobile ranking factors
(including mobile friendliness testing) will generally
remain unchanged.

16. 16 @peakaceag pa.ag
Early on we saw crazy stuff! 4,500 visibility on desktop!
Mobile subdomain started to rank for desktop queries… real-world testing with live sites!

17. 17 @peakaceag pa.ag
Some stuff is entirely useless…
F.e. desktop site-links pointing to mobile; great use case! (only after MFI announcement)

18. 18 @peakaceag pa.ag
I asked about notifications for switched-sites in 2017:
Source: Gary Illyes @ International Search Summit 2017, Barcelona
I don’t believe we will be giving you
any type of notification once you have
been switched to mobile first indexing.

19. 19 @peakaceag pa.ag
Thankfully someone apparently listened:
Source: https://pa.ag/2KxZ0iZ

20. 20 @peakaceag pa.ag
What is “mobile“ anyways?
iPhone, iPad or even bigger? What is the standard desktop resolution?

21. Consider: When rendering, Google requests (nearly) everything
that belongs to a site (JavaScript, CSS, etc.).
Before we get into that:

22. …of all sites are using JavaScript; this is ultimately why Google
started to render sites instead of just crawling them!
93.7 %

23. 23 @peakaceag pa.ag
View source is dead. Dead as a doornail.

24. 24 @peakaceag pa.ag
Interested in JavaScript framework compatibility for SEO?
Check out Bartosz‘ massive research on crawlability and indexability!
Read more: http://pa.ag/2qLqlqH

25. With rendering there is no one-size-fits-all solution…
Rendering: which resolution?

26. 26 @peakaceag pa.ag
1024 x 768 only!
Why is that important now? Watch your responsive breakpoints, portrait vs. landscape,
etc. – basically everything that’s important to you needs to be rendered properly!

27. 27 @peakaceag pa.ag
GSC Fetch & Render is limited to 10,000 pixels in height
Source: http://pa.ag/2A5630t

28. 28 @peakaceag pa.ag
Rendering seems to be more important than ever!
Rankings tanked when GSC Fetch & Render wasn‘t able to render the page properly.

29. 29 @peakaceag pa.ag
Google currently uses Chrome 41 to render your site
Keep in mind: this version was released in March 2015 – it’s ancient!
Source: http://pa.ag/2hRnwP2

30. 30 @peakaceag pa.ag
Bonus > GSC fetch & render (almost) everyone you like
Simply use a 100 % iFrame to see how Google will render any given website

31. Resolution isn‘t that important

32. 32 @peakaceag pa.ag
The average consumer uses five devices!
You can’t build and maintain dedicated sites for everything, e.g. one for iPad or even
different pages for all the mobile phone screen resolutions.
Source: http://pa.ag/2ffuGNp & http://pa.ag/2fHvLhz
90 % of all users start a task
on one device and finish it on
another.

33. Also from an SEO standpoint, this has various advantages:
Proper Responsive

34. 34 @peakaceag pa.ag
What does proper responsive mean? #1
<picture>
▪ First and foremost: Different ways of showing
content per resolution (device). Design the
smallest viewport first, then work your way up.
Also, consider landscape vs portrait.
▪ Images: Best possible size, resolution & format. The
new <picture> element is a perfect starting point,
but there are lots more solutions. Also, consider fluid
images (they adapt to the container they are in).

35. 35 @peakaceag pa.ag
What does proper responsive mean? #2
▪ Critical rendering path optimisation: Optimise
for time to first meaningful paint. Reduce round
trips; off-load JS and inline CSS – for each
resolution/breakpoint.
▪ Conditional loading of components: Only
request what's needed when visible. Combine with
pre-fetching and pre-rendering (only with high
resolutions).

36. 36 @peakaceag pa.ag
What does proper responsive mean? #3
1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>Heading</h1>
<p>Paragraph</p>
</body>
</html>
▪ Optimise paint and re-paint, especially for small
resolutions/breakpoints. CSS media queries can
help a lot.
▪ Keep your DOM clean (hiding elements is only half
the truth).

37. Fast loading time plays an important role in overall user experience!
Performance = user experience!

38. 38 @peakaceag pa.ag
Revisited: PageSpeed (load time) is a ranking factor
Surprise, surprise; now also on mobile!
Source: http://pa.ag/2iAmA4Y & http://pa.ag/2ERTPYY

39. 39 @peakaceag pa.ag
Google loves site speed and keeps pushing for faster sites

40. 40 @peakaceag pa.ag
Please don’t forget your desktop now; both are relevant!
Especially for responsive sites this can be a massive challenge!
Source: https://pa.ag/2FGGKAi
With the mobile first index, will desktop
rankings use mobile page speed instead of
desktop page speed?
No […] as mentioned […], while our index will be
built from mobile documents, we’re going to
continue to build a great search experience for
all users, whether they come from mobile or
desktop devices.

41. 41 @peakaceag pa.ag
Make sure to get the basics right!
All slides on SlideShare: http://pa.ag/iss17speed
Use my checklist on SlideShare to double check:
▪ Optimize images: reduce overhead for JPGs & PNGs (metadata,
etc.), request proper sized images and try new formats.
▪ Implement effective caching and compression.
▪ Whenever possible, use asynchronous requests.
▪ Decrease size of CSS and JavaScript files (minify).
▪ Use a content distribution network (CDN) / an asset server
(as well as cookie-less domains) to optimize parallel requests.
▪ Lean mark-up (no comments, use inline CSS / JS only where
necessary or useful)
▪ Consider (DNS) pre-fetching & pre-rendering if feasible.
▪ Watch (& optimize) for TTFB, don’t forget you back-end
architecture / systems (e.g. DB, webserver etc.).

42. 10 tips to prepare your website:

43. 43 @peakaceag pa.ag
#1 Understand your mobile setup and its pros & cons!
What are you using and why? Is the configuration done properly?
www.example.com x www.example.com x www.example.com x m.example.com x
Responsive Web Design Dynamic Serving Independent Mobile Site
Don´t block images, CSS & JS
resources
Include the vary: user agent HTTP
header
Identify & serve the relevant web
version to the right user agent
Implement rel alternate & canonical tags between
mobile & desktop URLs.
Implement 301-redirects between mobile & desktop
to refer the user agent to the relevant web version
Responsive Web Design Dynamic Serving Independent Mobile Site

44. 44 @peakaceag pa.ag
#2 Are you targeting the right keywords on mobile?
Check search demand based on device split and adjust accordingly
Selling
(transactional)
Buying
(transactional)
VS

45. 45 @peakaceag pa.ag
#3 Are you sure your site really is mobile friendly?
Easy test: verify yourself using built-in Chrome DevTools (Ctrl+Shift+I)!

46. 46 @peakaceag pa.ag
Test multiple URLs at once
Check it out: https://technicalseo.com/seo-tools/mobile-friendly/

47. 47 @peakaceag pa.ag
#4 Make sure to not prevent access by using interstitials!
Or any other time of overlay/pop-up that has negative effects on UX!
Source: http://pa.ag/2tPmhIi
Examples of interstitials that make content less accessible
intrusive popup
intrusive standalone
interstitial
intrusive standalone
interstitial
interstitial for cookie
usage
interstitial for age
verification
banner that uses a
reasonable amount of
screen space
Examples of interstitials that would not be affected
by the new signal, if used responsibly

48. 48 @peakaceag pa.ag
#5 Did you check all GSC reports properly?
Of course the mobile usability report – but what about rich cards, these are also mobile?

49. 49 @peakaceag pa.ag
#6 Check GSC fetch & render for mobile as well
Pay close attention: identical content, anything missing, blocked resources?

50. 50 @peakaceag pa.ag
#7 Do a full site health check and focus on mobile issues
DeepCrawl has in-depth reporting on everything mobile

51. 51 @peakaceag pa.ag
#8 Simulate Googlebot for smartphones with JS rendering
ScreamingFrog can do that easily; again, pay close attention to rendered output

52. 52 @peakaceag pa.ag
#9 Get all the content to your mobile site
Is your schema.org markup available on mobile; indexation rules, canonical tags, etc.?
Usually, rel-canonicals, structured data,
hreflang, other annotations and even
images are missing! Copy everything you
want to rank for over to mobile (for now)!”

53. #10 Don‘t f*ing panic!

54. 54 @peakaceag pa.ag
Questions?
Always looking for talent! Check out jobs.pa.ag
Bastian Grimm
bg@pa.ag
twitter.com/peakaceag
facebook.com/peakaceag
www.pa.ag
Thanks for tuning in!