How To Convert A Website Into A Mobile Website

myit web design graphics

Smartphones and tablets are taking over from PCs and the vast majority of these users are using these cellular devices for accessing the internet. So you can well understand that a website designed only for the desktop will not suffice in capturing the attention of your entire target audience. Don't forget too that a mobile website does not have a lot of room for bulky 'flash' elements, banner ads or large graphics and no Apple mobile product (iphone, ipod, ipad) can display flash graphics anyhow.


Going the mobile website route - a step-by-step guide

Take the time to do some good website analysis before you start off with the conversion of your regular website to a mobile website. Find out if your site is using lots of different multimedia files, images, videos, file formats. You should also check if the current website is taking a long time to download … this will matter more on a slower mobile phone internet connection rather than a mobile device connected via wifi. The internet functions in a similar way for mobile devices and regular computers, but you need to make the website easy to navigate and read for each user. Try these steps:


Inspect Your Current Content

Navigate to your current website and make a note of every link, page, video and graphic that your site has, noting whether you want that content to be available in the mobile website.


Find Any Particularly Large Web Content

Take a note of the download speed of each page in case any page is particularly slow. Try the pages on your PC and smartphone. If a page is slow find out what is making it slow. Are there lots of large images? Some feature-rich graphics that are slow to load? A video which is pre-loading before the rest of the page? If something is particularly slow to load on your PC you will need to exclude it from the mobile site for now until you can speed it up or replace it with a mobile version.


Prepare Any Mobile Specific Content

You may need to rework your web page text to make it more precise for the mobile web - it may be fine, but you'll need to think of each piece of content in terms of a mobile phone user. Also, you could use photoshop or fireworks to resize large images so that they are mobile-web friendly.


Prepare A Mobile Layout (Or Get A Web Designer To Do It For You)

Use an image editing software package to create a mockup of a mobile site layout at e.g. 320 pixels wide. This will allow you to rebuild your current homepage and inner page in the new 320 pixel width format so you can see how your logo, menubar, company colours and content will look on a mobile site. It is best to make use of this mobile optimised view as a template for creation of headers as well as content for the mobile website version.


Prepare Your Mobile Content For The Web

Once you are happy with the new mobile website design layout (homepage and inner pages) and you have the content for each of the mobile website pages, save your work and give it to your web developer to turn it into mobile format. You could do this yourself with a software package like Dreamweaver. When each web page is completed upload it, and the associated images, to your website hosting with a free tool like Filezilla.


Upload Your Mobile Website

When your mobile site is finished there are a few ways that a website visitor can see it. You could put the mobile website at www.yourdomain/mobile and let the user select a mobile version, or your could install automatic switching-code which will detect if the user is using a mobile phone and automatically switch to the mobile version. Talk to your web developer about implementing these options. The 'Responsive' website design model would be a third way of implementing your website where you have one website and the website 'template' is changed to suit the device that is visiting your website. This is the smart way to operate as you have just one website to maintain and for bigger sites it makes a lot of sense.


Think About The Mobile Website User

Converting to a mobile site helps you tap a large section of your target audience which frequently uses a mobile device. During the process, take into consideration the user experience of being on your website on a mobile phone. It will be a different experience to being on a large PC monitor so it's up to you to make it a good user experience so that the customer gets what they want and makes contact with you to purchase your products or services.