How To: Effectively Use White Spaces to Increase Mobile Website Conversions

Poor mobile website performance means lost business opportunities. That's because today's mobile users demand exceptional Web experiences with satisfying, convenient on-the-go downloading speeds. However, more often than not expectations aren't' being met, with many experiencing slow and unreliable mobile site performance. There are three primary reasons for mobile website fails: poorly organized content, sloppy button design and lack of white spaces. Unfortunately, many designers making initial forays into mobile development try to ensure users receive the same design and functionality consumers are accustomed to on desktop versions of their site. This initial design instinct will almost certainly contribute to the  failure of any mobile website's conversion goals. For starters, even the largest mobile screens top out at around 640x960 pixel resolution (about 4inches). That isn't very big, especially compared to a desktop computer screen.  So trying to cram a whole lot of bells and whistles into this tiny space is counter-productive to a mobile website's goals. When it comes to mobile design, white space (or negative space)  can make or break a website. That's right.  Those little pale spaces between elements are extremely important, and understanding when to be understated is often the difference between success and failure.

Four points to keep in mind when creating a layout for your mobile site:

• Mobile sites should not be cluttered.
• Have a light background to your site.
• Use bullet points instead of paragraphs for text.
• Remove unnecessary elements which take up space and data.

Keep it clean

Although it may seem counterintuitive when it comes to optimizing mobile websites for conversions, stripping away content is part of the building process. Remember, mobile website content needs to be prioritized for multi-tasking users. Understanding how and where information is being processed is key. Speed is important and the way you present the information on your site will impact heavily on the speed with which a user can digest it. Sending lots of information and providing too many options will only push users further from conversion. Content prioritization combined and proper white space practices leads to a better mobile experience.

Keep it light

White space (aka negative space) doesn't necessarily have to be white but it should be at least a lighter shade of pale to help viability of  contrasting text and images in daylight situations. Background color is very important. Developing the proper white space helps sites to fit multiple devices of varying resolutions. The more white space, the less likely your site will look cramped or stretched on different devices. Of course, it's also a good idea to design your site with multiple resolutions in mind. Dark backgrounds are never a good idea (even on a desktop) but on a mobile site it can be lethal to conversions. Remember to consider your mobile users. Sure, maybe they could increase the brightness of their display to better navigate your website, but do you really want to take a chance they will have the patience to convert if there is yet another step in the process?

Keep it moving

While banners, pictures and videos are among the most alluring bells and whistles designers employ to make websites more interesting to use, certain elements should be used sparingly.  Websites designed with the PC' in mind are often loaded with all three oof these but it's easier to get away with that when you have a big screen and a fast broadband connection. When it comes  mobile device real estate is more valuable.  Use only small pictures and provide a click image option to increase the size, but it should be a user choice. Keep banners to an absolute minimum. If you can, remove them altogether. However, if you must, it should only function as a conversion reinforcement banner like a call to action. If banners ads are used to monetize your site don't throw away your revenue stream. Just use it sensibly. Adding video is a proven way to effectively increase conversion, particularly a brand oriented one, but when it comes to mobile deploying it can be tricky. You can check the impact video has on your site with Google Website Optimizer.

Keep it straight

If it can reasonably be said that desktop users don't read a lot of text, it is more than reasonable to assert that  mobile users will stand for even less. When optimizing for mobile, remove text and replace with clear and concise bullet points. And go big with the text. Mobile users aren't very tolerable when it comes to pushing a device up to their nose to read small text. When groups of text are unavoidable, make it possible for users to hide or expand the text or to locate more information on tabs. Use headlines that summarize the text that so a user can still convert without reading everything.

Always be testing.

Don't forget to test your mobile site in varying degrees of light. There are so many different places and conditions in which a mobile user may find themselves looking at your site. Try to find them all.