Categorizr – A modern device detection script

Posted on January 16th 2012 by Brett

Categorizr is a modern device detection script that helps categorize different web capable devices into 4 categories, desktop, tv, tablet, or mobile. It take’s traditional device detection and flips it on it’s end, assuming devices are mobile first, unless otherwise detected as tablet or desktop. Categorizr was created by Brett Jankord and is based on an my earlier device detection script.

You can download Categorizr from github here: https://github.com/bjankord/Categorizr

Developers can include Categorizr on their site to detect if a device is a desktop, tv, tablet, or mobile phone. With these 4 categories, you can choose what you want to do when a user accesses your website from varying devices. Originally the script was written with the idea in mind of using it as a solution to creating a hybrid responsive web site. Though you could also use it for traditional mobile redirects.

What makes Categorizr different?

Instead of assuming the device is a desktop, and detecting mobile and tablet device user agents, Categorizr is a mobile first based device detection. It assumes the device is mobile and sets up checks to see if it’s a desktop or tablet. Desktops are fairly easy to detect, the user agents are known, and are not changing anytime soon. Tablets are also pretty easy to detect.

By assuming devices are mobile from the beginning, Categorizr aims to be more future friendly. When new phones come out, you don’t need to worry if their new user agent is in your device detection script since devices are assumed mobile from the start.

Categorizr test results.

I’ve set up a page where you can view a cross-check of Categorizr against over 10,500+ user agents. The cross-check includes data from WURFL along with some user agents from http://goo.gl/sRA2X, http://goo.gl/p0dhR, and a few other places across the web. I’ve also cross-checked Categorizr on all the devices I could get my hands on at Best Buy, Verizon, AT&T, T-Mobile, and Sprint.

You can test your own devices and other user agents against Categorizr here. If you come across any devices you think are categorized incorrectly, let me know in the comments below, I’ll see what I can do to catch them in the script.

So far in testing Categorizr, I’ve seen really positive results, though with any kind of device detection where you’re checking user agents, there is going to be some chance of error. In the 10,500+ user agents tested so far, I did come across some issues. You can read about them here. Known issues with Categorizr. I would strongly encourage developers to add a link to let the their user decide what view they want, be it the mobile version, desktop version, or whatever other version you decide.This will help ensure if initial detection is incorrect, the user can still get to an optimized version suited for them.

Updated – 2.6.12
A category for TVs has been added to Categorizr. Smart TVs and TV based gaming consoles like the Nintendo Wii and Playstation 3 are now categorized as TVs. SmartTV’s categorized as a TV include Google’s Android powered TVs, Philips Net TVs, and Samsungs Smart TVs. I have been unable to get any information about the user agents from LG’s smart TVs so I’m unsure what category they would fall into. http://goo.gl/ZSDUc

If you know of other smart TVs that are not categorized correctly, let me know and I’ll see what I can do to update Categorizr.

Updated – 2.29.12
Categorizr is ready to download.

You can download Categorizr from github here: https://github.com/bjankord/Categorizr

It comes in two flavors, Categorizr and Categorizr-Redirect.
If you looking to create a hybrid responsive wed design, go with Categorizr. If your looking for more traditional redirect, go with Categorizr Redirect.

A WordPress plugin is in the works.

If your using Cateogrizr on a bigger site, let me know. I’d love to know how/where below are using it. Comments, concerns, questions, let me know in the comments below.

Posted in Categorizr, Device Detection, RESS | 37 Comments

http://www.xtreme4s.net Jon Muir

Sounds excellent, let be get this straight we can use it to work along side the likes of Modernizr and wack some extra into into an Object (var Categorizer) and the html tag?
- Brett
  
  @Jon Muir – Categorizr currently is written is PHP, so it works server side, unlike Modernizr which works client-side. Using Categorizr, you can segment out blocks of code for each device on one page. For example you could have code that handles differences between desktop and mobile with a line of PHP similar to this; if desktop, show desktop navigation, if mobile, show mobile navigation.
  
  I would strongly recommend pairing Categorizr with a feature detection script, like Modernizr. In doing this, you could truly gather a lot of information about the device your user is on and use that to create a website that responds to a device’s capabilities, on top of the devices size too. I hope to write more on this idea soon.
  - http://www.xtreme4s.net Jon Muir
    
    Sounds very promising, once released I would love to turn it into a Drupal module.
