Skip to main content

Writing Mobile Version of Website

With advancement in cellular technology, number of people using internet via mobile is constantly rising. Sophisticated mobile phones such as Iphone and Blackberry have revolutionized the world of mobile technology and have made internet browsing a wonderful experience.  Most of the websites available today were designed for computers and are totally unsuitable for mobile viewing, taking 60 or more seconds to load and looking jumbled and confused as they’re squashed onto smaller screens. However thousands of people are releasing mobile versions of their websites and seeing greatly increased levels of traffic as a result. Unless you optimize your website for mobile phone users soon, you could be left behind by the competition. Creating a mobile-friendly version of your site sounds like a daunting task, but it couldn’t be easier to do. The easiest way to build your mobile site is to modify your existing website to make it compatible for mobile handsets. If you decide to do so, expect that there will be big changes in terms of layout, design and construction. When you build a Web page you need to think about who's going to view it and how they are going to view it. Some of the best sites take into account what type of device the page is being viewed on, including the resolution, color options, and available functions. They don't just rely on the device to figure it out.
Below are a few tips that would provide a guide towards developing a successful mobile website and would enable you to explore the vast market of mobile internet users.
1. Focus on what users actually need on the move
It’s a mistake to think your mobile site should simply be a condensed version of your website. Instead, work out what people on the move will come to your mobile site for and focus on creating content around those key tasks and functions. Many pages on your standard may never make it to the mobile one.
Task-oriented users need their needs met quickly. People visiting a train operator’s mobile website will have little time for the “About us” pages when they want to know if their train’s running late, for instance.
Once you’ve worked out your users’ needs, find ways to make the user experience clearer and faster. If your site has videos, for example, include the length of each one so people can decide if they have enough time to watch one.
2. Cut ruthlessly – but stay instantly understandable 
There’s minimal room for clever puns and wordplay on the web, but when it comes to mobile sites there’s none at all – unless you can be both funny and instantly understandable in the tiny space available for links and headings.
3. Keep home pages for navigation
A welcome message on a standard website is a waste of precious space, on a mobile website it’s sacrilege. People have come to your site for a reason and would rather have that need met instantly than spend five minutes reading about how happy you are to have got them there.

4. Leave space between links
The increasing popularity of touch screen phones means it’s vital users can tap on a link and accurately select the link they’re aiming for. So make sure the designers don’t edit out your white space…
5. Don’t forget SEO
Research by Nielsen Mobile in 2008 showed that 40 per cent of all mobile users came to a site through a search engine. So even though there’s less space, don’t overlook the keywords.
6. Make a user’s journey through your mobile site easy
If it’s difficult to navigate on your mobile site, people will get annoyed and leave. To make a user’s journey as smooth as possible:
v  include navigation menus at both top and bottom of each page so people don’t have to scroll back up to the top every time they want a different page
v  put lists in a logical order for speed
v  Link more than you would on your normal site. put short logical links at the end of every section to relevant content so users don’t have to spend time entering text into search boxes
7. Keep everything self-contained
People won’t hunt around or go backwards and forwards on a mobile site so put everything exactly where they need it. Make sure sentences, links, headings and form fields make sense by themselves, as self-contained units of information.
8. Don’t rely on design
The variation in the way sites will display on different types of mobile phone is huge – so avoid directing visitors to look “below”, “above”, “to the left” or “to the right”: what you think is there on your iPhone might not be what the user is seeing on their five-year-old brick.


