Tim McNamara

Quick Tips for Developing for the Mobile Web

Here, we’re looking at building websites that can cater for both ‘normal’ users as well as mobile devices.

Prepare for interruptions

Your application is not the only thing that your user will be doing. The most basic element of crafting a GUI application, that’s different from the web is making sure that there is an effective pause mode. Make sure that your code and data is robust enough. That

No mouseover

With touch screens, there’s no mouse cursor. So don’t rely on a hover state to indicate that something will happen if it’s clicked. Buttons need to look like buttons now.

Higher resolution

Mobile screens tend to be smaller, but actually have a higher pixel count than many of your other users’ monitors. The problem with this is that those smaller form-factor devices will scale images up, because they tend to assume that your CSS style sheets are built with most monitors in mind. The upshot is that your raster thumbnails will look yuck to mobile users, but great to you. To avoid this, provide images that are wider than the HTML element’s width.

JavaScript has won

There are a number of reasons why JavaScript has beaten other technologies. Don’t cut against the grain.

And WebKit is still in front

If you want your iPad users to really smile, take some time to learn the -webkit CSS extensions. They’ll look great. And your tech soul will be happy because you’re using the GPU to do what it’s supposed to.