How to Reliably Tell Android Tablets from Phones
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.
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.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 × 1280 pixel screens. This makes them appear to be tablets, because the screen dimensions they report are the device pixels, not the effective pixels.
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
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.
Topics: Mobile Web Design