How to Reliably Tell Android Tablets from Phones

< Blog

If you’ve arrived here by Googling for something like the title of this article, I’m sorry to disappoint you.

The bizarre reality is that there is no clean, reliable solution for distinguishing Android tablets from Phones. Google really messed this up through a lack of leadership.

What Do You Test?

Here’s the situation. Suppose you want to leave a desktop site intact, and redirect accesses from phones to a different, mobile-optimized site. You don’t want to redirect tablets, because the desktop site is more appropriate for their screen size.

A simple bit of JavaScript should do this, right?

Google’s official suggestion is that you test the user agent (UA) string for “Android” and “mobile” to determine if the device is a phone. If “mobile” is not present, then it’s a tablet.

Alas, this just doesn’t work in a significant number of cases. Depending on the phone manufacturer and the browser in use, there are phones that don’t include “mobile” in the UA string, and tablets that do.

To those of you who are thinking “just use responsive design and media queries”: that is not an answer for this situation, in which the site owner wants to leave the existing desktop site intact, and redirect mobile users to a different site.

Screen Resolution and Pixel Density

So you can simply test for the screen resolution, right? Just decide on the breakpoint, say 600 pixels, using screen.width and screen.height. If the narrower of the two dimensions is greater than 600 pixels, we’ll consider it a tablet.

If it were not for high-resolutions screens and inconsistent reporting of parameters by browsers, this might work. But in the real world, it doesn’t.

There are phones today with 720 x 1280 pixel screens. This makes them appear to be tablets, because the screen dimensions they report are the device pixels, not the effective pixels.

If you are on top of such things, you might point out that there is a value you can access in JavaScript, window.devicePixelRatio, which you can use to adjust the reported screen.width value to get the effective screen width.

This is a great solution — if the browser the device is running is Webkit-based. Other browsers don’t currently support window.devicePixelRatio.

Reduced to Listing Device Names

The bottom line is that you’re left with testing the UA string for the name of the tablet. This is a terrible solution, because it means you need a complete list of all the tablet UA strings, and you need to update it every time a new tablet comes out.

That might not be so bad if there were an easy way to get this data, but there isn’t. There are various ad-hoc collections, but none that are comprehensive or frequently updated (at least none that are publicly available that I have found — if you know of one, do tell!).

You might think that the device gallery at www.android.com/devices might be an answer, but it’s not. Not only does it not show the UA strings, it is not kept up-to-date. A visit to Best Buy reveals a handful of tablets running Android 4.0, but the gallery shows none as of today.

What Were You Thinking, Google?

Google has really dropped the ball on this. It would have been so easy to provide a little leadership here, and tell all the browser and device manufacturers to include “phone” or “tablet” in the UA string. But they didn’t, and it’s a mess.

We’re working on providing the best solution we can, and we’ll share it here as the work progresses.

Categories: Mobile Web Design




Add Your Comments

(not published)

Reader Comments

3 comments

mobile-detect

From: Michael Slater, 02/11/13 09:00 PM

Daniel, the solution you reference, https://github.com/serbanghita/Mobile-Detect, is taking the brute-force approach of having an extensive list of model numbers to distinguish Android tablets from phones. This is the only way to go, given Google's failure to provide a reasonable mechanism, but it is fragile. Every time a new tablet or phone comes out, you are dependent on the developers to update their software, and you need to install a new version every time they update it. It may be as good as it gets, but it is ugly.

Possible solution

From: Daniel, 02/11/13 06:20 PM

Have you checked this out. I would like to hear your thoughts on it. https://github.com/serbanghita/Mobile-Detect

UA Database

From: Anthony M. Powers, 05/ 1/12 11:43 PM

If you find a list of User Agents that are updated frequently, be sure to let me know. I'll give this page a good social spamming if so! Thanks!

Call us at 888.670.6793
Or click for a free consultation

Get updates via email

Email address:

Share This Post


Follow Us

Related Posts

Recent Posts

Older Posts by Month