When analyzing statistics about internet usage, one of the major recent changes is the growth of web usage via mobile phones. It has been estimated that in the next few years, the numbers of mobile internet users will be in the billions.
To create a mobile friendly website, it is important to realize that mobile browsing a very different experience to desktop browsing. There are many more restrictions which need to be accommodated, yet there is ample room for creativity.
There are many tools for creating mobile versions of your website. The follow are some of the most notable tools which are user friendly and don’t require programming skills: Mobify, Mippin Mobizer, Wirenode, Onbile, Winksite, iWebKit and MoFuse. These operate by detecting what type of device is being used. If it is a mobile device, then the browser will show the mobile version of the website.
If your website is on WordPress, you also have the option to use plugins which automatically convert your website to a mobile design. Examples include MobilePress and WPTouch. If you are comfortable with coding, then you can use CSS media queries, which will also adjust your website accordingly.
Screen sizes and resolutions vary widely for different mobile devices. Resolutions can range from 101*80, to 800*480. An additional consideration is that the position of the screen can be vertical or horizontal. Since there are such wide ranging sizes and resolutions, fixed pixel designs should not be used. Percentages and ems would be more appropriate.
The ratio of content to images usually needs to be adjusted. Due to the smaller screen size, this would mean less images and more content. You may even consider removing all images to optimize the speed of the website. The website overall should emphasis the content, and keep the experience much more simple compared to the full version.
For navigation, links and button sizes should be large enough to comfortably be tapped. Regular links are often very small, which is suitable for a small cursor, but not for the size of a finger. In addition to being larger, buttons should also be spaced apart, and the fonts can be larger as well. Immediate feedback should be given, such as when the button is pressed it changes color.
To ensure that the site will work across all platforms, it is better to avoid Javascript and Flash. Some devices don’t use Javascript, and the Apple mobile devices don’t support flash. Also, different devices render websites differently, and it should be accepted that certain elements will appear differently on different mobile devices.
Lastly, a very important aspect of mobile web design, is to test your site. There are many software applications which emulate the mobile browser, but these are not very accurate. The best testing process involves testing on the mobile devices themselves, to see that it works as expected and how to appears and behaves across different devices.
Do Share Your Views!!
For more updates please Subscribe to our Feeds, Follow us on Twitter and Like us on Facebook…