Design

responsive

Mobile Site Design

It might not be something you think about when designing your future website, but more and more people are browsing the web on their mobile phones. It’s easy to design your website to be responsive – that is, have it look great on both a desktop and mobile platform – but according to an extensive research study done recently by Google, there are some key principles of design that people are looking for in mobile sites. They break up their research into five areas of design: homepage and site navigation, site search, commerce and conversion, form entry, and usability and form factor. Let’s break each of these areas down, and look at some synthesized tips that can improve your mobile site design.

Homepage and Site Navigation

When people are exploring a mobile site, they’re usually there to find some sort of direct content. As such, it’s best to keep ads and promotions down, and instead let users find their way to the information they’re looking for. This can be helped by designing short menus, having a constant link to the homepage, and consolidating extraneous effects, ads and banners.

Site Search

Since a mobile site is harder to navigate, people tend to take a “get in get out” strategy. Searching greatly helps users hone in on the specialized content they’re looking for. The first tip for designing a good search experience is to simply have an easily accessible search bar! Don’t hide it somewhere or have users click a hyperlink to get them to a search engine view. The best way to do this is to simply put a search bar in the upper portion of your site, so that it’s easy to find at the top. When actually searching, make sure that your search brings up only relevant information (limit it to your website!) and provide some sort of filters (date/topic). The filters can be in forms of hashtags or links on the side of your site, but make sure they’re mobile friendly!

Commerce and Conversion

Mobile purchasing is one of the biggest trends in mobile site construction nowadays. And in serving the millennial generation, there are a few things that people really want in their mobile buying experience. One core experience users want is the ability to finish their transaction on another device. They may start shopping on their phone during their bus ride to work, but want to finish up an order when they get to their home computer. Also, users want to be able to buy things without having an account to the site they’re buying from – that’s too much of a hassle. And if they’re repeat buyers, a convenience may people like is when their previous ordering information is stored and available to be used again (think shipping address and credit card info). Finally, users definitely want to “explore” their purchase before committing. This may mean offering samples or highlighting a stellar return policy on your site to assure customers they have the opportunity to return something if needed. As a side note, make sure to have return/customer service online and phone information somewhere easily accessible – you don’t want people digging for that!

Form Entry

When people use forms, such as entering purchasing info or registering for a new account, they generally want to do as little work as possible. This is even more true on mobile devices, as it’s harder to type and switch between fields on a small screen and smaller keyboard. So when designing forms for mobile (and even in general), try to streamline the process. Offer visual inputs as well, such as a calendar picker, to make it easier to fill in. And if you can tell people they’re missing a field or have entered incorrect information before they hit that submit button and wait for the page to reload, people will be much  less frustrated with giving you their information.

Usability and Form Factor

When designing a mobile site, it’s important to make all the visuals come into one easy, finger navigable place. You should tell users which orientation to view your site in, and reduce the amount of clicking by either having one long webpage or minimal links. Additionally, people like when they can click on content and have it dynamically enlarge on their phone, but still keep the web page in the background (think maximizing pictures). On a similar note, Google found that people are getting over the pinch to zoom feature on their phones. Don’t make people do it to see what’s on your site. And finally, your mobile site is not your desktop site. It’s ok to cut some features or play with layouts to reduce navigation and keep things simple.

There you have it! Some of the hottest tips for mobile site design in today’s world of phones, tablets and other small screened gadgets.