9. Put a link to your full site on every page
Catering for the small percentage of people whose needs aren’t met by your mobile site is simply good customer service. It means people with more advanced phones can use the full web too, if they want to.
10. Keep forms short
Minimise the time it takes visitors to do tasks on your mobile site with short forms that only include the essential data needed to complete a task. Don’t be tempted to add extra fields to capture data – it’ll lead to a lengthy, irritating user experience that visitors just aren’t willing to take part in on the move.
11. WML
In the early days of mobile web devices, the only way to surf the mobile web was to browse WAP (Wireless Application Protocol) sites. A WAP site uses WML (Wireless Markup Language) as its primary markup language. WML is an XML markup language based on the card-and-deck metaphor. Luckily for us, WML has since been superseded by several other technologies -- in fact, if you're just getting into the mobile web game, you can probably ignore WML entirely. WML is mostly used by legacy systems or by sites that explicitly target customers with low-end phones that are six years old or older.
One potential group of customers still using WML browsers, however, is those in developing nations. The Nokia 1100 and 1101, for example, are extremely basic, extremely cheap phones, of which an estimated 200 million units have been solid worldwide, making this phone the best-selling model to date, worldwide. If your site is targeted to this market segment, WML might be the best solution for you.
12. XHTML
For most sites, we can ignore WML and make use of a markup language with which you're probably much more familiar -- XHTML.
Most built-in phone browsers these days can handle XHTML just fine. A mobile phone recognizes two flavors of HTML:
1.      XHTML -- the same, basic XHTML rendered by desktop web browsers

2.      XHTML-MP -- the MP here stands for Mobile Profile
The difference between these two languages is that XHTML-MP consists of slightly fewer elements and tighter restrictions. These differences exist to make it easier for the mobile device to parse and render a web document, but writing XHTML-MP markup shouldn't introduce any significant changes to your process for writing regular XHTML.
Anecdotally, when my team and I develop mobile web sites we usually use regular XHTML, and this approach has served us just fine.
13. Target the right customer:
The goal for any web site should be to know your customers in order to deliver to them the most appropriate content.
This goal is even more important with mobile sites -- not only do you need to know your customers, but you need to know what they are likely to be doing on your mobile site, as well as where they'll be when they're doing it. Traditional web site customers are most likely sitting at a desk facing a large monitor that has a decent resolution. Visitors who are browsing your mobile site are unlikely to be in the same circumstances -- they might be waiting in line, riding on the train or the bus, running to the departure gate, or lost in an unfamiliar town late at night and trying to get somewhere.
14. Rethink navigation
Your website might have a couple of dozen footer, header and sidebar links, but do they matter to your mobile visitors? Mobile web surfing is known for its high bounce rates (users come to look at just one page), so focus on a few key areas of the web site and acknowledge your visitors’ short attention spans. Don’t think twice about eliminating links to destinations that don’t have a high mobile priority.
At the same time, consider adding or prioritizing mobile-specific items. That tiny “Contact” link hidden in the footer of your full site  could be a great top-line header item for the mobile version, simply because many users will come looking for a phone number or your office address. Another great item to have in the mobile header is Search.

Below are some tools that would help you greatly in developing a mobile version of website. These tools are easy to use and most of them are free.
MOFUSE:
MoFuse is one of the most popular mobile website builders around, which is unsurprising considering its excellent customizability. Visit the MoFuse website, click “Launch a New Mobile Site”, choose a mobile domain and insert your URL. Next, click on “Add Elements” to add dynamic and static content to each page. Click on “Layout” to transfer elements to your live site, dragging and dropping them to create the optimal visual arrangement before, finally, previewing your new site using MoFuse’s emulator, which brings up a mobile phone screen on your computer’s monitor. For bloggers, MoFuse is completely free and even easier to set up.

