The basics of mobile web design

With the rise in usage of mobile devices, designing a mobile website has become a must have for any company or organisation who wants to keep up to date with modern trends! Mobile sites open an entirely new door of customer exposure and interaction with customers who don’t have regular access to the internet through a pc as well as those who need to browse the web on-the-go.

With the rising popularity of social media sites like Facebook and Twitter and their easy accessibility through mobile devices, many users are turning to mobile internet as their preferred option. Don’t miss the trend by following these easy steps to designing a mobile website:

Planning: Take some time before you actually create the site to think about what role the mobile site needs to fill and how this can be achieved. Some questions you should answer are who is the site for, whatshould it contain and how should it look?

Creating content: Once you have your web design planned out, you need to fill the planned pages with content. This is most easily done by rewriting your existing web content so that it is much shorter and more easy to read (remember that people will be surfing on a much smaller screen so you have to give them bite sized pieces of information).

Set-up sub domain: Most mobile sites contain the sub domain ‘m’, e.g. m.facebook.com. This indicates to your users that it is a mobile friendly site. Ask your server administrator for help with this step as it’s important.

Use existing models: To create the skeleton for your site, there are a number of great templates you can use such as iWebKit. These templates provide a basic framework which you can fill in and personalize.

Add features: Once you have the skeleton design of your website, you can start thinking about cool features to add on like click-to-dial, Google maps add-ins or Facebook and Twitter feeds.

Initial testing phase: Launch the mobile site, enter the address into a mobile phone and see if the site is functioning properly. Take note of any errors and make alterations where necessary.

Secondary testing phase: Get some friends, employees and customers to test the mobile site themselves. Take note of their comments and experiences and adapt the site to accommodate them.

Mobile sitemap: Create an html or xml sitemap and publish it on your site. This helps search engines like Google pick up your site faster and to keep track of content changes.

Launch the site: Announce the launch of your site on your main website and any blogs, social media sites and advertising campaigns that you have to let your users know that the site is available and ready to use!

These are the basics which should get you started, but remember to constantly analyse how your site is being used and what mobile web design improvements can be made to keep your users happy and coming back!