How to Detect Mobile Browser Capability

Question

I have three different versions of a mobilized website, and as the market is flooded with more and more phones, I'm struggling to keep up with knowing where to push them. I'm wondering if anyone has faced a similar issue, of how to detect the browser type, and forward to the appropriate version of the mobilized website (where it be text, simple html, advanced html and javascript). I would be very interested in hearing the other solutions that other's have tried.

Basically the text version is for phones that don't support CSS or Javascript the Simple version is for phones that don't support Javascript The Advanced version is for phones that support CSS and Javascript.

Maybe there is a better way of handling it with this condition?

(Server/Client side being used are PHP + Javascript)

Thank you in advance.

Answer 1

You may find this useful:

• Server-side capability detection for mobile devices
• How to serve the right content to mobile browsers
• Standard way to detect mobile browsers in a web application

Answer 2

I'd use http://www.modernizr.com/ Modernizr to detect the capabilities in the client, and then redirect to a different location in case support is insufficient for the current fidelity-level.

If there is no CSS/JS support at all, you're pretty much screwed when it comes the client-side part. You'll have to resort to things like useragent sniffing... but then, nearly all phones have at least rudimentary CSS support, even the fairly old models.