Kickstart Mobile Website Development

I getting a mobile website project this month , so for the past few day  I been doing some research on it, just to share some of the tools that helps.

So what is mobile website development involved  ? basically you need to build  a website that rendering nicely on mobile web browser , this include tablet as well. The project I getting is to build a mobile site to display to the user when they visit the site by using iPhone/iPad , the original site is build on Flash, which can’t display on all the iDevice.

So after doing some research , I think responsive design is what I need , this allow me to tweak style sheet for different display size of device  and there 2 important tools that can help for this mobile website development process.

Mobile Boilerplate – this a HTML5 template that use for mobile web, it strip down the unnecessary things to make it small. You can check out the long list of features which include some other JavaScript that help IE rendering HTML5 nicely and support of responsive of design.

320 and up – this is some extra file which you can replace some of the files in Mobile Boilerplate , 320 and up is design from small screen first and work up to desktop , which I think quite important since our main target is those mobile user.

Combine this 2 will be the base of your mobile website , the rest will be depends how you going to design and develop the mobile site. One thing I m still trying to figure out is how to implement finger gesture ? like swipe for next content or pinch to enlarge the images , maybe the part 2 of this post will be talking about it.