5 Fundamentals of Mobile Website Design


It's hard to ignore mobile's influence on digital commerce and Web business today, but it is still very much an emerging channel. And designing for enriched user experiences on smartphones (and even tablets) still presents a few challenges. Fortunately, over time the savviest enterprises have learned a thing or two about making mobile work.

1. Simplicity is the Golden Rule

When designing for the mobile Web, simplicity is king. Over designed websites can have reduced usability and functionality on mobile devices. To prevent this, the mobile version of a desktop website should feature the most important aspects, in the most user-friendly way. One way to do this is to omit heavy graphics and superfluous content, which can make the site more difficult to browse on a small screen.

Another way to live (or design) by the golden rule is to use a single-column layout, as opposed to the multi-column layout that is most commonly used for desktop websites. The single-column layout is most effective for mobile because it accommodates for the smaller screen size. It also provides flexibility in resolution and viewing modes on these devices. Fortunately, a multi-column layout can easily be adapted to a single-column layout for the mobile version. Additionally, if a mobile website has a lot of information that needs to be organized, collapsible navigation is an excellent solution. Folding modules can also be used, allowing content to be selectively viewed.

2. From Click to Tap, Usability is Key

In addition to simplicity, usability should be a top priority when designing a mobile website. White space and usability go hand in hand, so give users enough room to tap or select links and to navigate and interact with the site - all with their fingers. It's also important to make links large enough for the users to tap.

It's not enough to simply have large links, however. It's imperative to create an easy-to-navigate format. Information needs to be categorized for optimal navigation, with content sorted logically and with clearly labeled categories. Users will abandon a website if menus, buttons, graphics or other elements aren't legible and functional.

3. Loading Time: The Quicker the Better

There are many other reasons why a mobile user may abandon a website. Slow loading certainly tops the list. Mobile website users want to be able to access content quickly and easily, therefore quick loading time is absolutely essential. One of the determining factors of loading time is, of course, the simplicity of the website's design.

A mobile website with complex elements (e.g. large images, videos, redirects, etc.) can significantly increase loading time. It's also important to remember that the functionality of more complex mobile websites is not supported by all mobile devices, which can ultimately prevent certain objects from loading.

4. Keeping Your Objective in Mind: Focus Your Content

Keeping your primary objective in mind is very important when categorizing the content of a mobile website. It is important to know exactly what information mobile website users will be looking for when they access your website, such as location or contact details. Understanding the reasons why users will access a website through a mobile device also helps to determine how the content should be written, placed, etc.

Google Analytics can help with these efforts. It can be used to pinpoint where traffic is coming from and which sections of your website are most popular. From Google Analytics, you can also determine a number of other trends about users, which will help you to create the most effective mobile version of your website.

5. Creating a Solid Backend

Having a mobile website with a solid backend will allow you to easily make modifications as you continue to build. A stable and seamless backend will also enable you to update and add content to the site without running into errors and roadblocks. To stay ahead of this emerging trend, it's not only essential to keep these five fundamentals in mind when designing a mobile website, but to also continually work to meet the demands of an increasingly mobile audience. You can do the latter by utilizing analytics and frequently testing what works and what doesn't for your customer base.

About the Author: Hern√°n Gonzalez is the Creative Director at Dutch Monaco.

QUICK HIT: Mobile Shoppers Spend More
A recent Monetate study reveals that even though traditional desktop traffic still makes up 81.6 percent of the market share, these shoppers actually have the lowest average order value (AOV) at $91.76. Conversely, tablet shoppers only make up 8.37 percent of the website traffic marketshare, yet have a higher AOV of $96.84. Most interestingly, smartphone shoppers make up 10.03 percent of traffic and have the highest AOV of $97.82. Read more about Monetate's Ecommerce Quarterly (EQ) for Q3 2012 and discover strategies to make mobile work right away.