http://handsetdetection.com Florante

Hi Brett,
You may also want to give Handset Detection a try. It offers both server side device detection as well as javascript detection. We now have over 40 thousand models on our database and growing. We’d be happy to know what you think about the service.

Cheers,

Florante
- Brett
  
  @Florante – I’ve seen Handset Detection before, and I think it’s a great service. I’ve used it to look up a few unique user agents I’ve come across in testing Categorizr. While I have no gripes against it, I wanted to create a resource that was simple to set up and was free to use.
  
  I can see scenarios where one would want to gather more information about devices on the server side and use a device database like Handset Detection, Device Atlas, or WURLF, at the same time I can see scenarios where one might want a leaner device detection solution and go with something like Categorizr. I know if I were to use one of the three device databases mentioned above, Handset Detection would be one I’d go with first.
Toni

Few Philips Net TV and one Samsung SmartTV browsers detected as mobile. Those escaped quotes belong to the UA string.

http://pastie.org/3334253
- Brett
  
  Thanks for the feed back Toni. I’ve decided to go ahead and add a new category for TVs. I’ve set up checks now to categorize smartTVs and TV based gaming consoles like the Nintendo Wii, and Playstation 3 as TVs.
  
  The user agents you mentioned are now categorized as TVs. You wouldn’t by chance know any of the user agents for LG’s smart TVs would you? http://goo.gl/ZSDUc
  
  I havn’t been able to get any information on them yet. If you come across any other user agents you think are not correctly categorized, let me know, I’ll see what I can do to fix it.
Anders

This seems really neat! When are you planning to release it?
- Brett
  
  Thanks Anders, I’ve recently added a check to catch TVs. I’m pushing the release back to the end of this month so I can have some more time to fine tune the TV check.
http://doliver.co.uk/ David Oliver

I’m very interested in this, Brett, and I like the mobile first approach – I try to build all new sites this way in general now.

There’s a site I’ll be building very soon in Symphony CMS that needs to launch middle of next month, and I was wondering if there is any chance of me seeing a beta version of Categorizer so that I can set about implementing it as a Symphony CMS extension. There are already a few RESS extenstions/approaches available for Symphony CMS, but I think this would make a very nice addition.
- Brett
  
  Thanks David, yeah mobile first is the way to go. Just launched the project on github. Take a look and let me know if it works out for you.
  - http://doliver.co.uk/ David Oliver
    
    Initial Symphony CMS Categorizr extension done, and it seems to be working fine! (Based on my single test.) https://github.com/DavidOliver/device_categorizr
    
    Many thanks for your work. When I do the readme I’ll obviously credit and point to you.
http://doliver.co.uk/ David Oliver

Great! Thanks for your work and updating me here. I’ll take a look this afternoon.
Alin

Hi Brett,

I tested the code uploaded here https://github.com/bjankord/Categorizr using Adobe Device Central and I found some problems with some mobile phones that are categorized as tablets. Then I checked this link http://brettjankord.com/categorizr/ua-check.php and everything looks find. Most of them are categorized as correctly.

Is the code used here http://brettjankord.com/categorizr/ua-check.php different then the code uploaded here – https://github.com/bjankord/Categorizr ?

HTC Desire HD and Galaxy S 2 are categorized as tablet instead of mobiles.
Does anyone use Adobe Device Central? Can we trust it?

Thanks for your great work!
http://thejase.com Jason Featheringham

I am /so/ glad someone has finally created an easy-to-use device detection for televisions! Google TV, for example, does not identify as “@media tv,” and sometimes we need to change our font size or contrast for the 10-Foot Experience.

Thank you for this!
John Whitman

Can this be used in a .NET environment?
- John Whitman
  
  I would like to use this on a large enterprise website but need to know if it can work within .NET.
  
  Thanks!
  - Robert
    
    Looks like it’s PHP only. There is something similar on the .NET side.
    
    http://51degrees.codeplex.com/
  - http://twitter.com/roryf Rory Fitzpatrick
    
    I’ve written a .NET port here: https://github.com/roryf/Categorizr
    
    No nuget package yet but you can clone and do a release build.
    
    Using it on a large e-commerce site due to go live in next few weeks.
seb

awesome – that is the missing link! you rule.
https://twitter.com/#!/rguerreiro Rodrigo Guerreiro

Hi Brett,

