How to Build a Mobile Version of your Website

On December 8, 2009, wrote:

These days more and more people are accessing the Web through their mobile phones. They’re checking their E-mails, surfing, reading the news, and even shopping – literally “on the go”. Wouldn’t you like to make your website “pops” for mobile? Don’t think it’s an impossible task. Today tools that format your website or blog for mobile phones and smartphones are aplenty. Most of them don’t even require web design or HTML expertise! Let’s take a look at some of them.
mobile web

Really Sweet Tools

Mippin: This is a fast and free service that can “mobilize” your website or blog, so long as it has an Atom or RSS feed. It also offers built-in content variety through a list of sites delivered in simple format for the mobile audience. While there aren’t lots of features on Mippin, you’ll still have full control of your logo and branding efforts, as well as access to your traffic and reporting stats. And, to make sure you reach even those without iPhones or Google Android devices, Mippin can create a mobile version of your website that’s viewable even on WAP-compatible mobile phones.

MoFuse: This is one of the fastest growing networks of build-it-yourself mobile sites right now, but MoFuse has actually been doing it for a long time. It has already powered the mobile version of over 23,000 blogs. MoFuse Premium, a paid service, is best for businesses of all sizes. Plans vary, and a fully functional mobile site can cost as cheap as 8 bucks a month. As with Mippin, MoFuse users can also get analytics about viewership of their sites.

mobiSiteGalore: This tool promises to let you build your own website – in minutes. mobSiteGalore is a free service, and one of the reasons why it stands out from the rest is that you can actually build a complete website, all by yourself, from your mobile phone. No need to download or install anything.

Mobify: Mobify has gotten plenty of good reviews from users who’ve designed mobile versions of their sites through this tool. It works well with well-formed HTML and predictable URL patterns, as well as with websites and blogs based on WordPress, Drupal, and ExpressionEngine. Using mobile CSS editing, Mobify can mobilize a website or blog in as fast as a few minutes. More advanced web designers and publishers, meanwhile, can also fully customize their high-profile content portals and websites for complete mobile integration. Paid packages let users enjoy advanced analytics, advertising, and support options.

jQTouch: jQTouch is another plug-in for mobile web development on the iPhone and other mobile devices and smartphones. Setup is easy, and with jQTouch, you can also create websites and web applications with animations, flexible themes, customized UI elements, swipe detection, and extensions.

Going Mobile with WordPress

WordPress Mobile by Mobify: This is another free service that lets you design the mobile version of your website on Mobify. (You would have to register an account first.) You then deploy the WordPress module, which detects mobile browsers and redirects your visitors from your regular WordPress site to your Mobify URL for mobile.

WPTouch: Do you have a WordPress-powered site or blog? WPTouch lets you package that into mobile devices, particularly the iPhone. Well, and the Android, Storm, and Pre, too. WPTouch is a lightweight, fast-loading, feature-rich and highly-customized “theme application” which includes an admin interface to let you customize many aspects of your site’s presentation.

WordPress Mobile Edition: This plug-in helps you create an interface for your WordPress blog or site whenever visitors arrive via mobile devices. It supports the Apple iPhone, as well as other touch devices, and is fully customizable. Moreover, WordPress Mobile Edition serves as a great interface to mobile search crawlers, like that of Google and Yahoo!.

WordPress Mobile Pack: This is another plug-in that helps you mobilize your WordPress blog or site. Among the highlights of the WordPress Mobile Pack is a mobile switcher that lets mobile users switch from desktop to mobile presentation, and vice-versa; a basic recognition of browsers that then rescales images for the mobile screen; a mobile administration panel that lets you access your WordPress dashboard using mobile devices; and a mobile ad widget that lets you place advertisements on the mobile version of your site.

Drupal Goes Mobile

Drupal’s Mobile Plug-in: Drupal, an open source content management platform, created this tool to let users enjoy a mobile-optimized view of websites and blogs. The plug-in has several noteworthy features, which include automatic device detection, a distinct theme for mobile sites, and a tool that automatically replaces embedded YouTube videos with thumbnails for mobile viewing.

OSMOBI: Dubbed as “your open source CMS website on any mobile”, OSMOBI is a simple and free solution for users who use Drupal and Joomla!. You first have to download and install the module to mobilize your website. Once that’s done, you can enjoy instant mobilization, the option to test projects, CSS and content editing, as well as Google Analytics measurements. Paying for the premium service entitles users to extra features, such as the AdMob advertising platform and the iPhone webclip icon.

Designed for the iPhone

WPtap: This iPhone plug-in and theme solution was created by developers who want to make the “iPhone experience more fun”. It lets users customize various aspects of WordPress sites or blogs. WPtap has a bunch of colorful themes that you can use for your mobile site, while also giving users the option of switching between the WPtap view and your WordPress site’s regular presentation.

iPhoney: Okay, here it almost sounds like you won’t be getting the real thing. But this iPhone web simulator is perfect for designers and publishers who want to see how their websites or blogs will look on iPhone: down to the last pixel. Among the great features of this useful tool are: the ability to test iPhone-enabled Web 2.0 applications and compatible websites; the option to test any website that works with Safari; the simulation of browser redirection scripts and the option to turn off plug-ins, including Flash and Quicktime.

iWebKit: This file package, designed for mobilizing sites for the iPhone and iPod Touch, is great for simple and advanced users alike. More than just websites, however, the iWebKit can help users create their own web applications for the iPhone or iPod Touch.

Matthew James Taylor’s iPhone compatible CSS layouts: Taylor is a multi-skilled artist and web designer who has designed beautiful multi-column CSS layouts – compatible with the iPhone. The main features of his designs include: no CSS hacks, SEO-friendliness, no JavaScript, resizable text, and stackable columns. Best of all, they’re free for anyone to use.

Get Inspired, with these Resources

Mobile Web Design by Cameron Moll: This book (or e-book) offers “a web standard approach for delivering content beyond the desktop.” It gives readers 100+ pages of practical advice and tips, plus over 40 screen shots. Overall, Mobile Web Design is a great reference for anyone looking to learn more about the world of mobile web.

Mobile Design Showcase: Smashing Magazine put out a slideshow of really hot mobile web designs, most of which demonstrate how the tools above can optimize your website or blog for the iPhone and other mobile devices.

Stay Connected, Subscribe to the Lakeshore Branding blog feed via RSS, email and you can follow Lakeshore Branding on Twitter!

What do you think? Share your thoughts by leaving a comment.

6 responses to “How to Build a Mobile Version of your Website”

  1. tomas says:


    you can also use for creating your mobile website.

  2. Chris Campbell says:

    Thanks for the feedback and suggesting that as another resource Tomas.

  3. jay says:

    I enjoyed your post, thanks!

  4. Mikel Valdiviezo says:

    Nice level of information here. There is so much data around about this subject that sometimes you cannot see the wood for the trees but you have pitched this at just the right level so that the lay person can understand – thank you!

  5. Kirk Storch says:

    Awesome post

  6. Michele Leuck says:

    thanks !! very helpful post!

Leave a Reply

Your email address will not be published. Required fields are marked *