Making your blog look good on a mobile device

When visiting websites on your mobile device, there’s nothing more frustrating than waiting for a site to load when that site contains huge numbers of images and other graphical paraphernalia.

It gets downright annoying when you’re on a cellular connection and especially if you’re roaming: all you see are currency symbols flashing in front of your eyes as you think about what it’s costing you to wait for all the content to appear on your device’s screen.

And when a site does eventually come up on screen, it will likely be formatted for viewing on a computer screen, not the small screen of a mobile device.

Other than grin and bear it or move on somewhere else, there’s little you can do if a website publisher doesn’t offer a mobile-friendly version of the website, either a special URL you go to or – best of all – a means by which the site detects the type of browser you’re using and serves up a mobile-friendly version of the site if it’s a browser on a mobile device.

So what does a ‘mobile-friendly’ website look like?

Something like this perhaps – how this blog looks when viewed in, from left to right, Opera Mini and the native phone browser on my Nokia N95 8GB that runs the Symbian operating system:

No graphics, nothing but the text and links, all formatted neatly for the small screen of a mobile device so no horizontal scrolling around to find the content you want to see.

The blog has no separate URL: when you visit here at www.nevillehobson.com from a mobile device, the plugin automatically detects the type of browser and serves a nicely-presented version of the site that is designed for those small screens and focuses on text and links not graphics.

So the blog loads rapidly on your mobile device, which is what you want when you’re out and about, whether on wifi or a cellular connection.

What about an iPhone or an iPod Touch? How would a blog like mine appear on one of those devices?

From the design and functionality points of view, you have to hand it to Apple and Content Robot.

Not only does the blog look good on an iPhone or an iPod Touch – the bigger screen is a big help – it includes the main elements that let you interact with the content rather than only scroll and click from link to link as is the case with Symbian- and Windows Mobile-based devices.

You also get some of the content of a post as well as the means to interact, eg, leave a comment, or post to Digg or delicious.

So if you run a WordPress blog, I urge you to install both of these plugins:

Great post, Neville! As a heavy user of a mobile and owning “just a simple” SE Z710, I encounter this daily.
And judging by comments on Twitter when a new version of WP is out, several of the blogs I read seem to use WP.
I’ll be sure to spread this around.

(This reply was written on aforementioned mobile, using Opera Mini :) )

Extending outside blogs, the other thing is to consider why people will be visiting your site when using a mobile. Someone visiting a train company site most likely wants to know the times of the next trains, not competitions or offers, so take them off your main page for browsing, but give people an option for a “other options”.

Looking at it from the other end, I manage a few blogs that have these plugins installed. They are fantastic to use from the admin end as well. Very easy to set up, and once you have set them up, you can forget them.

As a matter of fact, a few weeks ago I saw mention of iWPhone, downloaded it and prepared everything for an install only to find that I had installed it a year earlier when the original iPhone came out. That’s my kind of plugin.

hi I was reffered to your discussion via a colleague posting link on friend feed. I am using an I touch and it looks good on that. I use blogger but have used wordpress before. Personally I found blogger a quicker tool to set up my navigation

[…] a great post for you bloggers â€“ and your readers â€“ on NevilleHobson.com. Find out how to format blog content for an iPhone or other mobile device. After reading this post, and heeding Nevilleâ€™s advice, your blog will load with improved […]

I have an Android and it views iPhone themed sites perfectly. If the iWPhone WordPress Plugin and Theme plugin does not detect Android, I suggest it should since it looks so much better than the WordPress Mobile Edition plugin.

I use the WordPress Mobile Edition on my own blog at the moment, works great!