Monday, March 31, 2008

Automatically Adjusting Web Pages for the Apple iPhone and iPod Touch

About a year ago I wrote about how to adapt web pages for devices, such as the iPhone for emergency management. One problem pointed out was that the iPhone does not think it is a handheld device and so does not activate a stylesheet intended for such a device (using media="handheld"). Daniel K. Appelquist quoted Apple's suggested code for using a special stylesheet for and iPhone:

link media="only screen and (max-device-width: 480px)" href="small-device.css" type="text/css" rel="stylesheet"

As he points out, this will not just detect iPhones, but any device with a screen width of 480 pixels or smaller. Few mobile devices have web browsers which support the media query syntax. Presumably this will work with an iPod Touch.

I have now included this in my code for "Adapting web pages for the Apple iPhone and iPod Touch". If someone would like to try that on an iPghone or iPod Touch, I can then advise the Sahana developers if they should include it in their system.

No comments: