HomeFreebie IndexCurrent Issue

Designing a Mobile Site

     It is a fact that the number of internet users who use mobile devices has now surpassed those who use PCs. Now, let's review the design essentials of mobile sites.


     Even though today's mobile devices offer high levels of performance, they are not as powerful as PCs. Moreover, the quality of these devices' internet connections depend greatly on where users are located. This doesn't mean you can treat a mobile site like an add-on to a traditional website. Every feature your website requires (i.e., ordering, booking, inquiring) needs to be supported on your mobile site, too. Otherwise, the mobile site will be useless.


     The biggest challenge you might face when designing a mobile site is the small screen size. You need to use the small screen's area effectively. You can do this by hiding unneeded content behind a hamburger menu (an icon with three horizontal bars). However, the objects users touch (i.e., buttons and text areas) need to be large enough for their fingers, otherwise, the usability will be poor enough to turn people away. The font size should also be large enough to be legible without zooming. Or, make it possible for the users to adjust the font size. Additionally, higher contrast fonts are easier to read, especially on small screens.


     After releasing your mobile site, you need to direct mobile users to it, and PC users to your PC site. The most common technique is to read a browser's "user-agent" and direct visitors accordingly. To use this method, your server has to support this redirecting feature. Moreover, there are so many types of "user-agents" these days that it is hard to support every one of them. Alternatively, you can, by using JavaScript, read the size of screen and direct visitors to the appropriate site based on that data. In short, you should choose the method that suits your situation best.

© June, 2017