Comments on: Bulletproof Mobile Device Detection and Style Sheets without User Agent Detection or Server-Side Scripting

By: brunogirin

brunogirin — Sun, 30 Aug 2009 19:22:06 +0000

A further note on the Nokia N97: going through the test cases posted by Dom at http://www.w3.org/2007/11/cssmedia-mobile/ is appears that the N97 fails tests 5, 6, 7, 8, 9 and 10 but passes all the others. In particular, it passes tests 11, 12 and 13 which means that it doesn't seem to accept media handheld but understands media queries.

By: brunogirin

brunogirin — Sun, 30 Aug 2009 00:06:11 +0000

I just tried it on a Nokia N97 and it works as expected:

You are on a mobile device
You have javascript

All on a red background.

By: Jeff Van Campen

Jeff Van Campen — Mon, 20 Jul 2009 21:39:48 +0000

I've been playing around with this technique as a part of an assignment for the W3C's Mobile Best Practices online course.

As you may know, the W3C Mobile Best Practices Default Delivery Context includes serving mobile documents with an application/xml+xhtml content type.

Since this is the case, I've been serving my test cases with the application/xml+xhtml content type when that content type is supported by the User Agent.

Firefox supports the xhtml content type, so I'm serving that content type to Firefox.

In Firefox 3.5 on OS X (I haven't tested other versions of Firefox), this seems to break the “min-width” media query.

I've two identical pages with different content types.

Here's a version that serves text/html :

http://otrops.com/examples/w3cmobileweb/assignment06/sample-css-bushido.php

And another version that servers application/xml+xhtml:

http://otrops.com/examples/w3cmobileweb/assignment06/sample-css-bushido-xhtml.php

Given some of the issues surrounding application/xml+xhtml, this is probably an edge case, but I thought you'd want to know.

By: Andrea

Andrea — Mon, 20 Jul 2009 16:23:24 +0000

From what you say:

"But mobile stylesheets tend to be pretty light, and it’s a lot easier to cancel out mobile styles in your screen stylesheet, than it is to do it the other way around (like the ALA method). "

it seems there is no need to cancel out screen styles in the mobile styles: but that is not true.
If a mobile phone doesn't understand css media queries and picks up style sheets for both screen and handheld media type (like my Nokia 2630), then you need a sort of "antiscreen.css" embedded or imported (like the ALA method).
Your test is fine for my phone because it picks up the stylesheets in the following order: mobile.css, screen.css and finally mobile.css again, but in real cases there will be mobile-unfriendly settings in screen.css that must be canceled out in some way.

By: westleyd

westleyd — Sun, 12 Jul 2009 18:01:48 +0000

Using a Samsung Rant on Sprint,
MyUserAgent is: Samsung-SPHM540 Polaris/6.0 MMP/2.0 Profile/MIDP-2.0 Configuration/CLDC-1.1
Browser, per phone software, is Polaris/6.0

Visiting the mobile-test page gives me: "
You are on a mobile device

You have Javascript"
as black text on a white background. I did notice in the location that Sprint was intercepting the request, if that potentiall makes any difference.

By: MobileMarc

MobileMarc — Thu, 09 Jul 2009 11:08:48 +0000

Here are some "Sony PSP" and "SonyEricsson K530i" results

Sony PSP with Access Netfront 3? (definitely Netfront)
PSP resolution is 480×272 but…
on blue: You are on a desktop browser
JS on: You have javascript
JS off: You do not have javascript

and

SonyEricssonK530i NetFront 3.3
on red: You are on a mobile device
JS on: You have javascript

please also have a look at the test results on
http://www.w3.org/2007/03/mth/results?ts=cssmedia
SonyEricssonK530i/R6BC Browser/NetFront/3.3
Profile/MIDP-2.0 Configuration/CLDC-1.1
100% tests run)
Test results are in column no. 22 (now).

Screenshots (photos) @ http://marcup.de/mobile/bushido/

By: dean

dean — Wed, 17 Jun 2009 05:48:58 +0000

hgtablet: that's because the screen resolution of the N810 is larger than 480 pixels (800 x 400 to be exact). If you want to serve mobile stylesheets to that device, you would need to change the "min-width" number to 801. Personally, I don't consider a device with that high of resolution to be a mobile device, so I'll stick with what I have.

By: hgtablet

hgtablet — Fri, 12 Jun 2009 13:02:46 +0000

Nokia N810 Internet Tablet
Default browser called microb, firefox-based.

Detected as:
You are on a desktop browser
You have javascript

By: ifuschini

ifuschini — Wed, 27 May 2009 10:54:28 +0000

I don't if is a good post for this article.
I have published the new version of Apache Mobile Filter, now the filter is give to you the information of capabilities as apache environment.
Now you can develope in any language (php,jsp, ruby etc.) and have the information of mobile capability.

By: dean

dean — Wed, 22 Apr 2009 06:19:36 +0000

kobuk: I put this method into effect on a fairly involved site I'm working on right now and had some similar problems when it came to rendering on the iphone.

I'm going to let you in on a secret though… sometime in the next couple of days I'm going to be publishing a new article about how everything we've all read about the percentage of people with js disabled is completely and totally false. The Cliff Notes version is that you can throw this method out the window and use this instead:

Check back soon to get the full scoop.