I’ve developed a node.js module that was inspired by your Categorizr code. You can find it here: https://github.com/rguerreiro/express-device

Thanks to your work it was really easy for me to build this. All the credit goes to you.
http://www.netbulae.eu Xander

Hi there,

Awesome work on the TV recognition.
I think that the user agent for LG Smart TV = LGE_DLNA_SDK
Could you confirm this?

Best regards,

Xander
http://www.lovemymoto.com/ Don

Awesome! I’ll found out more about this.
http://www.metamodpro.com Stephen Brandon

Hi Brett,

thanks for your work on this. I’ve incorporated support for Categorizr into two of my Joomla extensions, Chameleon and MetaMod at http://www.metamodpro.com. Together, these extensions allow Joomla sites to switch/alter “modules” (e.g. adverts & menus), site templates/styles, menu items, and add additional JS/CSS scripts to a page when any one of the 4 device types is detected.

I really like the “hybrid responsive” methodology. While pure responsive is a great ideal, my customers are often looking to customise their sites somewhat more for different device types, realising that mobile and tablet users often do have different expectations for what information should be available to them, and what sort of layout should be used. Categorizr is a great tool to help to provide that. Thank you!
- Brett
  
  Thanks Stephen, I’m glad you’ve found the Categorizr useful!!
http://www.SiteBuilderTips.com SiteBuilderTips.com

Can it detect whether a device is in portrait or landscape mode?
- Brett
  
  No, there is nothing in the useragent that would tell you this. If you need to know if a device is in portrait or landscape there are CSS media queries you could use or you could check with JavaScript.
  - http://www.sitebuildertips.com SiteBuilderTips.com
    
    I’ve been using CSS media queries, was just wondering if their was any way to achieve this server-side.
    - Brett
      
      Short answer, no, media queries work on the client-side. I’m curious what you would want to do with media queries on the server-side.
      - http://www.sitebuildertips.com SiteBuilderTips.com
        
        Sorry no, not media queries server-side. I was wondering if there was a way to detect orientation server-side.
        
        The problem I’m trying to solve for a client is displaying multiple ad sizes on the same page, and displaying them depending on-orientation.
        
        Many ad network particularly Google Adsense only allow a certain amount ads to be displayed on the same page, So even though I can visually achieve this CSS media queries, the ads are still being loaded.
        
        This wouldn’t be a problem If I wasn’t using a responsive theme but instead served a different theme all together for specific devices, but that’s allot of maintenance.
        
        Nonetheless your script is very useful because the wp_is_mobile condition is just not enough since it treats tablets the same as phone and definitely has no consideration for Smart TVs.
        
        I’m actually planning on incorporating your script into a Smart Theme (Not Responsive) that I’m building.
    - http://doliver.co.uk/ David Oliver
      
      What if the visitor changes the device orientation after page-load? I think this is something that needs the dynamic-ism of client-side.
      - http://www.sitebuildertips.com SiteBuilderTips.com
        
        Yeah there’s also that to consider.
- Brett
  
  This is not something that can be detected from the useragent. I would recommend using CSS media queries if you are needing to detect orientation or looking into JavaScript solutions to detect orientation.
http://zapp.ms John

Brett– Even with all the buzz about mobile first, I suspect most developers haven’t truly switched their thinking around.

Your observation that detecting the fewer number of known desktop agents will be much simpler than detecting the exploding number of yet unknown mobile agents…… is genius. DUH. Why wasn’t this obvious to anyone else?

Anxiously awaiting your WP plugin! Any timetable?

Thanks.
http://www.SiteBuilderTips.com SiteBuilderTips.com

Here’s the WordPress plugin I mentioned that I was having built.

http://www.sitebuildertips.com/tools/smartpress

It works great, uses both Categorizr and Categorizr Redirect.
http://decadecity.net/ Orde Saunders

I wanted to use this in a Python project so I’ve done a Python port: https://github.com/decadecity/Categorizr.py

As part of the port I also produced a set of tests:
https://github.com/decadecity/Categorizr.test

I’ve explained the process of translation in a blog post:
http://blog.decadecity.net/2012/11/13/translating-categorizr-from-php-to-python/
Idel Fuschini

Look also Apache Mobile Filter (http://www.apachemobilefilter.org), is a cross developer language solution for mobile detection

BRETT JANKORD DESIGNER / DEVELOPER

Categorizr – A modern device detection script

Search

Categories