Using Modernizr to test for tablet and mobile - Opinions wanted

Question

I want to use Modernizr to detect whether a user is view a site on a desktop, tablet or mobile device.

My initial first thoughts are obviously to check screen sizes that should be enough for mobile devices and also for larger desktops. For tablet devices where the screen size could also equal that of a small desktop screen (1024 x 768) I would test for touch events as well.

At this time I would like to focus on mobile/tablet devices that, as jQuery mobile puts it are, A-grade. I am not looking to tap in to any specific mobile device features simply detect desktop, tablet or mobile and serve up a tailored UI for each by appending CSS classes depending on the results of the test.

Do you think this is enough to achieve what I want or do you think I should be testing for other capabilities? Many thanks in advance.

Answer 1

This question is a bit old but I couldn't find a better answer when I googled it.

Most desktops now are touch enabled, so detecting it is irrelevent.

The best way to detect them is by screen size.

With Modernizr you can use if (Modernizr.mq('only all and (max-width: 480px)')) { ...}