Before designing a mobile version of your website, make sure that a mobile website is actually your best option. Depending on your needs, you have a few options for improving your mobile presence. Your three basic options are; a separate mobile website, an app, or a full responsive website.
Take a moment for a quick self-analysis of your own website.
If you need your mobile site to perform specific functions rather than be a resource for information, you may want to consider a mobile app instead (but that would be another article).
If your site fairly complex and you don’t have the time or money to re-create it as a responsive design, you should probably go with a separate mobile website.
If you’ve decided that a separate mobile site is your best option, here are a few tips for making the design process quick and effective.
1. A little color goes a long way.
Your current website might include lots of graphics, textures and images that go along with your brand, but when it comes to mobile, the last thing you want is clutter. Stick with your basic branding colors to align the mobile site with your desktop site. Doing as much styling with CSS as possible keeps it running fast and assures it will look good on multiple screen sizes and orientations.
2. Design for the largest resolution.
Do a little research and find out the biggest screen sizes on current mobile devices and use those dimensions for your graphics. An image will always look better scaled down than blown up.Since screens are always getting bigger and bigger, it’s best to play it safe and make the graphics big. (Note: always use Photoshop’s “save for web & devices” feature to make sure these large images are the smallest possible file size).
3. Only include content that mobile users would seek.
I can’t stress enough how much a mobile website experience actually differs from a desktop website experience. Put yourself in your users’ shoes and think about what they’re looking for when accessing your website from a mobile device. Things like directions, lists of services, email/call links, etc. are things that you need to include on a mobile website. Honestly, not much else needs to be on there. You want them to be able to find what they need instantly, or they’re going to leave and look somewhere else. The best mobile websites are clear and simple, because when people are on the go they just don’t have the time to look through a million pages, links and blocks of cleverly written text.
These are just a few basic tips to think about when beginning to design your mobile website, but definitely things to consider throughout the whole process. Remember that having fewer pertinent options is better than having more less pertinent ones when it comes to mobile user experience.