How do Google know what is "a mobile"?

Bloke · 2015-04-22 12:30:21

So in the light of yesterday’s mobile algorithm update, I’m curious exactly how Google knows that a device browsing their search results is mobile so it can deliver mobile-friendly results. Searching for the answer has thus far turned up fruitless so I wondered if anyone knew how they did it? Just out of morbid curiosity rather than anything else.

Here’s what I’ve observed so far:

On a real mobile using Chrome on a wireless network, searching for a phrase reveals a list of results that have a little ‘mobile friendly’ indicator alongside.
On a desktop, using Chrome over the same wireless network, with the viewport set to the same small screen resolution and a browser extension to fake the user agent to match the exact same model as the real device, the search results are different and do not have the ‘mobile friendly’ indicator.

Presumably there are more tests than simply UA + screen size going on behind the scenes. Maybe Google have been setting a cookie on devices if they detect it’s one (e.g. screen size is small and does not vary from request to request) in the run-up to the change. I thought maybe it was detecting if the incoming request was via a different physical means or using some geographical lookup, but switching to the same wireless network didn’t have any effect: the results still differed.

As I say, just curious really. I’ve been unable to fool Google into thinking my desktop is a mobile so I can see what the results will look like on said device. Maybe I just chalk this one up to Google voodoo (a.k.a. Goodoo).

colak · 2015-04-22 13:06:55

~~would they be checking for user agents?~~ You picked that one:)

Bloke · 2015-04-22 13:08:44

colak wrote #290163:

would they be checking for user agents?

Well unless the plugin I used to fake the user agent wasn’t setting it exactly right, the UA should be the same as far as Google sees it.

colak · 2015-04-22 13:38:29

This is what I found but it doesn’t say much.

Bloke · 2015-04-22 13:44:37

colak wrote #290165:

This is what I found but it doesn’t say much.

Yeah, all generic stuff that tells us how Google’s spiders index a site and determine mobile-worthiness. But doesn’t explain how, when you visit Google and search for something, they know to deliver “mobileish” search results to some devices and “desktopish” search results to others. Gotta be some device / capability detection going on under the hood that goes beyond simple screen geometry and user agent scraping.

The key to it is probably in the obfuscated JavaScript code on Google’s site…

trenc · 2015-04-22 13:47:39

Google is testing the sites:
https://www.google.com/webmasters/tools/mobile-friendly/

More information is provided here: https://developers.google.com/webmasters/mobile-sites/?hl=en-gb

Bloke · 2015-04-22 14:02:01

trenc wrote #290168:

Google is testing the sites:

Yep, I know how they determine that individual sites are mobile friendly. What I want to find out is how they know that you are browsing their search results on a mobile vs a desktop browser.

The search result lists differ (sometimes quite a lot) depending on how (upon which type of browser/device) you browse Google. And it doesn’t appear to just be user agent and device width they use to determine the capabilities.

EDIT. Here’s an example: on any decent responsive site with media queries, if you shrink or grow the browser window on a desktop, you get to see the experience as mobile users see it. Some browser inspectors have responsive views with dropdowns for pre-selected device types. But if you resize the window when viewing a list of Google search results or even use the inspector’s tool to simulate a mobile, you do not see the little ‘mobile friendly’ indicators appear alongside each entry. But if you browse the search results on a real mobile, you do see the indicators (and in fact get a different set of results). So it’s not pure media queries / device detection / user agent they are using, it must be something more.

trenc · 2015-04-22 14:07:05

Ah sorry, my fault, I really didn’t read your first post, shame on me. :(

… and I’ve really no idea on how is Google doing this.

philwareham · 2015-04-22 14:07:52

It’s viewport I guess, along with some algorithms they have to determine how good your site UX is on that viewport (as seen in Google PageSpeed Tools).

Bloke · 2015-04-22 14:13:26

philwareham wrote #290172:

It’s viewport I guess

Hmm, so when you resize the browser window to simulate responsive layouts, does it not alter the viewport size? Or does it only alter the viewable area (width x height), and the viewport is actually something that is “fixed” for a particular device? Perhaps it is both immutable, baked into the browser irrespective of resolution / screen size, and readable by something like JavaScript.

I don’t think it can be a pure set of server-side settings that Google query, as there’s nothing really there that is a rock solid indicator. So it has to be some client-side capability or property that only mobiles exhibit and can be read by JavaScript to accurately determine the type of device. And, further, must be something that cannot be easily spoofed or altered by hacks / resizing.

philwareham · 2015-04-22 14:21:23

I would think it checks the page at certain pre-determined viewport sizes of common devices and sees how your content sits within that viewport – if it doesn’t fit then your site isn’t mobile friendly.

Plus then some other tests for friendliness such as page sizes that are not 16mb load, no autoplay videos, etc, etc.

Bloke · 2015-04-22 14:44:59

philwareham wrote #290175:

I would think it checks the page at certain pre-determined viewport sizes of common devices and sees how your content sits within that viewport – if it doesn’t fit then your site isn’t mobile friendly.

Yeah, but Google aren’t doing that on the fly when you get search results. Their spiders are doing that to determine mobile friendliness ahead of time and storing it as meta data against the site’s index.

Looking at Google’s search results markup, there’s a <div class="f slp"> sandwiched between the <div> that holds the site’s URL and the <span> that contains the site’s excerpt. When searching on desktop, that’s always empty. When searching via mobile, it gets populated with the text “mobile friendly” if Google have decided the site deserves that indicator, otherwise it’s left empty.

Presumably, there are three broad ways Google can do this:

Check some server / header settings and deliver the text in the markup at page load time.
Tag mobile-friendly search entries with some data- element and use JavaScript to run through those on DOM ready to update each entry and display the ‘mobile friendly’ label if the device viewing the search results is a mobile.
Query the device on DOM ready and if it’s a mobile fire off some AJAX event to fetch more meta data about each of the results, populating that <div> accordingly.

Option (1) seems tricky to do reliably and I can’t see any evidence in the markup of option (2) — though I’ve not looked at the micro level yet and there is an HTML comment ¹ in each entry which might be some indicator of mobile-friendliness.

The crux of it is in determining if the device browsing the search results is a mobile. I’m at the point where I might have to de-obfuscate the JS to find out how they’re doing it. But curiosity killed the cat and all that.

¹ EDIT: or maybe not. That appears to be in every entry, irrespective of its mobile friendliness.

Textpattern CMS

Textpattern CMS support forum

#1 2015-04-22 12:30:21