Why Mobile handset support is a MUST for your blog?

In 2010, I had only about 900 visitors that browsed this blog via mobile devices with iPhone and iPad leading the pack followed by Android, iPod and Symbian respectively. 900 is not a very big number as compared to the overall traffic over a year but the recent trend shows steady growth in terms mobile traffic. The bounce rate however was very high (at 84%) probably because the content wasn’t easily readable on mobile devices. I am sure that must be the case with most other blogs as well.

With this being the case, it makes sense for every website including blogs to start supporting mobile devices. When it comes to WordPress blogs, some themes may naturally look good on mobile devices but they aren’t still optimized for mobile handset browsing. In this post let me explain why it’s important for your blog to support mobile users, what are the UX (User experience) expectations from mobile point of view and how a WordPress blog can support mobile browsing.

Why mobile user is important for your blog?

As I mentioned more and more people will start using higher end mobile devices for browsing the web and reading content. This is mainly because of multiple factors including the ever increasing power of mobile handsets in terms of processing speed, form factor and usability is increasing as well. To support it further, the mobile networking technologies are getting faster as well. I wouldn’t be surprised if my blog’s mobile traffic contribution is something like 75% three or four years from now.

If your blog is not supporting mobile devices, you may be already supporting some ad income as well. Mobile ad technologies are on a faster growth track and they may even offer better click-through-rates as compared to traditional text and image ads on broader channels.

Mobile v/s Computer UX

Though mobile screens are getting bigger, there’s certainly a limit to which it can grow. So in terms of faster browsing experience a website supporting mobile handsets must have the following traits for the mobile version:

  • Fast downloading pages (many readers are still on EDGE)
  • No horizontal scrolling (this is true with any reading on any device)
  • Not much of client scripts
  • Not intensive on graphics, videos and other media
  • Short and crispy titles
  • Contrasting background color and fonts to support outdoor reading

Of course, not all of the above are true for high end devices like iPads etc but in principle the mobile version of any site should look neater and crispier on any mobile device.

To check how your blog looks on a mobile device you could use those emulator programs such as the Opera mobile emulator.

WordPress plugins for mobile support

As compared to regular websites, blogs running WordPress can already use one of those mobile plugins to render the blog content neatly on mobile devices. Two such plugins that I used to support mobile on this blog are MobilePress and WPTouch plugins for WordPress. There are numerous other mobile plugins for WordPress available out there for your consumption.

The following screenshots show how DollarShower was rendered by WPTouch and MobilePress respectively on my Android handset. In fact, only after buying this new handset, I discovered how ‘ugly’ my regular theme was looking on mobile devices. I settled for MobilePress primarily due to its ease of use though I struggled a bit to edit the theme to match this blog’s current branding. WPTouch looks naturally good without much settings effort, though.

WPTouch version of DollarShower

WPTouch version of DollarShower



DollarShower - Powered by MobilePress

DollarShower on MobilePress

Things to remember

When your blog start supporting a mobile edition, you may actually miss out on several supporting functionalities. Most mobile themes support core WordPress features such as pages, categories, archives, search etc but you may have to either set (via options) or manually add the following:

  • Appropriate header and tagline as you may opt not to display a logo
  • Tracking code (such as Google Analytics)
  • Ad slots (most mobile ad networks support only one ad per page)
  • Copyright information

Any other part of the blog that’s rendered specially via plugins (e.g. Archives page, Contact form) may need some attention as well. I am yet to fix these pages in my new mobile theme.

I hope most of you already have mobile support for your WordPress blogs. If not act now so as not to lose potential visitors and blog income from that particular channel.

Happy Blogging!

Comments

  1. Yes Ajith, you said the point, technology is changing mobile browsing is booming, so we should take proper actions.

    Opera Simulator is a cool tool, your BR is too high i think, it may to the theme, me reduced my br to below 50.

  2. Adam :

    If you have a second, try out the WP Mobile Detector!

    It can detect over 5,000+ mobile phones. No other mobile plugin currently has that capability!

    http://wordpress.org/extend/plugins/wp-mobile-detector/

  3. Nihar :

    Great share Ajith.

    I will quickly head over to opera simulator and then try using wp touch / media or mobile detector recommended by Adam.

  4. Yep mobile browsing is definitely on the rise and being prepared for it is a must.

    I’ve been thinking of ways to get an ecom site to be more mobile friendly but it aint easy.

  5. I just am trying mobstac for the same. The content looks cool but yet to get traffic :-)..

    definitely with the new mobile devices coming in the market now, mobile ads should start generating more revenues for you and hopefully for all of us too 😉

  6. rohit :

    hay gr8, before i was using wordpress mobile pack, but after reading this post..i switched to mobilepress..but how u changed the theme to red.. Can u send me header.php file of mobilepress..

    • Sorry man, I cannot send my header.php (might contain certain info that I don’t want to share lol). But changing the color is so easy – You just need to locate #header and #footer declarations in header.php and change the color there. If you want anchor text colors to be different look for “p a”.

Speak Your Mind

*