Eight tips to keep your mobile website readers happy

The past few weeks have found me on the road quite a bit, as I visit theme parks around the country for my “day job” website. So I’ve been using my iPhone to keep in touch, via WiFi, AT&T’s 3G network or, when I’m really out in the sticks, the Edge network.

Smart phones provide a great way for people to work productively during “down” moments throughout the day. And for road warriors to stay in touch, even when driving the nation’s Interstate highways. (Okay, when riding on the Interstate. I’m a stickler for not using the phone when in the driver’s seat.) Heck, earlier this week I set up and did two radio interviews while in the car.

But as useful as smart phones can be, their effectiveness can be undermined by information providers whose sloppy or ill-advised design keeps phone readers from getting the information they want. Here’s what I wish Web publishers would do to make reading the Web by phone easier:

Don’t redirect all requests from a mobile phone to your mobile version front page.

Few things tick me off more than following a link to what I expect to be a great story, only to find myself instead on that site’s front page, with no direct link to the story I wanted to read.

But that’s what happens when a website is configured to send all initial requests from a mobile device to the site’s mobile version homepage. Why on Earth do websites do this? Sending users something other than the content they requested breaks what ought to be the first law of usability – give people what they asked for.

If you don’t want mobile users to use deep links to access your website, don’t send them deep links via popular mobile applications, such as Twitter.

It’s one thing to get the nasty mobile redirect on a link sent to me from another reader. Hey, they don’t work for the site, how are they supposed to know that site doesn’t support mobile deep links?

But it’s something else when I get the link from the people who run the site. Sending me a deep link via your Twitter feed, then redirecting me when I click on it, is simply bait and switch. Worse, it makes me feel like you’ve just flipped me off. Guess what? You do this to me, and I will “flip” you off in response – with an immediate “unfollow” for your feed.

Mobile websites should include all the content available on your “normal” website.

If you’ve created a mobile version of your website, great. But don’t force me through the front page and don’t leave me reading the “kiddie” version of the website, with only a limited number of stories and features and no way to access the rest of the content you have online.

While I appreciate the ease of use on a mobile-specific website, I hate paying for that with an inability to get to the deep content I want on your site. Again, the point behind building an alternate version of your website ought to be to expand the audience, not to contract it by limiting what a growing percentage of your audience can read.

On an ideal site, each story or item would have a unique URL, which would serve the appropriate version based on the device requesting it.

Let’s face it, the real power online lies not with us (the content producers) but with the readers. They can do more to promote our work than we can do without them.

So let’s make it easy for them to distribute the URLs of our best work. If you’ve got multiple versions of your website, set up your server to support those versions on the same URL. That way, mobile readers see the mobile version, even if a “traditional” reader sent them the URL, and vice versa. This also can help prevent search engine spider from indexing mobile pages you don’t want them to see. (Though you must take care to avoid doing anything that they might consider cloaking.)

If you are not building different pages for different devices, cross-test so that they work on all major platforms.

Devices like iPhones are plentiful. There’s no reason now not to look at your site redesign on one before launch. If you don’t like the way it functions, your readers won’t either.

Keep column widths constant, and between 320-500 pixels wide for best mobile readability.
The iPhone’s screen resolution is 320×480 pixels, but it will scale to fit the site on the screen. A double tap will expand the column tapped to full screen width. At up to about 500 pixels wide, the rescaling leaves the body type readable, on most sites. Go wider than that, and the type will be too small for most readers, forcing them to expand the page and scroll sideways.

Which, most won’t bother doing on a regular basis. They’ll simply switch to a more mobile-friendly website instead.

Kill mouseover effects and Flash on your website, unless you are redirecting mobile users to a different version of that page.

Many, but not all smart phone, support inline Flash in their browsers, but mouseover effects remain a killer to effective mobile website navigation. Either use straight anchor tags for site navigation, or else redirect mobile readers to a mobile version of the page they requested, which using anchor tagging for navigation.

Otherwise, you’re just making it more difficult for many mobile readers to make their way around your site. Which means, they won’t.

Deliver your content via applications your mobile users already have before asking them to download another app.

I’ve offered these suggestions under the assumption that readers are accessing your content via a mobile Web browser instead of via a dedicated mobile application, such as those USA Today, the AP and the New York Times offer on iPhone.

Those apps can be very popular, but if you’re not one of those big names in the industry, you are better off meeting potential readers where they are, rather than asking them to come to you (or, your app).

Start by building a great, mobile-friendly website, then promote it with mobile-friendly links on services like Twitter and e-mail. Once you’ve built a loyal audience of mobile users, then consider investing the time and programming power to build an application just for them. But if you can’t yet use existing mobile applications to serve your smart phone readers, you don’t have any business trying yet to build your own.

About Robert Niles

Robert Niles is the former editor of OJR, and no longer associated with the site. You may find him now at http://www.sensibletalk.com.


  1. says:

    Find more tips/guidelines for mobile Web design from the W3C Mobile Web Best Practices document (also avail. on handy flipcards: http://www.w3.org/2007/02/mwbp_flip_cards.html)