MIPPIN:
Mippin is an absolutely fantastic tool for those who want to mobilize an RSS-driven site. It doesn’t offer the same level of customization as MoFuse, but it’s much quicker to use and the results look great, every time. What’s more, your site will be optimized to work on over 2,000 handsets and the service is completely free. It provides users with basic analytics in reports, as well as the ability to earn money through mobile advertising.
WIRENODE:
Wirenode is a very basic mobile website creation tool. Customization options in Wirenode are even more limited. It offers some pre-made templates to use on your site and allows some minor modifications like font color and background color. It has no support for custom domains but it does have a visitor tracking tool.
SWIFT:
Swift’s features are comparable to those offered by Mofuse. It has plenty of customization options, a lot more than what Mofuse provides and it’s possible to make your website sport a completely unique look. This means that you can customize everything from logos, to link colors and backgrounds and the position of various elements. It also has their own analytics tool for visitors tracking and supports custom domain.
The only downside of Swift is that it adds a small advertisement banner to your pages and no, it does not share the revenue with you. If you upgrade to their Pro plan at $10 a month, you can get the banner removed.
GOOGLE MOBILE OPTIMIZER:
Google mobile optimizer is the quickest way to convert any website into a mobile friendly one. Just supply the site URL and it will optimize the site for viewing in mobile phones by removing the site header, ads and resizing all image contents. This is actually an on-the-fly mobile site creation tool. There are no signups and no way to customize the look of your site. 
ZINADOO:
Zinadoo is a really slick, free tool, which lets users build a mobile site quickly and easily. Users can make the most of Zinadoo’s web and mobile widgets, as well as its text and email services, to promote their site to an online and offline community. Furthermore, they can optimize their site for Google Mobile with keywords and tags, and upload videos using Zinadoo’s Mobile Video. As if that wasn’t enough, users can also gain access to Zinadoo’s online Business Directory and Mobiseer, a Web 2.0 service for organizing, tagging, sharing and managing favorite mobile sites.

Comments

Popular posts from this blog

Ipad apps: AppStart Review

AppStart For iPad Review Free for a limited time only , AppStart for iPad is a terrific app by the folks over at  AppAdvice.com  that’s meant to serve as a starter guide for new iPad users and owners. The promotion is only available for a limited time as customers flock to pick up their iPad 2s this week. Whether you’ve had your iPad since launch day or you just picked one up, AppStart For iPad is a detailed and comprehensive guide for the most popular and useful ways to utilize your iPad in addition to recommending a few apps to get your feet wet. When you first open the app, the home screen is displayed in a clean grid of buttons for you to tap-in and find out everything there is to do with the iPad. Each grid-box allows you to open up a mini-guide for how you can use your iPad as an eReader, home theater, radio, nightstand, magazine, or social media hub. Within each mini-guide, the folks over at App-Advice also throw in their suggestions for both free and paid apps that re...

Ipad 2 Accesories

Zagg have done it again and released what we are excited to say is the seasons MUST HAVE iPad accessory: The  ZAGGmate iPad case with keyboard . It’s not often that we get entirely blown away by an accessory for the iPad, but this one has left us shell shocked and in awe. The perfect compliment to your iPad, this is the first iPad keyboard case combo that we have seen yet that has done it right. In fact, it’s the best bluetooth keyboard we’ve seen to date as well! It’s so right and so perfect that we already wonder how we ever used our iPad without it! Check out the review below… ZAGGmate with Keyboard The iPad’s New Best Friend Our first impression of the ZAGGmate was: “Where’s the rest of it?” This iPad case is unlike anything else we’ve seen on the market to date and the designers at Zagg worked hard to literally rethink what an iPad case could be. This is an iPad case that doesn’t cover the whole iPad, but rather just covers the iPad’s screen, and leaves the back of the tablet...

Ipad 2 Apps: Skyfire Web browser Review

Ipad 2 Apps: Skyfire Web browser Review Skyfire for the iPad made headlines when it was first released, due to its ability to play Flash videos on a device previously void of this popular technology. Users flocked to the App Store, eager to drop five bucks for the chance to view their favorite clips, shows, and movies on their iPad. Not only did the browser play these videos, but the integrated video compression saved a significant amount of bandwidth for people on a restricted data plan. The initial excitement wore off quickly, though, as complaints were rampant about many sites not playing videos as expected. Since its inception Skyfire has certainly improved in this area, now claiming support for over 200,000 websites containing Flash. The dissenters will always be there as not every Flash video on the Web will be playable, even if the developers at Skype Labs remain diligent. Some of the backlash is warranted to a certain extent. If I paid $4.99 with the intent of viewi...