I have noticed that I have got lots of hits from mobile phones. I wonder if anyone has got advice for using these types of devices. There are different types of mobile devices and some are much bigger than the others. Should I redirect to another website just for mobile devices.
What sort of scripts should I use to detect mobile devices?
There are problems with redirecting mobiles to a different version of the site:
For a start, if you’re doing it by the User-Agent string, you’ve got to have a huge long list and constantly update it, in order to keep on top of the changing mobile market.
For a second, you’ll need some way to allow mobile users to ‘opt-out’ and use the regular site.
For a third, you then have increased your workload by having two sites running in parallel.
That isn’t to say you shouldn’t do it, but they are things to be careful of before you go down that route. There are other options, such as mobile stylesheets. If you’re doing that, the most recent thought seems to be that a good strategy is to design for a low-function mobile first, then use media queries to progressively add better graphics, layout and larger display for larger viewports right up to desktop size – you would probably then want to use conditional comments to specifically target IE6-8, which doesn’t recognise media queries.
The advantage of using stylesheets in this way is that you’re only maintaining one site, so once you’ve got the extra layouts set up there’s no real extra workload; you don’t have to worry about keeping an up-to-date list of mobile User-Agents, and you don’t have to worry about how to signpost the different sites. The disadvantage is that because you’re only changing the styling, and not the code, you can’t optimise the site as fully as you can with a completely separate site.
Most larger sites that tend to need this approach use some type of template which the pages content is injected. So in the ideal world one could develop a site using a mobile first approach than switch out the main wrapper for site based on page detection. It seems like most of the performance implications always lies with all masthead, footer and rails anyway. Ditch rending those server-side and everything else can be changed with CSS. In theory…
There are servers out there who do just this: maintain a long list and keep it updated. Stephanie Rieger mentions it in one of her slides.
starting with slide 83, she shows asking another server in “teh cloud” for more info about the device.
Of course, when the other vendors change their UA strings to all say “Apple webkit something something” we’ll all be screwed anyway and we’ll find some other insidious way to find out who’s requesting one of our pages. <rubs hands together evilly/> yesss, yesss…
He’s kinda big about responsive whatnot and especially user interaction with HTML forms. He has a whole book somewhere about “Don’t make people fill in a bunch of crap before letting them try something out” and hates those sites that make people register for no good reason (usually the company or site just wants your info but it’s not necessary for things like trying out a demo etc).