Mobile sites are the best way for consumers to interact with your business while on the go. As a mobile site is a quite a bit smaller than a desktop site, the interface needs to be compact and streamlined. In particular, the navigation must be pared down and only include the most important links.
Most people have learned to navigate mobile sites, but you should still keep usability in mind. A mobile site cannot be an exact copy of the desktop version—it’s just too big! You should also keep a careful eye on the layout to make sure that people can navigate with their fingers. Few things are more frustrating when browsing the web on mobile than not being able to navigate a site.
Having a mobile site benefits consumers as well as businesses. As a business, you should take extra care to make sure your site is usable on mobile and use traditional navigation methods to help guide your audience around your site.
Mobile sites are vital to any modern enterprise. They are the best way to increase revenue going forward. Mobile shopping has overtaken brick-and-mortar and desktop shopping. Over 55% of online shopping was done via mobile devices (Internet Retailer). According to a 2012 Google survey:
The best way to get, and keep, consumers is a site that they will enjoy using. Here are some suggestions:
The search bar is one of the first navigation methods, but it should be used to supplement your navigation, not be the only way to navigate. The magnifying glass is the international symbol for the option to search, so you can save space on your site by using that icon instead of the words “Search.” The search option is most useful for people who are searching for a specific topic or title. Make sure that the search program(s) you use have an effective algorithm, or people won’t be able to find what they need.
Instead of having to list your navigation in your header, having a menu icon (usually 3 short horizontal lines) allows you to hide the navigation menu in one of the top corners of a site. Menu icons conserve space and expand to take up most or all of the screen, helping to prevent people from accidentally clicking the wrong thing. Vintage Finds You has a great example of a menu icon used effectively:
Layered navigation features a single list of items with no subitems. To make your site more user-friendly, keep the list short enough to minimise scrolling but long enough to be useful. It should include the core concepts of the desktop site. For example, Cinnamon uses layered navigation:
Nested navigation is like layered navigation but with subitems. If you have a large number of important pages on your site, group them together in categories that make sense to your audience. Then you can use the categories to help your audience find general topics and use dropdowns to direct them to specific pages. For example, The Chophouse uses nested navigation:
Icons are great visuals. They fit in seamlessly on sites that sell products in a way that mimics browsing through a physical store. It shows consumers what they are getting.
Lists are great because they are more descriptive than icons, so people can find what they need easier. Lists are especially useful for sites with tons of information, but they are also good for sites with less information too. exSite.ie has a good example of listed navigation items.
A mobile site is a much more visceral and interactive experience a desktop one. Make it one people remember for all the right reasons.